[nautilus/wip/antoniof/experimental-gtk4-build: 46/52] CSS

[António Fernandes <antoniof src gnome org>]

commit 140b8da1b234da4d1f742e6a4c4ac23a73fc6da7
Author: António Fernandes <antoniof gnome org>
Date:   Tue Dec 21 12:32:26 2021 +0000

    CSS

 src/nautilus-application.c    | 34 ++++++++------------------------
 src/resources/css/Adwaita.css | 46 +++++++++++++++++++++----------------------
 2 files changed, 30 insertions(+), 50 deletions(-)
---
diff --git a/src/nautilus-application.c b/src/nautilus-application.c
index 505001f1a..e47916b8f 100644
--- a/src/nautilus-application.c
+++ b/src/nautilus-application.c
@@ -1117,41 +1117,26 @@ theme_changed (GtkSettings *settings)
 {
     static GtkCssProvider *provider = NULL;
     static GtkCssProvider *permanent_provider = NULL;
-    gchar *theme;
     GdkDisplay *display;
-    GFile *file;
 
-    g_object_get (settings, "gtk-theme-name", &theme, NULL);
     display = gdk_display_get_default ();
 
     /* CSS that themes can override */
-    if (g_str_equal (theme, "Adwaita") || g_str_equal (theme, "Adwaita-dark"))
+    if (provider == NULL)
     {
-        if (provider == NULL)
-        {
-            provider = gtk_css_provider_new ();
-            file = g_file_new_for_uri ("resource:///org/gnome/nautilus/css/Adwaita.css");
-            gtk_css_provider_load_from_file (provider, file);
-            g_object_unref (file);
-        }
-
-        gtk_style_context_add_provider_for_display (display,
-                                                    GTK_STYLE_PROVIDER (provider),
-                                                    GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
-    }
-    else if (provider != NULL)
-    {
-        gtk_style_context_remove_provider_for_display (display,
-                                                       GTK_STYLE_PROVIDER (provider));
-        g_clear_object (&provider);
+        provider = gtk_css_provider_new ();
+        gtk_css_provider_load_from_resource (provider, "/org/gnome/nautilus/css/Adwaita.css");
     }
 
+    gtk_style_context_add_provider_for_display (display,
+                                                GTK_STYLE_PROVIDER (provider),
+                                                GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
+
     /* CSS we want to always load for any theme */
     if (permanent_provider == NULL)
     {
         permanent_provider = gtk_css_provider_new ();
-        file = g_file_new_for_uri ("resource:///org/gnome/nautilus/css/nautilus.css");
-        gtk_css_provider_load_from_file (permanent_provider, file);
+        gtk_css_provider_load_from_resource (permanent_provider, "/org/gnome/nautilus/css/nautilus.css");
         /* The behavior of two style providers with the same priority is
          * undefined and gtk happens to prefer the provider that got added last.
          * Use a higher priority here to avoid this problem.
@@ -1159,10 +1144,7 @@ theme_changed (GtkSettings *settings)
         gtk_style_context_add_provider_for_display (display,
                                                     GTK_STYLE_PROVIDER (permanent_provider),
                                                     GTK_STYLE_PROVIDER_PRIORITY_APPLICATION + 1);
-        g_object_unref (file);
     }
-
-    g_free (theme);
 }
 
 static void
diff --git a/src/resources/css/Adwaita.css b/src/resources/css/Adwaita.css
index 8a0bb9c01..21cf56e11 100644
--- a/src/resources/css/Adwaita.css
+++ b/src/resources/css/Adwaita.css
@@ -1,7 +1,7 @@
 .nautilus-window,
 .nautilus-window notebook,
 .nautilus-window notebook > stack {
-    background: @theme_base_color;
+    background: @view_bg_color;
 }
 
 .nautilus-empty-state-icon {
@@ -15,8 +15,8 @@
 @keyframes needs_attention_keyframes {
     0% {background-image: linear-gradient(to bottom, #fafafa, #ededed 40%,  #e0e0e0); border-color: 
@borders; }
     /* can't do animation-direction, so holding the color on two keyframes */
-    30% {background-image: linear-gradient(to bottom, @theme_base_color, @theme_base_color, 
@theme_base_color); border-color: @theme_fg_color; }
-    90% {background-image: linear-gradient(to bottom, @theme_base_color, @theme_base_color, 
@theme_base_color); border-color: @theme_fg_color; }
+    30% {background-image: linear-gradient(to bottom, @view_bg_color, @view_bg_color, @view_bg_color); 
border-color: @theme_fg_color; }
+    90% {background-image: linear-gradient(to bottom, @view_bg_color, @view_bg_color, @view_bg_color); 
border-color: @theme_fg_color; }
     100% {background-image: linear-gradient(to bottom, #fafafa, #ededed 40%,  #e0e0e0); border-color: 
@borders; }
 }
 
@@ -35,25 +35,25 @@
   background: none;
 }
 
-.disclosure-button {
+.disclosure-button > * {
   padding-left: 4px;
   padding-right: 4px;
 }
 
 /* Path bar */
 
-.nautilus-path-bar scrolledwindow {
-  border-radius: 5px 0px 0px 5px;
-  border: 1px @borders solid;
+.nautilus-path-bar > scrolledwindow {
+  margin: 6px 0px 6px 0px;
+  border-radius: 6px 0px 0px 6px;
   border-right-width: 0px;
-  background-color: @theme_bg_color;
+  background-color: alpha(currentColor, 0.1);
 }
-.path-bar-box scrolledwindow undershoot.left {
-  border-radius: 5px 0px 0px 5px;
-  background: linear-gradient(to right, @theme_bg_color 6px, alpha(@theme_bg_color, 0) 24px);
+.nautilus-path-bar > scrolledwindow undershoot.left {
+  border-radius: 6px 0px 0px 6px;
+  background: linear-gradient(to right, @headerbar_shade_color 6px, alpha(@headerbar_shade_color, 0) 24px);
 }
-.path-bar-box scrolledwindow undershoot.right {
-  background: linear-gradient(to left, @theme_bg_color 6px, alpha(@theme_bg_color, 0) 24px);
+.nautilus-path-bar > scrolledwindow undershoot.right {
+  background: linear-gradient(to left, @headerbar_shade_color 6px, alpha(@headerbar_shade_color, 0) 24px);
 }
 
 .nautilus-path-bar > button,
@@ -62,19 +62,20 @@
 }
 
 .path-buttons-box button {
-  background-image: none;
+  margin: 0px;
   box-shadow: none;
   border-radius: 7px;
   border-width: 0px;
   -gtk-icon-shadow: none;
 }
 
-.path-buttons-box button:not(.current-dir):not(:backdrop):hover {
-  background: alpha(@theme_fg_color, 0.15);
-  box-shadow: inset 0 0 0 2px @theme_bg_color;
+.path-buttons-box button:not(:hover),
+.path-buttons-box button.current-dir
+{
+  background: none;
 }
 
-.path-buttons-box button:not(.current-dir):not(:backdrop):hover * {
+.path-buttons-box button:not(.current-dir):not(:backdrop):hover label {
   opacity: 1;
 }
 
@@ -107,11 +108,11 @@ entry.search > * {
 /* Floating status bar */
 .floating-bar {
   padding: 3px;
-  background-color: @theme_base_color;
+  background-color: @view_bg_color;
   border-width: 1px;
   border-style: solid solid none;
   border-color: @borders;
-  border-radius: 8px 8px 0 0;
+  border-radius: 8px 0 0 0;
 }
 
 .floating-bar.bottom.left { /* axes left border and border radius */
@@ -199,7 +200,7 @@ entry.search > * {
 
 /* Icon view */
 flowbox {
-  padding: 18px
+  padding: 18px;
 }
 
 flowboxchild {
@@ -230,9 +231,6 @@ flowboxchild:selected .icon-ui-labels-box {
 }
 
 flowboxchild:selected image {
-  -gtk-icon-effect: dim; /* GTK 3 only */
-  /* GTK 4 TODO: Replace previous line with the following one:
   -gtk-icon-filter: opacity(0.5);
-  */
   -gtk-icon-shadow: 0px 0px @theme_selected_bg_color;
 }