diff options
Diffstat (limited to 'app/javascript/flavours/glitch/styles/components')
| -rw-r--r-- | app/javascript/flavours/glitch/styles/components/drawer.scss | 22 |
1 files changed, 16 insertions, 6 deletions
diff --git a/app/javascript/flavours/glitch/styles/components/drawer.scss b/app/javascript/flavours/glitch/styles/components/drawer.scss index c7581fb4f..d0d79c86b 100644 --- a/app/javascript/flavours/glitch/styles/components/drawer.scss +++ b/app/javascript/flavours/glitch/styles/components/drawer.scss @@ -50,9 +50,8 @@ contain: strict; } - .drawer__inner { + .drawer--inner { position: absolute; - background: lighten($ui-base-color, 13%) url('~flavours/glitch/images/wave-drawer.png') no-repeat bottom / 100% auto; top: 0; left: 0; box-sizing: border-box; @@ -66,11 +65,22 @@ .mastodon { flex: 1; + } + } + + @for $i from 0 through 3 { + .drawer--inner.mbstobon-#{$i} { + @if $i == 3 { + background: lighten($ui-base-color, 13%) url('~flavours/glitch/images/wave-drawer.png') no-repeat bottom / 100% auto; + } @else { + background: lighten($ui-base-color, 13%) url('~flavours/glitch/images/wave-drawer-glitched.png') no-repeat bottom / 100% auto; + } + + .mastodon { + background: url("~flavours/glitch/images/mbstobon-ui-#{$i}.png") no-repeat left bottom / contain; - @for $i from 0 through 2 { - &.mbstobon-#{$i} { - background: url("~flavours/glitch/images/mbstobon-ui-#{$i}.png") no-repeat left bottom / contain; - filter: saturate(80%) contrast(50%) brightness(50%); + @if $i != 3 { + filter: contrast(50%) brightness(50%); } } } |