From 4a450220cbd6222cd4e12dccdc06e092fbaf3814 Mon Sep 17 00:00:00 2001
From: Komer <thekomer@gmail.com>
Date: Fri, 18 Feb 2022 18:55:47 +0100
Subject: [PATCH] Improvement: GTK3&4 - file shooser pathbar consistant with
 file anagers; BUGfix: Thunar - pathbar disabled buttons color

---
 gtk-3.0/apps/_xfce.scss       |  3 ++
 gtk-3.0/gtk-dark.css          | 76 ++++++++++++++++++++---------------
 gtk-3.0/gtk.css               | 76 ++++++++++++++++++++---------------
 gtk-3.0/widgets/_dialogs.scss | 31 ++++++++------
 gtk-4.0/apps/_xfce.scss       | 11 +++--
 gtk-4.0/gtk-dark.css          | 46 +++++++++++++++++++--
 gtk-4.0/gtk.css               | 46 +++++++++++++++++++--
 gtk-4.0/widgets/_dialogs.scss | 39 ++++++++++++++++++
 8 files changed, 239 insertions(+), 89 deletions(-)

diff --git a/gtk-3.0/apps/_xfce.scss b/gtk-3.0/apps/_xfce.scss
index f52c3f5..8c64363 100755
--- a/gtk-3.0/apps/_xfce.scss
+++ b/gtk-3.0/apps/_xfce.scss
@@ -225,6 +225,9 @@ wnck-pager {
 				@include button(backdrop-active-header);
 			}
 		}
+		&:disabled {
+			color: $insensitive_fg_color;
+		}
 		//color: inherit;
 		//background-color: inherit;
 	}
diff --git a/gtk-3.0/gtk-dark.css b/gtk-3.0/gtk-dark.css
index b69ae54..116dd8b 100755
--- a/gtk-3.0/gtk-dark.css
+++ b/gtk-3.0/gtk-dark.css
@@ -1855,38 +1855,46 @@ filechooserbutton:drop(active) {
   box-shadow: none;
   border-color: transparent; }
 
-/*
-// file chooser dialog
-dialog {
-	#pathbarbox {
-		background: $headerbar_color;
-		.linked.path-bar {
-			background: $headerbar_color;
-			border-bottom: 1px solid $borders_color;
-			transition: $button_transition;
-			transition-duration: 50ms;
-			button, label, button.text-button, button.text-button.toggle, button.slider-button, button.toggle, button > label {
-				@include button(normal-header);
-				color: $headerbar_fg_color;
-				&:hover{
-					@include button(hover-header, transparent, $text_color);
-					color: $selected_bg_color;
-				}
-				&:selected, &:active, &:checked {
-					@include button(active-header);
-					color: $selected_fg_color;
-				}
-				&:backdrop {
-					transition: $backdrop_transition;
-					transition-duration: 500ms;
-					color: inherit;
-					background: transparent;
-				}
-			}
-		}
-	}
-}
-*/
+dialog #pathbarbox {
+  background: #06070c; }
+  dialog #pathbarbox .linked.path-bar {
+    background: #06070c;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
+    transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    transition-duration: 50ms; }
+    dialog #pathbarbox .linked.path-bar button {
+      color: #BFC3CD;
+      text-shadow: none;
+      box-shadow: none;
+      background: transparent;
+      border: none;
+      color: #b9bec9;
+      margin-top: 5px;
+      margin-bottom: 5px;
+      min-height: 24px; }
+      dialog #pathbarbox .linked.path-bar button:hover {
+        color: #ff6a00;
+        background: transparent; }
+      dialog #pathbarbox .linked.path-bar button:backdrop {
+        color: inherit;
+        background: transparent; }
+      dialog #pathbarbox .linked.path-bar button:selected, dialog #pathbarbox .linked.path-bar button:active, dialog #pathbarbox .linked.path-bar button:checked {
+        color: white;
+        border-radius: 1em;
+        background: linear-gradient(to right, #ff3300, #ffa100); }
+        dialog #pathbarbox .linked.path-bar button:selected:hover, dialog #pathbarbox .linked.path-bar button:active:hover, dialog #pathbarbox .linked.path-bar button:checked:hover {
+          box-shadow: 0px 0px 5px rgba(255, 106, 0, 0.98); }
+        dialog #pathbarbox .linked.path-bar button:selected:backdrop, dialog #pathbarbox .linked.path-bar button:active:backdrop, dialog #pathbarbox .linked.path-bar button:checked:backdrop {
+          color: rgba(191, 195, 205, 0.4);
+          background: rgba(255, 106, 0, 0.6); }
+        dialog #pathbarbox .linked.path-bar button:selected:backdrop, dialog #pathbarbox .linked.path-bar button:active:backdrop, dialog #pathbarbox .linked.path-bar button:checked:backdrop {
+          border-radius: 1em;
+          color: rgba(191, 195, 205, 0.4);
+          background: rgba(255, 106, 0, 0.6);
+          box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98); }
+      dialog #pathbarbox .linked.path-bar button:disabled {
+        color: #676a75; }
+
 /****************
  * Text Entries *
  ****************/
