BaseSliderPlugin | Breite von Container

Shopware 6 (German) Themes & Design
,
1

Hallo,

Ich nutze eine Ableitung vom BaseSliderPlugin (Tiny Slider 2) und würde gerne den Container in der Breite beschränken, sowie noch links und rechts ein margin einbauen, damit ich Platz für die Buttons habe.
Aktuell sieht es so aus:

image
image875×71 7.73 KB

Dummy Struktur:

<div class="listing-action-wrapper"> // width: 100%; flex;
    <div class="mini-navigation-container"> //width: 70%
        <div class="mini-navigation-slider" data-mini-navigation="true" data-mini-navigation-options="..."> // width: 100%
            <div class="sidebar-mini-menu-controls">
                <button class="left">...</button> // 40px breit
                <button class="right">...</button> // 40px breit
            </div>
            <ul class="sidebar-mini-menu-list" data-mini-navigation-container="true">
            ...
            </ul>
        </div>
    </div>

    <div class="sorting-dropdown"> // 30%
        // Sorting button
    </div>
</div>

Zusätzlich hab ich ich für das .tns-outer noch folgende Eigenschaft im CSS definiert. Die Buttons sind ca 40px breit, weshalb ich hier die Breite um 90px reduziere und um 45px versetze.

.tns-outer {
    width: calc(100% - 90px);
    margin-left: 45px;
}

Leider werden weitere Einträge nach „Elektronik“ nicht angezeigt, nur wenn ich händisch mit der Maus bei aktiviertem MouseDrag noch etwas weiter rausziehe. Auch mit den Buttons komme ich nicht mehr weiter raus. Der nicht mehr sichtbare Bereich ist in der Regel so beit wie der gesamte übergeordnete Container, in dem Beispiel quasi bis ans rechte Ende vom hellgrauen Button.

Es scheint, als würde er den übergeordneten container „listing-action-wrapper“ als Begrenzung nehmen, statt den „mini-navigation-container“.

Was mache ich hier falsch?
Lg Alex