dash-to-panel: fix the custom show-apps icon

lassekongo83 · Jul 12, 2020 · 93bdd64 · 93bdd64
1 parent 40804af
commit 93bdd64
Show file tree

Hide file tree

Showing 3 changed files with 61 additions and 149 deletions.
diff --git a/gnome-shell/src/gnome-shell-high-contrast.css b/gnome-shell/src/gnome-shell-high-contrast.css
@@ -1040,47 +1040,29 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { backg
 
 #panel.dashtopanelMainPanel.dashtopanelTop .show-apps { width: 32px; }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .show-apps .overview-icon { border-radius: 0; margin: 0; background-image: url("d2p-activities.svg"); background-position: center center; }
+#panel.dashtopanelMainPanel.dashtopanelTop .show-apps > .overview-icon { border-image: url("transparent.png"); }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .show-apps:hover .overview-icon { background-image: url("d2p-activities-active.svg"); background-position: center center; background-color: transparent; }
+#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps { transition-duration: 100ms; background-image: url("d2p-activities.svg"); background-position: center center; }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps { padding: 4px 2px 4px 0; transition-duration: 100ms; }
+#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps:hover { background-image: url("d2p-activities-active.svg"); background-color: rgba(0, 0, 0, 0.8); }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps:hover { background-color: rgba(0, 0, 0, 0.8); }
+#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps { transition-duration: 100ms; background-image: url("d2p-activities.svg"); background-position: center center; }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .show-apps .overview-icon { border-radius: 0; margin: 0; background-image: url("d2p-activities.svg"); background-position: center center; }
+#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps:focus { background-image: url("d2p-activities-active.svg"); background-color: rgba(0, 0, 0, 0.8); }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .show-apps:focus .overview-icon { background-image: url("d2p-activities-active.svg"); background-position: center center; background-color: transparent; }
+#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps { transition-duration: 100ms; background-image: url("d2p-activities.svg"); background-position: center center; }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps { padding: 4px 2px 4px 0; transition-duration: 100ms; }
+#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps:active { background-image: url("d2p-activities-active.svg"); background-color: rgba(0, 0, 0, 0.8); }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps:focus { background-color: rgba(0, 0, 0, 0.8); }
+#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps { transition-duration: 100ms; background-image: url("d2p-activities.svg"); background-position: center center; }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .show-apps .overview-icon { border-radius: 0; margin: 0; background-image: url("d2p-activities.svg"); background-position: center center; }
+#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps:checked { background-image: url("d2p-activities-active.svg"); background-color: rgba(0, 0, 0, 0.8); }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .show-apps:active .overview-icon { background-image: url("d2p-activities-active.svg"); background-position: center center; background-color: transparent; }
+#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps { transition-duration: 100ms; background-image: url("d2p-activities.svg"); background-position: center center; }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps { padding: 4px 2px 4px 0; transition-duration: 100ms; }
+#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps:overview { background-image: url("d2p-activities-active.svg"); background-color: rgba(0, 0, 0, 0.8); }
 
-#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps:active { background-color: rgba(0, 0, 0, 0.8); }
-
-#panel.dashtopanelMainPanel.dashtopanelTop .show-apps .overview-icon { border-radius: 0; margin: 0; background-image: url("d2p-activities.svg"); background-position: center center; }
-
-#panel.dashtopanelMainPanel.dashtopanelTop .show-apps:checked .overview-icon { background-image: url("d2p-activities-active.svg"); background-position: center center; background-color: transparent; }
-
-#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps { padding: 4px 2px 4px 0; transition-duration: 100ms; }
-
-#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps:checked { background-color: rgba(0, 0, 0, 0.8); }
-
-#panel.dashtopanelMainPanel.dashtopanelTop .show-apps .overview-icon { border-radius: 0; margin: 0; background-image: url("d2p-activities.svg"); background-position: center center; }
-
-#panel.dashtopanelMainPanel.dashtopanelTop .show-apps:overview .overview-icon { background-image: url("d2p-activities-active.svg"); background-position: center center; background-color: transparent; }
-
-#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps { padding: 4px 2px 4px 0; transition-duration: 100ms; }
-
-#panel.dashtopanelMainPanel.dashtopanelTop .dash-item-container .show-apps:overview { background-color: rgba(0, 0, 0, 0.8); }
-
-#panel.dashtopanelMainPanel.dashtopanelTop .show-apps-icon { color: transparent; }
+#panel.dashtopanelMainPanel.dashtopanelTop .show-apps-icon { color: transparent; border-image: url("transparent.png"); }
 
 #panel.dashtopanelMainPanel.dashtopanelTop .app-well-app { margin: 0 2px; border-radius: 0; }
 
@@ -1138,8 +1120,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { backg
 
 #panel.dashtopanelMainPanel.dashtopanelTop .running4.focused .overview-icon, #panel.dashtopanelMainPanel.dashtopanelTop .running4:hover .overview-icon { border-image: url("transparent.png"); }
 
-#panel.dashtopanelMainPanel.dashtopanelTop > #panelRight { background-color: black; border-radius: 2px 0 0 0; }
-
 #panel.dashtopanelMainPanel.dashtopanelBottom .panel-button { text-shadow: black 0 1px 1px; }
 
 #panel.dashtopanelMainPanel.dashtopanelBottom .panel-button:hover { background-color: rgba(255, 255, 255, 0.15); }
@@ -1148,47 +1128,29 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { backg
 
 #panel.dashtopanelMainPanel.dashtopanelBottom .show-apps { width: 32px; }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps .overview-icon { border-radius: 0; margin: 0; background-image: url("d2p-activities.svg"); background-position: center center; }
+#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps > .overview-icon { border-image: url("transparent.png"); }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps:hover .overview-icon { background-image: url("d2p-activities-active.svg"); background-position: center center; background-color: transparent; }
+#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps { transition-duration: 100ms; background-image: url("d2p-activities.svg"); background-position: center center; }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps { padding: 4px 2px 4px 0; transition-duration: 100ms; }
+#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps:hover { background-image: url("d2p-activities-active.svg"); background-color: rgba(0, 0, 0, 0.8); }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps:hover { background-color: rgba(0, 0, 0, 0.8); }
+#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps { transition-duration: 100ms; background-image: url("d2p-activities.svg"); background-position: center center; }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps .overview-icon { border-radius: 0; margin: 0; background-image: url("d2p-activities.svg"); background-position: center center; }
+#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps:focus { background-image: url("d2p-activities-active.svg"); background-color: rgba(0, 0, 0, 0.8); }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps:focus .overview-icon { background-image: url("d2p-activities-active.svg"); background-position: center center; background-color: transparent; }
+#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps { transition-duration: 100ms; background-image: url("d2p-activities.svg"); background-position: center center; }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps { padding: 4px 2px 4px 0; transition-duration: 100ms; }
+#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps:active { background-image: url("d2p-activities-active.svg"); background-color: rgba(0, 0, 0, 0.8); }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps:focus { background-color: rgba(0, 0, 0, 0.8); }
+#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps { transition-duration: 100ms; background-image: url("d2p-activities.svg"); background-position: center center; }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps .overview-icon { border-radius: 0; margin: 0; background-image: url("d2p-activities.svg"); background-position: center center; }
+#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps:checked { background-image: url("d2p-activities-active.svg"); background-color: rgba(0, 0, 0, 0.8); }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps:active .overview-icon { background-image: url("d2p-activities-active.svg"); background-position: center center; background-color: transparent; }
+#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps { transition-duration: 100ms; background-image: url("d2p-activities.svg"); background-position: center center; }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps { padding: 4px 2px 4px 0; transition-duration: 100ms; }
+#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps:overview { background-image: url("d2p-activities-active.svg"); background-color: rgba(0, 0, 0, 0.8); }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps:active { background-color: rgba(0, 0, 0, 0.8); }
-
-#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps .overview-icon { border-radius: 0; margin: 0; background-image: url("d2p-activities.svg"); background-position: center center; }
-
-#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps:checked .overview-icon { background-image: url("d2p-activities-active.svg"); background-position: center center; background-color: transparent; }
-
-#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps { padding: 4px 2px 4px 0; transition-duration: 100ms; }
-
-#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps:checked { background-color: rgba(0, 0, 0, 0.8); }
-
-#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps .overview-icon { border-radius: 0; margin: 0; background-image: url("d2p-activities.svg"); background-position: center center; }
-
-#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps:overview .overview-icon { background-image: url("d2p-activities-active.svg"); background-position: center center; background-color: transparent; }
-
-#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps { padding: 4px 2px 4px 0; transition-duration: 100ms; }
-
-#panel.dashtopanelMainPanel.dashtopanelBottom .dash-item-container .show-apps:overview { background-color: rgba(0, 0, 0, 0.8); }
-
-#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps-icon { color: transparent; }
+#panel.dashtopanelMainPanel.dashtopanelBottom .show-apps-icon { color: transparent; border-image: url("transparent.png"); }
 
 #panel.dashtopanelMainPanel.dashtopanelBottom .app-well-app { margin: 0 2px; border-radius: 0; }
 
@@ -1246,8 +1208,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { backg
 
 #panel.dashtopanelMainPanel.dashtopanelBottom .running4.focused .overview-icon, #panel.dashtopanelMainPanel.dashtopanelBottom .running4:hover .overview-icon { border-image: url("transparent.png"); }
 
-#panel.dashtopanelMainPanel.dashtopanelBottom > #panelRight { background-color: black; border-radius: 2px 0 0 0; }
-
 stage { -st-icon-style: symbolic; }
 
 .toggle-switch { width: 48px; }

diff --git a/gnome-shell/src/gnome-shell-sass/widgets/_third-party.scss b/gnome-shell/src/gnome-shell-sass/widgets/_third-party.scss
@@ -13,30 +13,27 @@
     }
 
     .show-apps { width: 32px; } // Should not be lower than the image width
+    // Gets rid of the default hover effect
+    .show-apps > .overview-icon { border-image: url("transparent.png"); }
 
     // panel dash icon
     @each $d in hover, focus, active, checked, overview {
-      .show-apps .overview-icon {
-        border-radius: 0;
-        margin: 0;
-        background-image: url("d2p-activities.svg");
-        background-position: center center;
-      }
-
-      .show-apps:#{$d} .overview-icon {
-        background-image: url("d2p-activities-active.svg");
-        background-position: center center;
-        background-color: transparent;
-      }
-
       .dash-item-container .show-apps {
-        padding: 4px 2px 4px 0;
+        //padding: 4px 2px 4px 0;
         transition-duration: 100ms;
-        &:#{$d} { background-color: transparentize(black, 0.2); }
+        background-image: url("d2p-activities.svg");
+        background-position: center center;
+        &:#{$d} {
+          background-image: url("d2p-activities-active.svg");
+          background-color: transparentize(black, 0.2);
+        }
       }
     }
 
-    .show-apps-icon { color: transparent; } // Hides the default icon
+    .show-apps-icon {
+      color: transparent; // Hides the default icon
+      border-image: url("transparent.png"); // Will most likely disable any custom icons set by the user
+    }
 
     @each $c in 1, 2, 3, 4 {
       .app-well-app {
@@ -74,10 +71,5 @@
         &.focused .overview-icon, &:hover .overview-icon { border-image: url("transparent.png"); } // Removes the default bg color
       }
     }
-    // clock and system menu area
-    & > #panelRight {
-      background-color: $panel_bg_color;
-      border-radius: 2px 0 0 0;
-    }
   }
 }