X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fsass%2Fplayer%2Fsettings-menu.scss;h=d2346c126929eea3e247dbef0a1b477ba65d838b;hb=77239b425a8e00822a53c9907415832a473c3eb6;hp=d495785b379766f3b13082801155f366418bf111;hpb=8cbc40b2fe9d36ef0505b9441276ca561342e9e9;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/sass/player/settings-menu.scss b/client/src/sass/player/settings-menu.scss index d495785b3..d2346c126 100644 --- a/client/src/sass/player/settings-menu.scss +++ b/client/src/sass/player/settings-menu.scss @@ -1,5 +1,6 @@ @use '_variables' as *; @use '_mixins' as *; +@use '_icons' as *; @use './_player-variables' as *; $setting-transition-duration: 0.15s; @@ -9,26 +10,6 @@ $setting-transition-easing: ease-out; .video-js { - .vjs-settings { - @include disable-outline; - - cursor: pointer; - width: 33px; - - .vjs-icon-placeholder { - display: inline-block; - width: 17px; - height: 17px; - vertical-align: middle; - background: url('#{$assets-path}/player/images/settings.svg') no-repeat; - background-size: contain; - - &::before { - content: ''; - } - } - } - .vjs-settings-sub-menu-title { width: 4em; text-transform: initial; @@ -42,6 +23,7 @@ $setting-transition-easing: ease-out; opacity: $primary-foreground-opacity; margin: 0 auto; font-size: $font-size !important; + z-index: 100; width: auto; overflow: hidden; @@ -137,7 +119,7 @@ $setting-transition-easing: ease-out; } > .vjs-settings-sub-menu { - width: 80px; + min-width: 80px; .vjs-menu-item { outline: 0; @@ -146,7 +128,6 @@ $setting-transition-easing: ease-out; padding: 5px 8px; &.vjs-back-button { - background-color: inherit; padding: 8px 8px 13px 12px; margin-bottom: 5px; border-bottom: 1px solid #808080; @@ -164,6 +145,10 @@ $setting-transition-easing: ease-out; color: inherit; position: relative; + &:focus { + background-color: rgba(115, 133, 159, 0.5); + } + &::before { @include icon(15px);