Added the ability to apply custom opacity to all elements. (#140)
* Added the ability to apply custom opacity to all elements. * Apply menu opacity to settings menu
This commit is contained in:
@@ -1,5 +1,4 @@
|
||||
.bar {
|
||||
|
||||
.bar-panel-container {
|
||||
margin-top: if($bar-floating, $bar-margin_top, 0em);
|
||||
margin-bottom: if($bar-floating, $bar-margin_bottom, 0em);
|
||||
@@ -7,8 +6,11 @@
|
||||
margin-right: if($bar-floating, $bar-margin_sides, 0em);
|
||||
}
|
||||
|
||||
|
||||
.bar-panel {
|
||||
background: if($bar-transparent, transparent, $bar-background);
|
||||
$bar-opacity-ratio: $bar-opacity / 100;
|
||||
$transparency-value: 1 - $bar-opacity-ratio;
|
||||
background: if($bar-transparent, transparent, transparentize($bar-background, $transparency-value));
|
||||
border-radius: if($bar-floating, $bar-border_radius, 0em);
|
||||
}
|
||||
}
|
||||
@@ -18,6 +20,7 @@
|
||||
border-radius: $bar-buttons-radius;
|
||||
padding: 0.2rem 0.9rem;
|
||||
margin: 0.5rem $bar-buttons-spacing;
|
||||
opacity: $bar-buttons-opacity/100;
|
||||
|
||||
&:hover {
|
||||
background: $bar-buttons-hover;
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
@import '../colors.scss';
|
||||
|
||||
window.popup {
|
||||
opacity: $bar-menus-opacity/100;
|
||||
|
||||
menuitem {
|
||||
label {
|
||||
color: $bar-menus-popover-text;
|
||||
@@ -32,6 +34,8 @@ tooltip {
|
||||
all: unset;
|
||||
}
|
||||
|
||||
opacity: $bar-menus-opacity/100;
|
||||
|
||||
font-size: 1.1em;
|
||||
|
||||
>*>* {
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
.menu-items.audio {
|
||||
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-volume-background-color);
|
||||
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-volume-border-color);
|
||||
opacity: $bar-menus-opacity/100;
|
||||
}
|
||||
|
||||
.menu-dropdown-label.audio {
|
||||
@@ -170,4 +171,4 @@
|
||||
|
||||
.menu-items-section.playback {
|
||||
border-radius: 0em;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
.menu-items.bluetooth {
|
||||
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-bluetooth-background-color);
|
||||
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-bluetooth-border-color);
|
||||
opacity: $bar-menus-opacity/100;
|
||||
}
|
||||
|
||||
.menu-items-container.bluetooth {
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
border: $bar-menus-border-size solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-clock-border-color);
|
||||
border-radius: $bar-menus-border-radius;
|
||||
margin-right: 0.5em;
|
||||
opacity: $bar-menus-opacity/100;
|
||||
}
|
||||
|
||||
.calendar-menu-item-container {
|
||||
|
||||
@@ -4,6 +4,7 @@
|
||||
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-dashboard-background-color);
|
||||
border: $bar-menus-border-size solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-dashboard-border-color);
|
||||
border-radius: $bar-menus-border-radius;
|
||||
opacity: $bar-menus-opacity/100;
|
||||
|
||||
button {
|
||||
border-radius: 0.4em;
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
.menu-items.energy {
|
||||
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-battery-background-color);
|
||||
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-battery-border-color);
|
||||
opacity: $bar-menus-opacity/100;
|
||||
}
|
||||
|
||||
.menu-items-container.energy {
|
||||
@@ -17,9 +18,9 @@
|
||||
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-battery-card-color);
|
||||
}
|
||||
|
||||
.power-profile-item {
|
||||
color: if($bar-menus-monochrome, $bar-menus-listitems-passive, $bar-menus-menu-battery-listitems-passive);
|
||||
margin-bottom: 0.5em;
|
||||
.power-profile-item {
|
||||
color: if($bar-menus-monochrome, $bar-menus-listitems-passive, $bar-menus-menu-battery-listitems-passive);
|
||||
margin-bottom: 0.5em;
|
||||
|
||||
label {
|
||||
margin-left: 1em;
|
||||
@@ -32,43 +33,45 @@
|
||||
color: if($bar-menus-monochrome, $bar-menus-icons-passive, $bar-menus-menu-battery-icons-passive);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: if($bar-menus-monochrome, $bar-menus-listitems-active, $bar-menus-menu-battery-listitems-active);
|
||||
label {
|
||||
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-battery-icons-active);
|
||||
}
|
||||
&:hover {
|
||||
color: if($bar-menus-monochrome, $bar-menus-listitems-active, $bar-menus-menu-battery-listitems-active);
|
||||
|
||||
label {
|
||||
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-battery-icons-active);
|
||||
}
|
||||
|
||||
image {
|
||||
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-battery-icons-active);
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: if($bar-menus-monochrome, $bar-menus-listitems-active, $bar-menus-menu-battery-listitems-active);
|
||||
image {
|
||||
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-battery-icons-active);
|
||||
}
|
||||
}
|
||||
&.active {
|
||||
color: if($bar-menus-monochrome, $bar-menus-listitems-active, $bar-menus-menu-battery-listitems-active);
|
||||
|
||||
image {
|
||||
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-battery-icons-active);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.brightness-container {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.brightness-slider-icon {
|
||||
font-size: 1.4em;
|
||||
min-width: 1em;
|
||||
min-height: 1em;
|
||||
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-battery-icons-active);
|
||||
}
|
||||
.brightness-slider-icon {
|
||||
font-size: 1.4em;
|
||||
min-width: 1em;
|
||||
min-height: 1em;
|
||||
color: if($bar-menus-monochrome, $bar-menus-icons-active, $bar-menus-menu-battery-icons-active);
|
||||
}
|
||||
|
||||
.brightness-slider-label {
|
||||
color: if($bar-menus-monochrome, $bar-menus-text, $bar-menus-menu-battery-text);
|
||||
font-size: 0.9em;
|
||||
min-width: 2.5em;
|
||||
font-weight: bold;
|
||||
margin-bottom: 0.2em;
|
||||
}
|
||||
.brightness-slider-label {
|
||||
color: if($bar-menus-monochrome, $bar-menus-text, $bar-menus-menu-battery-text);
|
||||
font-size: 0.9em;
|
||||
min-width: 2.5em;
|
||||
font-weight: bold;
|
||||
margin-bottom: 0.2em;
|
||||
}
|
||||
|
||||
.menu-slider.brightness {
|
||||
trough {
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
.menu-items.media {
|
||||
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-media-background-color);
|
||||
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-media-border-color);
|
||||
opacity: $bar-menus-opacity/100;
|
||||
}
|
||||
|
||||
.menu-items-container.media {
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
.menu-items.network {
|
||||
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-network-background-color);
|
||||
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-network-border-color);
|
||||
opacity: $bar-menus-opacity/100;
|
||||
}
|
||||
|
||||
.menu-items-container.network {
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
border: $bar-menus-border-size solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-notifications-border);
|
||||
border-radius: $bar-menus-border-radius;
|
||||
margin-right: 0.45em;
|
||||
opacity: $bar-menus-opacity/100;
|
||||
|
||||
.window-content.notificationsmenu-window {
|
||||
margin-right: 0.50em;
|
||||
|
||||
@@ -14,6 +14,7 @@ window#verification .verification {
|
||||
min-width: 20em;
|
||||
min-height: 6em;
|
||||
font-size: 1.3em;
|
||||
opacity: $bar-menus-opacity/100;
|
||||
|
||||
.verification-content {
|
||||
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-dashboard-powermenu-confirmation-card);
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
min-width: 26em;
|
||||
min-height: 6rem;
|
||||
border-radius: 0.6em;
|
||||
opacity: $notification-opacity/100;
|
||||
}
|
||||
|
||||
.notification-card-container {
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
.indicator {
|
||||
.osd-container {
|
||||
margin: $osd-margins;
|
||||
opacity: $osd-opacity/100;
|
||||
}
|
||||
|
||||
.osd-label-container {
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
window.settings-dialog {
|
||||
opacity: $bar-menus-opacity/100;
|
||||
background-color: $bar-menus-cards;
|
||||
color: $bar-menus-text;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user