Merge pull request #264 from jere-ortega24/fix-popup-menu-selected-co…

…lors Fix popup menu selected colors
vinceliuice · Oct 31, 2022 · 09ef628 · 09ef628
2 parents e99b7f0 + b5e8f76
commit 09ef628
Show file tree

Hide file tree

Showing 9 changed files with 30 additions and 18 deletions.
diff --git a/src/_sass/gnome-shell/widgets-common/_slider.scss b/src/_sass/gnome-shell/widgets-common/_slider.scss
@@ -23,6 +23,8 @@
   -barlevel-overdrive-border-color: $destructive_color;
   -barlevel-overdrive-separator-width: 2px;
 
+  .popup-menu-item:hover &,
+  .popup-menu-item:focus &,
   .popup-menu-item.selected & {
     -slider-background-color: rgba(black, 0.2);
     -slider-active-background-color: $selected_fg_color;

diff --git a/src/_sass/gnome-shell/widgets-common/_switches.scss b/src/_sass/gnome-shell/widgets-common/_switches.scss
@@ -8,6 +8,8 @@
 
   &:checked { background-image: url("assets/switch-on.svg"); }
 
+  .popup-menu-item:hover &,
+  .popup-menu-item:focus &,
   .popup-menu-item.selected & {
     background-image: url("assets/switch-off-selected.svg");
 

diff --git a/src/gnome-shell/gnome-shell-theme.gresource.xml b/src/gnome-shell/gnome-shell-theme.gresource.xml
@@ -35,5 +35,13 @@
     <file alias="gdm3.css">gnome-shell.css</file>
     <file alias="Yaru/gnome-shell.css">gnome-shell.css</file>
     <file alias="Yaru-dark/gnome-shell.css">gnome-shell.css</file>
+    <file alias="Yaru/assets/switch-off.svg">assets/switch-off.svg</file>
+    <file alias="Yaru/assets/switch-on.svg">assets/switch-on.svg</file>
+    <file alias="Yaru/assets/switch-off-selected.svg">assets/switch-off-selected.svg</file>
+    <file alias="Yaru/assets/switch-on-selected.svg">assets/switch-on-selected.svg</file>
+    <file alias="Yaru-dark/assets/switch-off.svg">assets/switch-off.svg</file>
+    <file alias="Yaru-dark/assets/switch-on.svg">assets/switch-on.svg</file>
+    <file alias="Yaru-dark/assets/switch-off-selected.svg">assets/switch-off-selected.svg</file>
+    <file alias="Yaru-dark/assets/switch-on-selected.svg">assets/switch-on-selected.svg</file>
   </gresource>
 </gresources>
diff --git a/src/gnome-shell/theme-3-32/gnome-shell-Dark.css b/src/gnome-shell/theme-3-32/gnome-shell-Dark.css
@@ -289,11 +289,11 @@ StEntry StLabel.hint-text {
   background-image: url("assets/switch-on.svg");
 }
 
-.popup-menu-item.selected .toggle-switch {
+.popup-menu-item:hover .toggle-switch, .popup-menu-item:focus .toggle-switch, .popup-menu-item.selected .toggle-switch {
   background-image: url("assets/switch-off-selected.svg");
 }
 
-.popup-menu-item.selected .toggle-switch:checked {
+.popup-menu-item:hover .toggle-switch:checked, .popup-menu-item:focus .toggle-switch:checked, .popup-menu-item.selected .toggle-switch:checked {
   background-image: url("assets/switch-on-selected.svg");
 }
 
@@ -319,7 +319,7 @@ StEntry StLabel.hint-text {
   -barlevel-overdrive-separator-width: 2px;
 }
 
-.popup-menu-item.selected .slider {
+.popup-menu-item:hover .slider, .popup-menu-item:focus .slider, .popup-menu-item.selected .slider {
   -slider-background-color: rgba(0, 0, 0, 0.2);
   -slider-active-background-color: #ffffff;
   -barlevel-background-color: rgba(0, 0, 0, 0.2);

diff --git a/src/gnome-shell/theme-3-32/gnome-shell.css b/src/gnome-shell/theme-3-32/gnome-shell.css
@@ -289,11 +289,11 @@ StEntry StLabel.hint-text {
   background-image: url("assets/switch-on.svg");
 }
 
-.popup-menu-item.selected .toggle-switch {
+.popup-menu-item:hover .toggle-switch, .popup-menu-item:focus .toggle-switch, .popup-menu-item.selected .toggle-switch {
   background-image: url("assets/switch-off-selected.svg");
 }
 
-.popup-menu-item.selected .toggle-switch:checked {
+.popup-menu-item:hover .toggle-switch:checked, .popup-menu-item:focus .toggle-switch:checked, .popup-menu-item.selected .toggle-switch:checked {
   background-image: url("assets/switch-on-selected.svg");
 }
 
@@ -319,7 +319,7 @@ StEntry StLabel.hint-text {
   -barlevel-overdrive-separator-width: 2px;
 }
 
-.popup-menu-item.selected .slider {
+.popup-menu-item:hover .slider, .popup-menu-item:focus .slider, .popup-menu-item.selected .slider {
   -slider-background-color: rgba(0, 0, 0, 0.2);
   -slider-active-background-color: #ffffff;
   -barlevel-background-color: rgba(0, 0, 0, 0.2);

diff --git a/src/gnome-shell/theme-40-0/gnome-shell-Dark.css b/src/gnome-shell/theme-40-0/gnome-shell-Dark.css
@@ -289,11 +289,11 @@ StEntry StLabel.hint-text {
   background-image: url("assets/switch-on.svg");
 }
 
-.popup-menu-item.selected .toggle-switch {
+.popup-menu-item:hover .toggle-switch, .popup-menu-item:focus .toggle-switch, .popup-menu-item.selected .toggle-switch {
   background-image: url("assets/switch-off-selected.svg");
 }
 
-.popup-menu-item.selected .toggle-switch:checked {
+.popup-menu-item:hover .toggle-switch:checked, .popup-menu-item:focus .toggle-switch:checked, .popup-menu-item.selected .toggle-switch:checked {
   background-image: url("assets/switch-on-selected.svg");
 }
 
@@ -319,7 +319,7 @@ StEntry StLabel.hint-text {
   -barlevel-overdrive-separator-width: 2px;
 }
 
-.popup-menu-item.selected .slider {
+.popup-menu-item:hover .slider, .popup-menu-item:focus .slider, .popup-menu-item.selected .slider {
   -slider-background-color: rgba(0, 0, 0, 0.2);
   -slider-active-background-color: #ffffff;
   -barlevel-background-color: rgba(0, 0, 0, 0.2);

diff --git a/src/gnome-shell/theme-40-0/gnome-shell.css b/src/gnome-shell/theme-40-0/gnome-shell.css
@@ -289,11 +289,11 @@ StEntry StLabel.hint-text {
   background-image: url("assets/switch-on.svg");
 }
 
-.popup-menu-item.selected .toggle-switch {
+.popup-menu-item:hover .toggle-switch, .popup-menu-item:focus .toggle-switch, .popup-menu-item.selected .toggle-switch {
   background-image: url("assets/switch-off-selected.svg");
 }
 
-.popup-menu-item.selected .toggle-switch:checked {
+.popup-menu-item:hover .toggle-switch:checked, .popup-menu-item:focus .toggle-switch:checked, .popup-menu-item.selected .toggle-switch:checked {
   background-image: url("assets/switch-on-selected.svg");
 }
 
@@ -319,7 +319,7 @@ StEntry StLabel.hint-text {
   -barlevel-overdrive-separator-width: 2px;
 }
 
-.popup-menu-item.selected .slider {
+.popup-menu-item:hover .slider, .popup-menu-item:focus .slider, .popup-menu-item.selected .slider {
   -slider-background-color: rgba(0, 0, 0, 0.2);
   -slider-active-background-color: #ffffff;
   -barlevel-background-color: rgba(0, 0, 0, 0.2);

diff --git a/src/gnome-shell/theme-42-0/gnome-shell-Dark.css b/src/gnome-shell/theme-42-0/gnome-shell-Dark.css
@@ -329,11 +329,11 @@ StEntry StLabel.hint-text {
   background-image: url("assets/switch-on.svg");
 }
 
-.popup-menu-item.selected .toggle-switch {
+.popup-menu-item:hover .toggle-switch, .popup-menu-item:focus .toggle-switch, .popup-menu-item.selected .toggle-switch {
   background-image: url("assets/switch-off-selected.svg");
 }
 
-.popup-menu-item.selected .toggle-switch:checked {
+.popup-menu-item:hover .toggle-switch:checked, .popup-menu-item:focus .toggle-switch:checked, .popup-menu-item.selected .toggle-switch:checked {
   background-image: url("assets/switch-on-selected.svg");
 }
 
@@ -359,7 +359,7 @@ StEntry StLabel.hint-text {
   -barlevel-overdrive-separator-width: 2px;
 }
 
-.popup-menu-item.selected .slider {
+.popup-menu-item:hover .slider, .popup-menu-item:focus .slider, .popup-menu-item.selected .slider {
   -slider-background-color: rgba(0, 0, 0, 0.2);
   -slider-active-background-color: #ffffff;
   -barlevel-background-color: rgba(0, 0, 0, 0.2);

diff --git a/src/gnome-shell/theme-42-0/gnome-shell.css b/src/gnome-shell/theme-42-0/gnome-shell.css
@@ -329,11 +329,11 @@ StEntry StLabel.hint-text {
   background-image: url("assets/switch-on.svg");
 }
 
-.popup-menu-item.selected .toggle-switch {
+.popup-menu-item:hover .toggle-switch, .popup-menu-item:focus .toggle-switch, .popup-menu-item.selected .toggle-switch {
   background-image: url("assets/switch-off-selected.svg");
 }
 
-.popup-menu-item.selected .toggle-switch:checked {
+.popup-menu-item:hover .toggle-switch:checked, .popup-menu-item:focus .toggle-switch:checked, .popup-menu-item.selected .toggle-switch:checked {
   background-image: url("assets/switch-on-selected.svg");
 }
 
@@ -359,7 +359,7 @@ StEntry StLabel.hint-text {
   -barlevel-overdrive-separator-width: 2px;
 }
 
-.popup-menu-item.selected .slider {
+.popup-menu-item:hover .slider, .popup-menu-item:focus .slider, .popup-menu-item.selected .slider {
   -slider-background-color: rgba(0, 0, 0, 0.2);
   -slider-active-background-color: #ffffff;
   -barlevel-background-color: rgba(0, 0, 0, 0.2);