@@ -4640,7 +4648,7 @@ tooltip {
   tooltip.background {
     background-color: rgba(0, 0, 0, 0.8);
     background-clip: padding-box;
-    border: 1px solid #27292f; }
+    border: 1px solid #15161b; }
   tooltip decoration {
     background-color: transparent; }
   tooltip * {
@@ -6157,6 +6165,8 @@ wnck-pager {
         color: rgba(191, 195, 205, 0.4);
         background: rgba(255, 106, 0, 0.6);
         box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98); }
+    .thunar toolbar button:disabled {
+      color: #676a75; }
 
 .thunar toolbar.horizontal button image {
   -gtk-icon-transform: scale(1); }
diff --git a/gtk-3.0/gtk.css b/gtk-3.0/gtk.css
index b69ae54..116dd8b 100755
--- a/gtk-3.0/gtk.css
+++ b/gtk-3.0/gtk.css
@@ -1855,38 +1855,46 @@ filechooserbutton:drop(active) {
   box-shadow: none;
   border-color: transparent; }
 
-/*
-// file chooser dialog
-dialog {
-	#pathbarbox {
-		background: $headerbar_color;
-		.linked.path-bar {
-			background: $headerbar_color;
-			border-bottom: 1px solid $borders_color;
-			transition: $button_transition;
-			transition-duration: 50ms;
-			button, label, button.text-button, button.text-button.toggle, button.slider-button, button.toggle, button > label {
-				@include button(normal-header);
-				color: $headerbar_fg_color;
-				&:hover{
-					@include button(hover-header, transparent, $text_color);
-					color: $selected_bg_color;
-				}
-				&:selected, &:active, &:checked {
-					@include button(active-header);
-					color: $selected_fg_color;
-				}
-				&:backdrop {
-					transition: $backdrop_transition;
-					transition-duration: 500ms;
-					color: inherit;
-					background: transparent;
-				}
-			}
-		}
-	}
-}
-*/
+dialog #pathbarbox {
+  background: #06070c; }
+  dialog #pathbarbox .linked.path-bar {
+    background: #06070c;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
+    transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    transition-duration: 50ms; }
+    dialog #pathbarbox .linked.path-bar button {
+      color: #BFC3CD;
+      text-shadow: none;
+      box-shadow: none;
+      background: transparent;
+      border: none;
+      color: #b9bec9;
+      margin-top: 5px;
+      margin-bottom: 5px;
+      min-height: 24px; }
+      dialog #pathbarbox .linked.path-bar button:hover {
+        color: #ff6a00;
+        background: transparent; }
+      dialog #pathbarbox .linked.path-bar button:backdrop {
+        color: inherit;
+        background: transparent; }
+      dialog #pathbarbox .linked.path-bar button:selected, dialog #pathbarbox .linked.path-bar button:active, dialog #pathbarbox .linked.path-bar button:checked {
+        color: white;
+        border-radius: 1em;
+        background: linear-gradient(to right, #ff3300, #ffa100); }
+        dialog #pathbarbox .linked.path-bar button:selected:hover, dialog #pathbarbox .linked.path-bar button:active:hover, dialog #pathbarbox .linked.path-bar button:checked:hover {
+          box-shadow: 0px 0px 5px rgba(255, 106, 0, 0.98); }
+        dialog #pathbarbox .linked.path-bar button:selected:backdrop, dialog #pathbarbox .linked.path-bar button:active:backdrop, dialog #pathbarbox .linked.path-bar button:checked:backdrop {
+          color: rgba(191, 195, 205, 0.4);
+          background: rgba(255, 106, 0, 0.6); }
+        dialog #pathbarbox .linked.path-bar button:selected:backdrop, dialog #pathbarbox .linked.path-bar button:active:backdrop, dialog #pathbarbox .linked.path-bar button:checked:backdrop {
+          border-radius: 1em;
+          color: rgba(191, 195, 205, 0.4);
+          background: rgba(255, 106, 0, 0.6);
+          box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98); }
+      dialog #pathbarbox .linked.path-bar button:disabled {
+        color: #676a75; }
+
 /****************
  * Text Entries *
  ****************/
