Horizon-Thema

Gibt es Überlegungen, Horizon auf voller Breite zu gestalten? Ich finde, dass es in der Mitte etwas eingeschränkt (wie in einem Korsett?) wirkt und eine vollständige Ausdehnung es schön entspannen würde.

4 „Gefällt mir“

Nein, das ist nicht geplant. Wir behalten eine begrenzte Breite bei, die einer optimalen Leselänge entspricht.

2 „Gefällt mir“

Hallo, ich habe versucht, das Theme vorab anzusehen, aber das ist alles, was ich sehe:

Mache ich etwas falsch?

1 „Gefällt mir“

Ich habe es gerade (allerdings mobil) getestet und es funktioniert bei mir einwandfrei. Gibt es etwas in der Konsole? Oder können Sie einen anderen Browser zum Überprüfen versuchen?

1 „Gefällt mir“

Danke @chapoi! Meine Konsole:

1 „Gefällt mir“

Okay, ja, das kann ich definitiv reproduzieren. Ich denke, das liegt daran, dass Horizon wahrscheinlich in den Kern verschoben wurde. Muss herausfinden, wie der Vorschau-Link korrigiert werden kann, falls überhaupt möglich. (Die Vorschau nur auf Meta ist am einfachsten – Thema aktualisiert)

Nichtsdestotrotz können Sie es hier auf Meta in der Vorschau anzeigen, indem Sie zum Theme wechseln.

2 „Gefällt mir“

Vielen Dank, es funktioniert jetzt!

1 „Gefällt mir“

Dashboard: Schaltflächentext standardmäßig unsichtbar + Layout-Fehlausrichtung in „Top Verweisende Themen“ und „Trend-Suchbegriffe“

Hallo

Ich verwende das Horizon-Theme und habe mehrere UI-Probleme im Admin-Dashboard festgestellt, insbesondere in den Abschnitten „Top Verweisende Themen“ und „Trend-Suchbegriffe“.

:magnifying_glass_tilted_left: Problem 1: Schaltflächentext ist standardmäßig unsichtbar bis zum Darüberfahren mit der Maus

Ort: Schaltflächen in beiden Abschnitten (z. B. „Thema anzeigen“, „Suchbegriff anzeigen“)

Erwartetes Verhalten: Die Schaltflächenbeschriftung sollte jederzeit sichtbar sein (normaler Zustand).

:straight_ruler: Problem 2: Ungleichgewicht der Spaltenbreite und Textumbruch

Ort: Tabellenspalten in beiden Widgets

Beobachtetes Layout:

Thema / Begriffe-Spalte: zu schmal → lange Titel werden vertikal umbrochen (z. B. mehrzeiliger Text in einer einzigen Zeile).

Numerische Spalten (Aufrufe, Klicks, Suchen usw.): übermäßig breit → übermäßiger Leerraum.

Zusätzliches Problem: Numerische Werte sind rechtsbündig ausgerichtet (Standard für Zahlen), was in RTL-Kontexten (wie Persisch/Arabisch) zu visueller Inkonsistenz führt. Für eine bessere Benutzererfahrung in RTL-Lokalisierungen sollten numerische Spalten rechtsbündig bleiben, aber die Spalten für Themen/Begriffe müssen linksbündig sein – derzeit erscheinen sie in RTL rechtsbündig, was zu Fehlausrichtungen führt.

Vielen Dank für Ihre Arbeit am Horizon-Theme.

1 „Gefällt mir“

Danke für diese Meldungen, wird behoben!

Für das nächste Mal gilt jedoch: Einige Screenshots sind hilfreicher, um schneller zu erkennen, worum es geht, als reiner Text.

1 „Gefällt mir“

Mobile Ad Container Overflow bei internen Anzeigen – RTL/LTR Layout-Fehlanpassung

Hallo

Ich verwende das Horizon-Theme mit dem offiziellen House Ads-Plugin und habe eine benutzerdefinierte Komponente erstellt, um Anzeigen mithilfe von CSS-Variablen und Layout-Regeln zu gestalten, die mit dem Designsystem von Discourse kompatibel sind.

:mobile_phone: Problem: Anzeigen-Container läuft auf Mobilgeräten aus dem Viewport aus (sowohl LTR als auch RTL)

  • Theme: Horizon (nicht reproduzierbar im Standard-Theme oder anderen Themes wie Material usw.)
  • Plugin: House Ads + benutzerdefinierte Komponente
  • Gerät: Mobil
  • Verhalten:
    • Wenn Seitensprache = Englisch (LTR) → linker Rand von .ad-container wird abgeschnitten (läuft nach links über).
    • Wenn Seitensprache = Persisch/Arabisch (RTL) → rechter Rand wird abgeschnitten (läuft nach rechts über).
  • Erwartet: Die Anzeigenkarte sollte vollständig im Viewport enthalten, zentriert oder an der Breite des Beitragstextes ausgerichtet sein.

Mein CSS-Code:

Zusammenfassung
:root {
  /* Kernfarben */
  --ad-bg: var(--secondary);
  --ad-border: var(--highlight);
  --ad-text: var(--primary);

  /* Label */
  --ad-label-bg: var(--highlight);
  --ad-label-text: var(--danger);
}


.house-creative {
  margin-left: 0 !important;
}


.house-creative a.between-posts-ad {
  display: block;
  text-decoration: none;
  color: inherit;
  background-color: transparent;
  font-family: inherit;
}

/* ===============================
   Karten-Container
   =============================== */

.house-creative .ad-container {
    direction: rtl !important;
    text-align: center !important;
margin-bottom: 20px;
      padding: 10px 5px;
     max-width: calc(#{$topic-avatar-width} + #{$topic-body-width} + (#{$topic-body-width-padding} * 2));  background-color: var(--ad-bg);
  border: 2px solid var(--ad-border);
  border-radius: 10px;

  box-sizing: border-box;
  line-height: 1.7;

  color: var(--ad-text);

  transition:
    background-color 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease,
    transform 0.2s ease;
}

.house-creative a.between-posts-ad:hover .ad-container {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}


.house-creative .ad-label {
    display: inline-block;       
    text-align: center;   
    margin-bottom: 6px;
     padding: 4px 12px;

  font-size: 0.85em;
  font-weight: 700;
  text-transform: uppercase;

  background-color: var(--ad-label-bg);
  color: var(--ad-label-text);

  border-radius: 999px;
}

.house-creative .ad-container .ad-text {
  margin: 0;

  font-size: 1rem;
  line-height: 1.9;
  color: var(--ad-text);

  direction: rtl ;
  text-align: center !important ;
  unicode-bidi: isolate;
}


@media (max-width: 480px) {
  .house-creative .ad-container {
direction: rtl !important;
text-align: center !important; 
padding: 16px 12px; 
width: 100%;
max-width: 100%;

  }
}

Horizon ist (noch) nicht mit allen Komponenten und Plugins kompatibel.

1 „Gefällt mir“