Breakpoint für header-main anpassen

Shopware 6 (German) Themes & Design
1

Hallo zusammen,

ich experimentiere gerade mit einem eigenen Theme für Shopware 6 herum. Nun würde ich gerne den Breakpoint explizit für den Header anpassen (aktuell wird ja bei 576 px z. B. die Eingabemaske der Suche ausgeblendet und erst bei Klick auf die Lupe wieder eingeblendet). Diesen Effekt hätte ich nun schon gerne bereits bei 900 px Viewport.

Ich habe gedacht, das vielleicht das Hochsetzen der Variable “–breakpoint-sm” im CSS ausreichen könnte, das ist allerdings nicht der Fall.

Vielen Dank für Hinweise!

2

Niemand eine Idee hierzu? Ich habe inzwischen so alles durch, was mir einfällt…

3

Shopware-Team? Ein kleiner Tipp?

4

Versuch das mal:

_header.scss

@include media-breakpoint-up(sm) {
    .header-search-col {
        .collapse:not(.show) {
            display: none;
        }
    }
}

@include media-breakpoint-up(lg) {
    .header-search-col {
        .collapse:not(.show) {
            display: block;
        }
    }
}

 header.html.twig

{% block layout_header_search_toggle %}
 
....
1 „Gefällt mir“