@@ -4640,7 +4648,7 @@ tooltip {
   tooltip.background {
     background-color: rgba(0, 0, 0, 0.8);
     background-clip: padding-box;
-    border: 1px solid #27292f; }
+    border: 1px solid #15161b; }
   tooltip decoration {
     background-color: transparent; }
   tooltip * {
@@ -6157,6 +6165,8 @@ wnck-pager {
         color: rgba(191, 195, 205, 0.4);
         background: rgba(255, 106, 0, 0.6);
         box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98); }
+    .thunar toolbar button:disabled {
+      color: #676a75; }
 
 .thunar toolbar.horizontal button image {
   -gtk-icon-transform: scale(1); }
diff --git a/gtk-3.0/widgets/_dialogs.scss b/gtk-3.0/widgets/_dialogs.scss
index da059ac..8792b06 100755
--- a/gtk-3.0/widgets/_dialogs.scss
+++ b/gtk-3.0/widgets/_dialogs.scss
@@ -68,7 +68,7 @@ filechooserbutton:drop(active) {
   box-shadow: none;
   border-color: transparent;
 }
-/*
+
 // file chooser dialog
 dialog {
 	#pathbarbox {
@@ -78,25 +78,32 @@ dialog {
 			border-bottom: 1px solid $borders_color;
 			transition: $button_transition;
 			transition-duration: 50ms;
-			button, label, button.text-button, button.text-button.toggle, button.slider-button, button.toggle, button > label {
+			button {
 				@include button(normal-header);
-				color: $headerbar_fg_color;
-				&:hover{
-					@include button(hover-header, transparent, $text_color);
+				color: $sidebar_fg_color;
+				margin-top: 5px;
+				margin-bottom: 5px;
+				min-height: 24px;
+				&:hover {
 					color: $selected_bg_color;
-				}
-				&:selected, &:active, &:checked {
-					@include button(active-header);
-					color: $selected_fg_color;
+					background: transparent;
 				}
 				&:backdrop {
-					transition: $backdrop_transition;
-					transition-duration: 500ms;
 					color: inherit;
 					background: transparent;
 				}
+				&:selected, &:active, &:checked {
+					@include button(active-header);
+					&:backdrop {
+						@include button(backdrop-active-header);
+					}
+				}
+				&:disabled {
+					color: $insensitive_fg_color;
+				}
+				//color: inherit;
+				//background-color: inherit;
 			}
 		}
 	}
 }
-*/
\ No newline at end of file
diff --git a/gtk-4.0/apps/_xfce.scss b/gtk-4.0/apps/_xfce.scss
index c23ae43..331a5b1 100755
--- a/gtk-4.0/apps/_xfce.scss
+++ b/gtk-4.0/apps/_xfce.scss
@@ -115,15 +115,17 @@ wnck-pager {
 // general
 #whiskermenu-window {
 	color: $fg_color;
-	background-color: $bg_color;
+	background-color: $headerbar_color;
 	border-radius: 1em;
-	border: 1px solid $borders_color;
-	box-shadow: 5px 10px 8px 10px $borders_color;
+	border-color: transparent;
+	//border: 1px solid $borders_color;
+	//box-shadow: 5px 10px 8px 10px $borders_color;
 }
 
 // corner triangle
 #whiskermenu-window box widget {
 	color: transparent;
+	background: none;
 	&:hover {
 		color: $fg_color;
 	}
@@ -223,6 +225,9 @@ wnck-pager {
 				@include button(backdrop-active-header);
 			}
 		}
+		&:disabled {
+			color: $insensitive_fg_color;
+		}
 		//color: inherit;
 		//background-color: inherit;
 	}
diff --git a/gtk-4.0/gtk-dark.css b/gtk-4.0/gtk-dark.css
index ba9d301..e78c90e 100755
--- a/gtk-4.0/gtk-dark.css
+++ b/gtk-4.0/gtk-dark.css
@@ -1831,6 +1831,42 @@ filechooserbutton:drop(active) {
   box-shadow: none;
   border-color: transparent; }
 
+dialog #pathbarbox {
+  background: #06070c; }
+  dialog #pathbarbox .linked.path-bar {
+    background: #06070c;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
+    transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    transition-duration: 50ms; }
+    dialog #pathbarbox .linked.path-bar button {
+      color: #8b8b8b;
+      text-shadow: none;
+      box-shadow: none;
+      background: transparent;
+      border: none;
+      color: #b9bec9;
+      margin-top: 5px;
+      margin-bottom: 5px;
+      min-height: 24px; }
+      dialog #pathbarbox .linked.path-bar button:hover {
+        color: #ff6a00;
+        background: transparent; }
+      dialog #pathbarbox .linked.path-bar button:backdrop {
+        color: inherit;
+        background: transparent; }
+      dialog #pathbarbox .linked.path-bar button:selected, dialog #pathbarbox .linked.path-bar button:active, dialog #pathbarbox .linked.path-bar button:checked {
+        border-radius: 1em;
+        background: linear-gradient(to right, #ff3300, #ffa100);
+        box-shadow: 0px 0px 5px rgba(255, 106, 0, 0.98);
+        color: white; }
+        dialog #pathbarbox .linked.path-bar button:selected:backdrop, dialog #pathbarbox .linked.path-bar button:active:backdrop, dialog #pathbarbox .linked.path-bar button:checked:backdrop {
+          border-radius: 1em;
+          color: rgba(191, 195, 205, 0.4);
+          background: rgba(255, 106, 0, 0.6);
+          box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98); }
+      dialog #pathbarbox .linked.path-bar button:disabled {
+        color: #676a75; }
+
 /****************
  * Text Entries *
  ****************/
