Klebende Avatare für Mobilgeräte

Anpassung Themenkomponente
1
      • Beschreiben Sie dieses Thema/diese Komponente in ein oder zwei Sätzen * *

Hallo :wave: Diese Theme-Komponente aktiviert Sticky-Avatare für Mobilgeräte.

      • Fügen Sie Screenshots hinzu (falls zutreffend) * *

      • Fügen Sie weitere Details hinzu und erklären Sie die Einstellungen (falls zutreffend) * *

Ich habe die Kernfunktion für Sticky-Avatare wiederverwendet, um sie auf Mobilgeräten nutzbar zu machen.
Der gesamte Abschnitt (Avatar des Themas + Metadaten des Themas) ist oben angeheftet. Wenn die Höhe des Beitrags außerhalb des Bildschirms lang ist oder wenn beim Scrollen nach oben bei langen Beiträgen. Ich habe den Sticky-Avatar für kurze Beiträge beim Scrollen nach oben entfernt, sodass er nur bei langen Beiträgen auf Mobilgeräten aktiviert wird.

Ich habe diese Funktion mit einer CSS-Überschreibung für persönliche Nachrichten deaktiviert.

Da ich im Sticky-Abschnitt eine Hintergrundfarbe var(--secondary) festgelegt habe, habe ich die Hervorhebung des Thema-Beitrags von .topic-post nach .topic-post .contents verschoben, sodass nur der Abschnitt unter dem Avatar und den Metadaten hervorgehoben wird. :arrow_down_small:

Bei diesem Beitrag wird nur der Inhaltsabschnitt hervorgehoben.

highlighted-post
highlighted-post497×314 38.9 KB

      • Fügen Sie die Vorschau- und Repository-Links hinzu * *

|||
|-|-|-|
| :hammer_and_wrench:|Repository| GitHub - VaperinaDEV/discourse-mobile-sticky-avatars: Sticky Avatars for Mobile |
| :question:|Installationsanleitung|So installieren Sie ein Thema oder eine Theme-Komponente|
| :open_book:|Neu bei Discourse Themes?| Anfängerleitfaden zur Verwendung von Discourse Themes

13 „Gefällt mir“
2

Großartige Arbeit, @Don!

Wie könnte ich einen Schlagschatten unter den Sticky-Avatarrahmen anwenden?
(So etwas wie: box-shadow: 0 -10px 30px 8px #CCCCCC;)

Es wäre schön, wenn es eine Funktion in der Theme-Komponente gäbe, mit der ein dezenter Schlagschatten hinzugefügt werden könnte, bei dem der Administrator einfach einen #HEX-Wert und eine Unschärfe oder etwas Ähnliches eingeben könnte. Aber wahrscheinlich ist das für Sie den Aufwand nicht wert.

Was wäre vorerst der richtige CSS-Override, um einen Schlagschatten anzuzielen/zu aktivieren?

Als ich versuchte, topic-meta-data anzuzielen, wurde der Schatten um dieses gesamte Element gelegt, nicht nur um den unteren Teil, und der Schatten umfasste auch nicht den topic-avatar.

Jeder Rat wäre sehr willkommen! :folded_hands:

3

Außerdem erhalte ich mit dieser Theme-Komponente eine Fehlermeldung (siehe unten). Wird diese Komponente nicht mehr gewartet?

[Adminhinweis] Das Theme „Sticky Avatars for Mobile“ enthält Code, der aktualisiert werden muss. (id: discourse.widgets-decommissioned) (mehr erfahren)

IMG_4376.PNG
IMG_4376.PNG1206×2622 263 KB

1 „Gefällt mir“
4

@Don irgendwelche Ideen, warum ich diesen Fehler bekomme, wenn ich meine Seite auf dem Handy besuche?

2 „Gefällt mir“