From 65e65f44620699f1d14206d503594bafa5e0ea49 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Sat, 23 Nov 2024 14:33:44 +0100 Subject: Tabbar --- src/objects/_tabbar.scss | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/src/objects/_tabbar.scss b/src/objects/_tabbar.scss index b059b6e..342cd60 100644 --- a/src/objects/_tabbar.scss +++ b/src/objects/_tabbar.scss @@ -20,10 +20,20 @@ padding-inline: calc(.5 * props.get(vars.$spacing)); margin-inline: calc(-.5 * props.get(vars.$spacing)); overflow-inline: auto; - box-shadow: 0 calc(-1 * props.get(vars.$indicator--width)) 0 0 props.get(vars.$railing--bg-color) inset; + + &::after { + display: block; + flex: 1 1 auto; + block-size: props.get(vars.$indicator--width); + margin-block-start: auto; + content: ''; + background-color: props.get(vars.$railing--bg-color); + } @include bem.modifier('quiet') { - box-shadow: none; + &::after { + display: none; + } } @include bem.modifier('adapt') { @@ -36,7 +46,7 @@ align-items: center; color: props.get(vars.$tab--text-color); white-space: nowrap; - border-block: props.get(vars.$indicator--width) solid transparent; + border-block: props.get(vars.$indicator--width) solid props.get(vars.$railing--bg-color); &::before { position: absolute; -- cgit v1.2.3-70-g09d2