@@ -5963,13 +5999,13 @@ wnck-pager {
  ****************/
 #whiskermenu-window {
   color: #BFC3CD;
-  background-color: #0E111D;
+  background-color: #06070c;
   border-radius: 1em;
-  border: 1px solid rgba(255, 255, 255, 0.05);
-  box-shadow: 5px 10px 8px 10px rgba(255, 255, 255, 0.05); }
+  border-color: transparent; }
 
 #whiskermenu-window box widget {
-  color: transparent; }
+  color: transparent;
+  background: none; }
   #whiskermenu-window box widget:hover {
     color: #BFC3CD; }
 
@@ -6062,6 +6098,8 @@ wnck-pager {
         color: rgba(191, 195, 205, 0.4);
         background: rgba(255, 106, 0, 0.6);
         box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98); }
+    .thunar toolbar button:disabled {
+      color: #676a75; }
 
 .thunar toolbar.horizontal button image {
   -gtk-icon-transform: scale(1); }
diff --git a/gtk-4.0/gtk.css b/gtk-4.0/gtk.css
index ba9d301..e78c90e 100755
--- a/gtk-4.0/gtk.css
+++ b/gtk-4.0/gtk.css
@@ -1831,6 +1831,42 @@ filechooserbutton:drop(active) {
   box-shadow: none;
   border-color: transparent; }
 
+dialog #pathbarbox {
+  background: #06070c; }
+  dialog #pathbarbox .linked.path-bar {
+    background: #06070c;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
+    transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    transition-duration: 50ms; }
+    dialog #pathbarbox .linked.path-bar button {
+      color: #8b8b8b;
+      text-shadow: none;
+      box-shadow: none;
+      background: transparent;
+      border: none;
+      color: #b9bec9;
+      margin-top: 5px;
+      margin-bottom: 5px;
+      min-height: 24px; }
+      dialog #pathbarbox .linked.path-bar button:hover {
+        color: #ff6a00;
+        background: transparent; }
+      dialog #pathbarbox .linked.path-bar button:backdrop {
+        color: inherit;
+        background: transparent; }
+      dialog #pathbarbox .linked.path-bar button:selected, dialog #pathbarbox .linked.path-bar button:active, dialog #pathbarbox .linked.path-bar button:checked {
+        border-radius: 1em;
+        background: linear-gradient(to right, #ff3300, #ffa100);
+        box-shadow: 0px 0px 5px rgba(255, 106, 0, 0.98);
+        color: white; }
+        dialog #pathbarbox .linked.path-bar button:selected:backdrop, dialog #pathbarbox .linked.path-bar button:active:backdrop, dialog #pathbarbox .linked.path-bar button:checked:backdrop {
+          border-radius: 1em;
+          color: rgba(191, 195, 205, 0.4);
+          background: rgba(255, 106, 0, 0.6);
+          box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98); }
+      dialog #pathbarbox .linked.path-bar button:disabled {
+        color: #676a75; }
+
 /****************
  * Text Entries *
  ****************/
