mirror of
https://github.com/Chocobozzz/PeerTube.git
synced 2025-10-04 18:29:27 +02:00
Decrease settings menu opacity
This commit is contained in:
parent
cd8ad77515
commit
84dbcb5f11
5 changed files with 16 additions and 17 deletions
|
@ -1,9 +1,7 @@
|
|||
@use "sass:color";
|
||||
|
||||
$primary-foreground-color: #fff;
|
||||
$primary-foreground-opacity: 0.9;
|
||||
$primary-foreground-opacity-hover: 1;
|
||||
$primary-background-color: rgba(0, 0, 0, 0.8);
|
||||
$fg-opacity: 0.9;
|
||||
$fg-opacity-hover: 1;
|
||||
|
||||
$font-size: 13px;
|
||||
|
||||
|
|
|
@ -13,7 +13,7 @@ $context-menu-width: 350px;
|
|||
z-index: 105; // On top of the progress bar
|
||||
|
||||
.vjs-menu-content {
|
||||
opacity: $primary-foreground-opacity;
|
||||
opacity: $fg-opacity;
|
||||
color: pvar(--embed-fg);
|
||||
font-size: $font-size !important;
|
||||
font-weight: $font-semibold;
|
||||
|
@ -27,7 +27,7 @@ $context-menu-width: 350px;
|
|||
justify-content: flex-start;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
background-color: var(--embed-background-color-hover);
|
||||
}
|
||||
|
||||
[class^="vjs-icon-"] {
|
||||
|
|
|
@ -88,10 +88,10 @@ $chapter-marker-size: 9px;
|
|||
transition: opacity 0.1s;
|
||||
|
||||
&:not(.vjs-disabled) {
|
||||
opacity: $primary-foreground-opacity;
|
||||
opacity: $fg-opacity;
|
||||
|
||||
&:hover {
|
||||
opacity: $primary-foreground-opacity-hover;
|
||||
opacity: $fg-opacity-hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -154,7 +154,7 @@ $chapter-marker-size: 9px;
|
|||
.vjs-duration,
|
||||
.vjs-peertube {
|
||||
color: pvar(--embed-fg);
|
||||
opacity: $primary-foreground-opacity;
|
||||
opacity: $fg-opacity;
|
||||
}
|
||||
|
||||
.vjs-time-control {
|
||||
|
@ -195,7 +195,7 @@ $chapter-marker-size: 9px;
|
|||
|
||||
.vjs-pt-live-control {
|
||||
width: auto;
|
||||
opacity: $primary-foreground-opacity; // videojs adds a .vjs-disabled when the live is synced
|
||||
opacity: $fg-opacity; // videojs adds a .vjs-disabled when the live is synced
|
||||
font-size: var(--control-bar-font-size);
|
||||
|
||||
@include margin-right(auto);
|
||||
|
@ -204,7 +204,7 @@ $chapter-marker-size: 9px;
|
|||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
opacity: $primary-foreground-opacity-hover;
|
||||
opacity: $fg-opacity-hover;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -480,7 +480,7 @@ $chapter-marker-size: 9px;
|
|||
|
||||
&.enabled,
|
||||
&.enabled:hover {
|
||||
opacity: $primary-foreground-opacity !important;
|
||||
opacity: $fg-opacity !important;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
|
|
|
@ -5,10 +5,11 @@
|
|||
@use "./_player-mixins" as *;
|
||||
|
||||
body {
|
||||
--embed-foreground-color: #{$primary-foreground-color};
|
||||
--embed-background-color: #{$primary-background-color};
|
||||
--embed-foreground-color: #fff;
|
||||
--embed-background-color: rgba(0, 0, 0, 0.6);
|
||||
--embed-background-color-hover: rgba(255, 255, 255, 0.1);
|
||||
|
||||
--embed-big-play-background-color: #{$primary-background-color};
|
||||
--embed-big-play-background-color: rgba(0, 0, 0, 0.8);
|
||||
|
||||
// Prevent z-index bug with Firefox PiP button
|
||||
// See:
|
||||
|
@ -85,7 +86,7 @@ body {
|
|||
}
|
||||
|
||||
.vjs-control-bar {
|
||||
opacity: $primary-foreground-opacity-hover;
|
||||
opacity: $fg-opacity-hover;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -88,7 +88,7 @@ $setting-transition-easing: ease-out;
|
|||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
background-color: var(--embed-background-color-hover);
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue