Bitte teile deinen CSS-Code! Das würde eine Fehlerbehebung im TC erleichtern.
Hier ist eine etwas hackige Möglichkeit, dies umzusetzen (in common/css, NICHT in /mobile/css)
@use "lib/viewport";
@include viewport.until(md) {
.d-header:not(:has(.extra-info-wrapper.topic-info-visible)):not(:has(.extra-info-wrapper .topic-link)):not(.header-topic-info-visible) .title {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
margin: 0;
}
}
2 „Gefällt mir“
Entschuldigung, ich bin es noch nicht dazu gekommen, diese Komponente genau auf dem neuesten Stand zu halten. Ja, der Wechsel weg von den Mobile/Desktop-Ansichten hat definitiv einige der Annahmen des ursprünglichen Theme-Components gebrochen.
@Lilly danke für den Schub nach vorne in dieser Angelegenheit. Position absolute würde vorerst den Zweck erfüllen … die Neuanordnung der Elemente in dieser Komponente ist hier einfach eine CSS-Grid-Lösung.
2 „Gefällt mir“
Hey zusammen, nur ein kurzes Update: Lilly hat eine Menge Arbeit investiert, um das hier aufzuräumen und auf den neuesten Stand zu bringen. Ich habe ihre Änderungen gerade gemerged, also sollte es jetzt losgehen können.
4 „Gefällt mir“
Hey @featheredtoast, ich habe hier einen PR, um das Header-Problem mit dem Horizon-Theme bei Viewport-Größen für Klapphandys und einige Tablets zu beheben.
Ich lasse es dir zur Prüfung und zum Mergen zukommen:
5 „Gefällt mir“
sieht gut aus – lass es uns ausprobieren, danke @Lilly !
2 „Gefällt mir“
Wenn ich innerhalb eines Themas nach oben scrolle, sodass sich der Header ändert (um den Themennamen und die Kategorien anzuzeigen), hat dieser neue Header kein Hamburger-Symbol. Da das Hamburger-Symbol links vorhanden ist, ändert sich die Position des Forums-Icons. Ich frage mich, ob es möglich wäre, eine Option einzurichten, bei der das Hamburger-Symbol rechts neben dem Forums-Icon platziert wird. Das würde bedeuten, dass das Forums-Icon bei beiden Header-Typen an derselben Stelle bleibt. Danke.
P.S. Ich habe gerade festgestellt, dass das Hamburger-Symbol auf dem Desktop ohne das Theme-Plugin die ganze Zeit über sichtbar bleibt. Vielleicht könnte das auch eine Option für Mobilgeräte sein.
persönlich bin ich nicht für diese Änderung (vielleicht fühlt sich @featheredtoast anders) aber wenn du es brauchst, kannst du einfach dieses CSS in einem anderen Theme-Komponenten auf deinem Forum hinzufügen, um die Reihenfolge der Elemente zu überschreiben.
.d-header {
display: grid;
grid-template-areas: 'logo left-menu custom-header-icon-link-1 custom-header-icon-link-2 custom-header-icon-link-3 custom-header-icon-link-4 custom-header-icon-link-5 extra-info chat header-buttons search right-menu'!important;
}
Ergebnis:
Das Burger-Symbol sollte auf Mobilgeräten im gescrollten Header nicht angezeigt werden, um den Header-Bereich für längere Themenüberschriften zu maximieren.
5 „Gefällt mir“
Ich teile hier die gleiche Meinung wie @Lilly. Das Ziel war es, dass das Hamburger-Menü links sich wie in anderen Apps anfühlt… Der Sprung ist etwas, für das ich nicht optimiert habe, da die Standard-Erfahrung das bereits so handhabte.
Sobald es im Raster ist, wie sie es gezeigt hat, ist es einfach, die Positionen aller Elemente mit minimalem Input vom Basis-Theme-Komponenten hier zu aktualisieren.
Ich bin für PRs offen, wenn es genug Nachfrage gibt, aber das ist das erste Mal, dass ich aktuell eine solche Anfrage höre.
4 „Gefällt mir“
Tut sie das?
Auf dem Desktop gibt es keinen „Sprung“, da (wenn ich mich richtig erinnere) das Hamburger-Menü immer links vom Forum-Icon bleibt.
Auf Mobilgeräten gibt es ebenfalls keinen Sprung, da alles außer dem Forum-Icon ersetzt wird.
1 „Gefällt mir“
Ich habe begonnen, dein Theme-Komponente zu verwenden (danke, dass du sie geteilt hast!), und habe das Haupt-Symbol auf Mobilgeräten deaktiviert, um dies mit unserer UI/UX-Philosophie kompatibel zu machen, alles so sauber wie möglich zu halten.
1 „Gefällt mir“