@@ -5963,13 +5999,13 @@ wnck-pager {
  ****************/
 #whiskermenu-window {
   color: #BFC3CD;
-  background-color: #0E111D;
+  background-color: #06070c;
   border-radius: 1em;
-  border: 1px solid rgba(255, 255, 255, 0.05);
-  box-shadow: 5px 10px 8px 10px rgba(255, 255, 255, 0.05); }
+  border-color: transparent; }
 
 #whiskermenu-window box widget {
-  color: transparent; }
+  color: transparent;
+  background: none; }
   #whiskermenu-window box widget:hover {
     color: #BFC3CD; }
 
@@ -6062,6 +6098,8 @@ wnck-pager {
         color: rgba(191, 195, 205, 0.4);
         background: rgba(255, 106, 0, 0.6);
         box-shadow: 0px 0px 0px rgba(255, 106, 0, 0.98); }
+    .thunar toolbar button:disabled {
+      color: #676a75; }
 
 .thunar toolbar.horizontal button image {
   -gtk-icon-transform: scale(1); }
diff --git a/gtk-4.0/widgets/_dialogs.scss b/gtk-4.0/widgets/_dialogs.scss
index 7989722..3b9356c 100755
--- a/gtk-4.0/widgets/_dialogs.scss
+++ b/gtk-4.0/widgets/_dialogs.scss
@@ -68,3 +68,42 @@ filechooserbutton:drop(active) {
   box-shadow: none;
   border-color: transparent;
 }
+
+// file chooser dialog
+dialog {
+	#pathbarbox {
+		background: $headerbar_color;
+		.linked.path-bar {
+			background: $headerbar_color;
+			border-bottom: 1px solid $borders_color;
+			transition: $button_transition;
+			transition-duration: 50ms;
+			button {
+				@include button(normal-header);
+				color: $sidebar_fg_color;
+				margin-top: 5px;
+				margin-bottom: 5px;
+				min-height: 24px;
+				&:hover {
+					color: $selected_bg_color;
+					background: transparent;
+				}
+				&:backdrop {
+					color: inherit;
+					background: transparent;
+				}
+				&:selected, &:active, &:checked {
+					@include button(active-header);
+					&:backdrop {
+						@include button(backdrop-active-header);
+					}
+				}
+				&:disabled {
+					color: $insensitive_fg_color;
+				}
+				//color: inherit;
+				//background-color: inherit;
+			}
+		}
+	}
+}