[nautilus/wip/antoniof/flow-box-preparation: 27/51] view-icon-item-ui: Apply shadow to thumbnails

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

commit f9cfebae802f013507eb6d4a65036376258d71e6
Author: António Fernandes <antoniof gnome org>
Date:   Sun Oct 31 21:24:58 2021 +0000

    view-icon-item-ui: Apply shadow to thumbnails
    
    Currently we use a dark square background for thumbnails, which doesn't
    look nice.
    
    Instead, use a shadow which tries to match the icon theme perspective.

 src/nautilus-view-icon-item-ui.c |  6 +++---
 src/resources/css/Adwaita.css    | 11 ++++++-----
 2 files changed, 9 insertions(+), 8 deletions(-)
---
diff --git a/src/nautilus-view-icon-item-ui.c b/src/nautilus-view-icon-item-ui.c
index d39417db5..1835cbef3 100644
--- a/src/nautilus-view-icon-item-ui.c
+++ b/src/nautilus-view-icon-item-ui.c
@@ -44,15 +44,15 @@ update_icon (NautilusViewIconItemUi *self)
     gtk_image_set_from_pixbuf (GTK_IMAGE (self->icon), icon_pixbuf);
 
     gtk_widget_set_size_request (self->fixed_height_box, icon_size, icon_size);
-    style_context = gtk_widget_get_style_context (self->fixed_height_box);
+    style_context = gtk_widget_get_style_context (self->icon);
     if (nautilus_can_thumbnail (file) &&
         nautilus_file_should_show_thumbnail (file))
     {
-        gtk_style_context_add_class (style_context, "icon-background");
+        gtk_style_context_add_class (style_context, "thumbnail");
     }
     else
     {
-        gtk_style_context_remove_class (style_context, "icon-background");
+        gtk_style_context_remove_class (style_context, "thumbnail");
     }
 }
 
diff --git a/src/resources/css/Adwaita.css b/src/resources/css/Adwaita.css
index 4b64df2a6..934c3531e 100644
--- a/src/resources/css/Adwaita.css
+++ b/src/resources/css/Adwaita.css
@@ -206,11 +206,12 @@ flowboxchild:selected {
   outline-color: transparent;
 }
 
-.icon-background {
-  background-color:black;
-  border-color:#4a90d9;
-  border-style:solid;
-  border-width:0px;
+flowboxchild .thumbnail {
+  margin: 4px;
+  box-shadow: 0px 1px 2px 0px alpha(@borders, 0.5),
+              0px 0px 0px 1px alpha(@borders, 0.5),
+              0px 2px 0px 0px alpha(@borders, 0.5);
+  border-radius: 2px;
 }
 
 .icon-ui-labels-box {