[gnome-control-center/wip/exalm/appearance: 3/4] background: Add a color scheme switcher




commit dcbd12a27b2bf9f17f32a5f535825a2ff7b0d126
Author: Alexander Mikhaylenko <exalm7659 gmail com>
Date:   Sun Dec 12 22:46:15 2021 +0500

    background: Add a color scheme switcher

 panels/background/cc-background-panel.c    | 146 +++++++++++++++++++++++-
 panels/background/cc-background-panel.ui   |  64 +++++++++--
 panels/background/cc-background-preview.c  | 174 ++++++-----------------------
 panels/background/cc-background-preview.ui | 110 +++++-------------
 panels/background/preview.css              |  65 ++++++++---
 5 files changed, 302 insertions(+), 257 deletions(-)
---
diff --git a/panels/background/cc-background-panel.c b/panels/background/cc-background-panel.c
index efeb7fea0..18cacd4fa 100644
--- a/panels/background/cc-background-panel.c
+++ b/panels/background/cc-background-panel.c
@@ -43,6 +43,9 @@
 #define WP_PCOLOR_KEY "primary-color"
 #define WP_SCOLOR_KEY "secondary-color"
 
+#define INTERFACE_PATH_ID "org.gnome.desktop.interface"
+#define INTERFACE_COLOR_SCHEME_KEY "color-scheme"
+
 struct _CcBackgroundPanel
 {
   CcPanel parent_instance;
@@ -51,24 +54,127 @@ struct _CcBackgroundPanel
 
   GSettings *settings;
   GSettings *lock_settings;
+  GSettings *interface_settings;
 
   GnomeDesktopThumbnailFactory *thumb_factory;
+  GDBusProxy *proxy;
 
   CcBackgroundItem *current_background;
 
   CcBackgroundChooser *background_chooser;
-  CcBackgroundPreview *desktop_preview;
+  CcBackgroundPreview *light_preview;
+  CcBackgroundPreview *dark_preview;
+  GtkToggleButton *light_toggle;
+  GtkToggleButton *dark_toggle;
 };
 
 CC_PANEL_REGISTER (CcBackgroundPanel, cc_background_panel)
 
+static void
+load_custom_css (CcBackgroundPanel *self)
+{
+  g_autoptr(GtkCssProvider) provider = NULL;
+
+  /* use custom CSS */
+  provider = gtk_css_provider_new ();
+  gtk_css_provider_load_from_resource (provider, "/org/gnome/control-center/background/preview.css");
+  gtk_style_context_add_provider_for_display (gdk_display_get_default (),
+                                              GTK_STYLE_PROVIDER (provider),
+                                              GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
+}
+
+/* Color schemes */
+
+static void
+transition_screen (CcBackgroundPanel *self)
+{
+  g_autoptr (GError) error = NULL;
+
+  if (!self->proxy)
+    return;
+
+  g_dbus_proxy_call_sync (self->proxy,
+                          "Transition",
+                          NULL,
+                          G_DBUS_CALL_FLAGS_NONE,
+                          -1,
+                          NULL,
+                          &error);
+
+  if (error)
+    g_warning ("Couldn't transition screen: %s", error->message);
+}
+
+static void
+got_transition_proxy_cb (GObject      *source_object,
+                         GAsyncResult *res,
+                         gpointer      data)
+{
+  g_autoptr(GError) error = NULL;
+  CcBackgroundPanel *self = data;
+
+  self->proxy = g_dbus_proxy_new_for_bus_finish (res, &error);
+
+  if (self->proxy == NULL) {
+    g_warning ("Error creating proxy: %s", error->message);
+    return;
+  }
+}
+
+static void
+set_color_scheme (CcBackgroundPanel   *self,
+                  GDesktopColorScheme  color_scheme)
+{
+  GDesktopColorScheme scheme;
+
+  scheme = g_settings_get_enum (self->interface_settings,
+                                INTERFACE_COLOR_SCHEME_KEY);
+
+  /* We have to check the equality manually to avoid starting an unnecessary
+   * screen transition */
+  if (color_scheme == scheme)
+    return;
+
+  transition_screen (self);
+
+  g_settings_set_enum (self->interface_settings,
+                       INTERFACE_COLOR_SCHEME_KEY,
+                       color_scheme);
+}
+
+static void
+light_dark_toggle_active_cb (CcBackgroundPanel *self)
+{
+  if (gtk_toggle_button_get_active (self->light_toggle))
+    set_color_scheme (self, G_DESKTOP_COLOR_SCHEME_DEFAULT);
+  else if (gtk_toggle_button_get_active (self->dark_toggle))
+    set_color_scheme (self, G_DESKTOP_COLOR_SCHEME_PREFER_DARK);
+}
+
+static void
+reload_light_dark_toggles (CcBackgroundPanel *self)
+{
+  GDesktopColorScheme scheme;
+
+  scheme = g_settings_get_enum (self->interface_settings,
+                                INTERFACE_COLOR_SCHEME_KEY);
+
+  if (scheme == G_DESKTOP_COLOR_SCHEME_DEFAULT)
+    gtk_toggle_button_set_active (self->light_toggle, TRUE);
+  else if (scheme == G_DESKTOP_COLOR_SCHEME_PREFER_DARK)
+    gtk_toggle_button_set_active (self->dark_toggle, TRUE);
+}
+
+/* Background */
+
 static void
 update_preview (CcBackgroundPanel *panel)
 {
   CcBackgroundItem *current_background;
 
   current_background = panel->current_background;
-  cc_background_preview_set_item (panel->desktop_preview, current_background);
+  cc_background_preview_set_item (panel->light_preview, current_background);
+  cc_background_preview_set_item (panel->dark_preview, current_background);
 }
 
 static gchar *
@@ -195,10 +301,9 @@ set_background (CcBackgroundPanel *panel,
     cc_background_xml_save (panel->current_background, filename);
 }
 
-
 static void
-on_chooser_background_chosen_cb (CcBackgroundPanel          *self,
-                                 CcBackgroundItem           *item)
+on_chooser_background_chosen_cb (CcBackgroundPanel *self,
+                                 CcBackgroundItem  *item)
 {
   set_background (self, self->settings, item);
   set_background (self, self->lock_settings, item);
@@ -223,7 +328,9 @@ cc_background_panel_dispose (GObject *object)
 
   g_clear_object (&panel->settings);
   g_clear_object (&panel->lock_settings);
+  g_clear_object (&panel->interface_settings);
   g_clear_object (&panel->thumb_factory);
+  g_clear_object (&panel->proxy);
 
   G_OBJECT_CLASS (cc_background_panel_parent_class)->dispose (object);
 }
@@ -256,8 +363,12 @@ cc_background_panel_class_init (CcBackgroundPanelClass *klass)
   gtk_widget_class_set_template_from_resource (widget_class, 
"/org/gnome/control-center/background/cc-background-panel.ui");
 
   gtk_widget_class_bind_template_child (widget_class, CcBackgroundPanel, background_chooser);
-  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPanel, desktop_preview);
+  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPanel, light_preview);
+  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPanel, dark_preview);
+  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPanel, light_toggle);
+  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPanel, dark_toggle);
 
+  gtk_widget_class_bind_template_callback (widget_class, light_dark_toggle_active_cb);
   gtk_widget_class_bind_template_callback (widget_class, on_chooser_background_chosen_cb);
   gtk_widget_class_bind_template_callback (widget_class, on_add_picture_button_clicked_cb);
 }
@@ -286,10 +397,33 @@ cc_background_panel_init (CcBackgroundPanel *panel)
   panel->lock_settings = g_settings_new (WP_LOCK_PATH_ID);
   g_settings_delay (panel->lock_settings);
 
+  panel->interface_settings = g_settings_new (INTERFACE_PATH_ID);
+
   /* Load the background */
   reload_current_bg (panel);
   update_preview (panel);
 
   /* Background settings */
   g_signal_connect_object (panel->settings, "changed", G_CALLBACK (on_settings_changed), panel, 
G_CONNECT_SWAPPED);
+
+  /* Interface settings */
+  reload_light_dark_toggles (panel);
+
+  g_signal_connect_object (panel->interface_settings,
+                           "changed::" INTERFACE_COLOR_SCHEME_KEY,
+                           G_CALLBACK (reload_light_dark_toggles),
+                           panel,
+                           G_CONNECT_SWAPPED);
+
+  g_dbus_proxy_new_for_bus (G_BUS_TYPE_SESSION,
+                            G_DBUS_PROXY_FLAGS_NONE,
+                            NULL,
+                            "org.gnome.Shell",
+                            "/org/gnome/Shell/ScreenTransition",
+                            "org.gnome.Shell.ScreenTransition",
+                            NULL,
+                            got_transition_proxy_cb,
+                            panel);
+
+  load_custom_css (panel);
 }
diff --git a/panels/background/cc-background-panel.ui b/panels/background/cc-background-panel.ui
index 6d50deb62..615ce4d83 100644
--- a/panels/background/cc-background-panel.ui
+++ b/panels/background/cc-background-panel.ui
@@ -26,26 +26,74 @@
 
                     <child>
                       <object class="AdwPreferencesGroup">
+                        <property name="title" translatable="yes">Style</property>
 
                         <child>
                           <object class="AdwPreferencesRow">
                             <property name="activatable">False</property>
+                            <property name="focusable">False</property>
                             <child>
                               <object class="AdwClamp">
-                                <property name="visible">1</property>
-                                <property name="maximum_size">300</property>
-                                <property name="tightening_threshold">200</property>
+                                <property name="maximum_size">400</property>
+                                <property name="tightening_threshold">300</property>
                                 <child>
-                                  <object class="GtkBox">
-                                    <property name="spacing">24</property>
+                                  <object class="GtkGrid">
+                                    <property name="column-spacing">24</property>
+                                    <property name="row-spacing">12</property>
                                     <property name="margin-start">12</property>
                                     <property name="margin-end">12</property>
                                     <property name="margin-top">18</property>
-                                    <property name="margin-bottom">18</property>
+                                    <property name="margin-bottom">12</property>
                                     <property name="hexpand">True</property>
                                     <child>
-                                      <object class="CcBackgroundPreview" id="desktop_preview">
-                                        <property name="valign">center</property>
+                                      <object class="GtkToggleButton" id="light_toggle">
+                                        <signal name="notify::active" handler="light_dark_toggle_active_cb" 
swapped="true"/>
+                                        <child>
+                                          <object class="CcBackgroundPreview" id="light_preview"/>
+                                        </child>
+                                        <style>
+                                          <class name="background-preview-button"/>
+                                        </style>
+                                        <layout>
+                                          <property name="column">0</property>
+                                          <property name="row">0</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkLabel">
+                                        <property name="label" translatable="yes">Light</property>
+                                        <layout>
+                                          <property name="column">0</property>
+                                          <property name="row">1</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkToggleButton" id="dark_toggle">
+                                        <property name="group">light_toggle</property>
+                                        <signal name="notify::active" handler="light_dark_toggle_active_cb" 
swapped="true"/>
+                                        <child>
+                                          <object class="CcBackgroundPreview" id="dark_preview">
+                                            <property name="is-dark">True</property>
+                                          </object>
+                                        </child>
+                                        <style>
+                                          <class name="background-preview-button"/>
+                                        </style>
+                                        <layout>
+                                          <property name="column">1</property>
+                                          <property name="row">0</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkLabel">
+                                        <property name="label" translatable="yes">Dark</property>
+                                        <layout>
+                                          <property name="column">1</property>
+                                          <property name="row">1</property>
+                                        </layout>
                                       </object>
                                     </child>
                                   </object>
diff --git a/panels/background/cc-background-preview.c b/panels/background/cc-background-preview.c
index b9985db5b..2a39a8cd1 100644
--- a/panels/background/cc-background-preview.c
+++ b/panels/background/cc-background-preview.c
@@ -26,24 +26,14 @@ struct _CcBackgroundPreview
 {
   GtkWidget         parent;
 
-  GtkImage         *animated_background_icon;
-  GtkLabel         *desktop_clock_label;
-  GtkFrame         *desktop_frame;
   GtkDrawingArea   *drawing_area;
-  GtkFrame         *lock_frame;
-  GtkLabel         *lock_screen_label;
   GtkWidget        *overlay;
-  GtkStack         *stack;
+  GtkWidget        *light_dark_window;
 
   GnomeDesktopThumbnailFactory *thumbnail_factory;
 
+  gboolean          is_dark;
   CcBackgroundItem *item;
-  GSettings        *desktop_settings;
-
-  guint             lock_screen_time_timeout_id;
-  gboolean          is_lock_screen;
-  GDateTime        *previous_time;
-  gboolean          is_24h_format;
 };
 
 G_DEFINE_TYPE (CcBackgroundPreview, cc_background_preview, GTK_TYPE_WIDGET)
@@ -51,106 +41,13 @@ G_DEFINE_TYPE (CcBackgroundPreview, cc_background_preview, GTK_TYPE_WIDGET)
 enum
 {
   PROP_0,
-  PROP_IS_LOCK_SCREEN,
+  PROP_IS_DARK,
   PROP_ITEM,
   N_PROPS
 };
 
 static GParamSpec *properties [N_PROPS];
 
-/* Auxiliary methods */
-
-static void
-update_lock_screen_label (CcBackgroundPreview *self,
-                          gboolean             force)
-{
-  g_autoptr(GDateTime) now = NULL;
-  g_autofree gchar *label = NULL;
-
-  now = g_date_time_new_now_local ();
-
-  /* Don't update the label if the hour:minute pair did not change */
-  if (!force && self->previous_time &&
-      g_date_time_get_hour (now) == g_date_time_get_hour (self->previous_time) &&
-      g_date_time_get_minute (now) == g_date_time_get_minute (self->previous_time))
-    {
-      return;
-    }
-
-  if (self->is_24h_format)
-    label = g_date_time_format (now, "%R");
-  else
-    label = g_date_time_format (now, "%I:%M %p");
-
-  gtk_label_set_label (self->lock_screen_label, label);
-  gtk_label_set_label (self->desktop_clock_label, label);
-
-  g_clear_pointer (&self->previous_time, g_date_time_unref);
-  self->previous_time = g_steal_pointer (&now);
-}
-
-static void
-update_clock_format (CcBackgroundPreview *self)
-{
-  g_autofree gchar *clock_format = NULL;
-  gboolean is_24h_format;
-
-  clock_format = g_settings_get_string (self->desktop_settings, "clock-format");
-  is_24h_format = g_strcmp0 (clock_format, "24h") == 0;
-
-  if (is_24h_format != self->is_24h_format)
-    {
-      self->is_24h_format = is_24h_format;
-      update_lock_screen_label (self, TRUE);
-    }
-}
-
-static void
-load_custom_css (CcBackgroundPreview *self)
-{
-  g_autoptr(GtkCssProvider) provider = NULL;
-
-  /* use custom CSS */
-  provider = gtk_css_provider_new ();
-  gtk_css_provider_load_from_resource (provider, "/org/gnome/control-center/background/preview.css");
-  gtk_style_context_add_provider_for_display (gdk_display_get_default (),
-                                              GTK_STYLE_PROVIDER (provider),
-                                              GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
-
-}
-
-static gboolean
-update_clock_cb (gpointer data)
-{
-  CcBackgroundPreview *self = data;
-
-  update_lock_screen_label (self, FALSE);
-
-  return G_SOURCE_CONTINUE;
-}
-
-static void
-start_monitor_time (CcBackgroundPreview *self)
-{
-  if (self->lock_screen_time_timeout_id > 0)
-    return;
-
-  self->lock_screen_time_timeout_id = g_timeout_add_seconds (1,
-                                                             update_clock_cb,
-                                                             self);
-}
-
-static void
-stop_monitor_time (CcBackgroundPreview *self)
-{
-  if (self->lock_screen_time_timeout_id > 0)
-    {
-      g_source_remove (self->lock_screen_time_timeout_id);
-      self->lock_screen_time_timeout_id = 0;
-    }
-}
-
-
 /* Callbacks */
 
 static void
@@ -198,15 +95,28 @@ cc_background_preview_finalize (GObject *object)
 {
   CcBackgroundPreview *self = (CcBackgroundPreview *)object;
 
-  g_clear_object (&self->desktop_settings);
   g_clear_object (&self->item);
   g_clear_object (&self->thumbnail_factory);
 
-  g_clear_pointer (&self->previous_time, g_date_time_unref);
+  G_OBJECT_CLASS (cc_background_preview_parent_class)->finalize (object);
+}
 
-  stop_monitor_time (self);
+static void
+set_is_dark (CcBackgroundPreview *self,
+             gboolean             is_dark)
+{
+  self->is_dark = is_dark;
 
-  G_OBJECT_CLASS (cc_background_preview_parent_class)->finalize (object);
+  if (self->is_dark)
+    {
+      gtk_widget_add_css_class (self->light_dark_window, "dark");
+      gtk_widget_remove_css_class (self->light_dark_window, "light");
+    }
+  else
+    {
+      gtk_widget_add_css_class (self->light_dark_window, "light");
+      gtk_widget_remove_css_class (self->light_dark_window, "dark");
+    }
 }
 
 static void
@@ -219,9 +129,8 @@ cc_background_preview_get_property (GObject    *object,
 
   switch (prop_id)
     {
-    case PROP_IS_LOCK_SCREEN:
-      g_value_set_boolean (value, self->is_lock_screen);
-      break;
+    case PROP_IS_DARK:
+      g_value_set_boolean (value, self->is_dark);
 
     case PROP_ITEM:
       g_value_set_object (value, self->item);
@@ -242,10 +151,8 @@ cc_background_preview_set_property (GObject      *object,
 
   switch (prop_id)
     {
-    case PROP_IS_LOCK_SCREEN:
-      self->is_lock_screen = g_value_get_boolean (value);
-      gtk_stack_set_visible_child (self->stack,
-                                   self->is_lock_screen ? GTK_WIDGET (self->lock_frame) : GTK_WIDGET 
(self->desktop_frame));
+    case PROP_IS_DARK:
+      set_is_dark (self, g_value_get_boolean (value));
       break;
 
     case PROP_ITEM:
@@ -356,11 +263,11 @@ cc_background_preview_class_init (CcBackgroundPreviewClass *klass)
   widget_class->measure = cc_background_preview_measure;
   widget_class->size_allocate = cc_background_preview_size_allocate;
 
-  properties[PROP_IS_LOCK_SCREEN] = g_param_spec_boolean ("is-lock-screen",
-                                                          "Lock screen",
-                                                          "Whether the preview is of the lock screen",
-                                                          FALSE,
-                                                          G_PARAM_READWRITE | G_PARAM_STATIC_STRINGS);
+  properties[PROP_IS_DARK] = g_param_spec_boolean ("is-dark",
+                                                   "Is dark",
+                                                   "Whether the preview is dark",
+                                                   FALSE,
+                                                   G_PARAM_READWRITE | G_PARAM_STATIC_STRINGS);
 
   properties[PROP_ITEM] = g_param_spec_object ("item",
                                                "Item",
@@ -372,14 +279,11 @@ cc_background_preview_class_init (CcBackgroundPreviewClass *klass)
 
   gtk_widget_class_set_template_from_resource (widget_class, 
"/org/gnome/control-center/background/cc-background-preview.ui");
 
-  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPreview, animated_background_icon);
-  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPreview, desktop_clock_label);
-  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPreview, desktop_frame);
   gtk_widget_class_bind_template_child (widget_class, CcBackgroundPreview, drawing_area);
-  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPreview, lock_frame);
-  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPreview, lock_screen_label);
   gtk_widget_class_bind_template_child (widget_class, CcBackgroundPreview, overlay);
-  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPreview, stack);
+  gtk_widget_class_bind_template_child (widget_class, CcBackgroundPreview, light_dark_window);
+
+  gtk_widget_class_set_css_name (widget_class, "background-preview");
 }
 
 static void
@@ -388,17 +292,6 @@ cc_background_preview_init (CcBackgroundPreview *self)
   gtk_widget_init_template (GTK_WIDGET (self));
 
   self->thumbnail_factory = gnome_desktop_thumbnail_factory_new (GNOME_DESKTOP_THUMBNAIL_SIZE_LARGE);
-  self->desktop_settings = g_settings_new ("org.gnome.desktop.interface");
-
-  g_signal_connect_object (self->desktop_settings,
-                           "changed::clock-format",
-                           G_CALLBACK (update_clock_format),
-                           self,
-                           G_CONNECT_SWAPPED);
-
-  update_clock_format (self);
-  load_custom_css (self);
-  start_monitor_time (self);
 }
 
 CcBackgroundItem*
@@ -419,9 +312,6 @@ cc_background_preview_set_item (CcBackgroundPreview *self,
   if (!g_set_object (&self->item, item))
     return;
 
-  gtk_widget_set_visible (GTK_WIDGET (self->animated_background_icon),
-                          cc_background_item_changes_with_time (item));
-
   gtk_drawing_area_set_draw_func (self->drawing_area, draw_preview_func, self, NULL);
   gtk_widget_queue_draw (GTK_WIDGET (self->drawing_area));
 
diff --git a/panels/background/cc-background-preview.ui b/panels/background/cc-background-preview.ui
index f2bc9f97b..891f370b3 100644
--- a/panels/background/cc-background-preview.ui
+++ b/panels/background/cc-background-preview.ui
@@ -2,15 +2,10 @@
 <interface>
   <!-- interface-requires gtk+ 3.0 -->
   <template class="CcBackgroundPreview" parent="GtkWidget">
-    <property name="hexpand">True</property>
-    <property name="vexpand">False</property>
-    <style>
-      <class name="frame" />
-    </style>
+    <property name="overflow">hidden</property>
 
     <child>
       <object class="GtkOverlay" id="overlay">
-       <property name="hexpand">True</property>
 
         <!-- Wallpaper -->
         <child>
@@ -22,96 +17,45 @@
           </object>
         </child>
 
-        <!-- Desktop / Lock Screen widgets -->
+        <!-- Always dark window -->
         <child type="overlay">
-          <object class="GtkStack" id="stack">
-            <property name="hexpand">True</property>
-            <property name="vexpand">True</property>
-
-            <child>
-              <object class="GtkFrame" id="desktop_frame">
-                <property name="valign">start</property>
-                <style>
-                  <class name="desktop-preview" />
-                </style>
-
-                <child>
-                  <object class="GtkCenterBox">
-
-                    <child type="start">
-                      <object class="GtkLabel">
-                       <property name="label" translatable="yes">Activities</property>
-                      </object>
-                    </child>
-
-                    <child type="center">
-                      <object class="GtkLabel" id="desktop_clock_label">
-                     </object>
-                    </child>
-
-                    <child type="end">
-                      <object class="GtkBox">
-                       <property name="spacing">4</property>
-
-                        <child>
-                          <object class="GtkImage">
-                           <property name="icon-name">network-wireless-symbolic</property>
-                            <property name="pixel-size">6</property>
-                          </object>
-                        </child>
-
-                        <child>
-                          <object class="GtkImage">
-                           <property name="icon-name">audio-volume-high-symbolic</property>
-                            <property name="pixel-size">6</property>
-                          </object>
-                        </child>
-
-                        <child>
-                          <object class="GtkImage">
-                           <property name="icon-name">battery-low-symbolic</property>
-                            <property name="pixel-size">6</property>
-                          </object>
-                        </child>
-                      </object>
-                    </child>
-                  </object>
-                </child>
-
-              </object>
-            </child>
-
-
+          <object class="AdwBin">
+            <property name="halign">end</property>
+            <property name="valign">start</property>
+            <property name="overflow">hidden</property>
+            <style>
+              <class name="window"/>
+              <class name="dark"/>
+            </style>
             <child>
-              <object class="GtkFrame" id="lock_frame">
-                <child>
-                  <object class="GtkLabel" id="lock_screen_label">
-                    <property name="hexpand">True</property>
-                    <property name="vexpand">True</property>
-                    <property name="xalign">0.5</property>
-                    <property name="yalign">0.5</property>
-                  </object>
-                </child>
+              <object class="AdwBin">
                 <style>
-                  <class name="lock-screen-preview" />
+                  <class name="header-bar"/>
                 </style>
+                <property name="valign">start</property>
               </object>
             </child>
           </object>
         </child>
 
-        <!-- Wallpaper -->
+        <!-- Light/dark window -->
         <child type="overlay">
-          <object class="GtkImage" id="animated_background_icon">
-           <property name="halign">end</property>
+          <object class="AdwBin" id="light_dark_window">
+            <property name="halign">start</property>
             <property name="valign">end</property>
-            <property name="margin-end">8</property>
-            <property name="margin-bottom">8</property>
-            <property name="pixel-size">16</property>
-            <property name="icon-name">slideshow-emblem</property>
+            <property name="overflow">hidden</property>
             <style>
-              <class name="slideshow-icon" />
+              <class name="window"/>
+              <class name="light"/>
             </style>
+            <child>
+              <object class="AdwBin">
+                <style>
+                  <class name="header-bar"/>
+                </style>
+                <property name="valign">start</property>
+              </object>
+            </child>
           </object>
         </child>
 
diff --git a/panels/background/preview.css b/panels/background/preview.css
index 2c9022f28..ab4489beb 100644
--- a/panels/background/preview.css
+++ b/panels/background/preview.css
@@ -1,30 +1,59 @@
-frame.desktop-preview {
-  min-height: 10px;
-  padding: 0 4px;
-  background-color: black;
-  border-radius: 0;
+background-preview {
+  border-radius: 6px;
 }
 
-frame.desktop-preview image {
-  color: white;
+background-preview .window {
+  margin: 20px;
+  min-width: 80px;
+  min-height: 60px;
+  border-radius: 6px;
+  box-shadow: 0 1px 4px 1px alpha(black, 0.13),
+              0 1px 10px 5px alpha(black, 0.09),
+              0 3px 16px 8px alpha(black, 0.04),
+              0 0 0 1px alpha(black, .05);
 }
 
-frame.desktop-preview label {
-  color: white;
-  font-weight: bold;
-  font-size: 6px;
+background-preview .window .header-bar {
+  min-height: 15px;
+  box-shadow: inset 0 -1px @borders;
+}
+
+background-preview .window.light {
+  background-color: #fafafa;
+  color: alpha(black, .8);
 }
 
-frame.lock-screen-preview {
-  border: solid rgba(0, 0, 0, 0.33);
-  border-width: 10px 0 0 0;
+background-preview .window.light .header-bar {
+  background-color: #ebebeb;
 }
 
-frame.lock-screen-preview label {
+background-preview .window.dark {
+  background-color: #242424;
   color: white;
-  font-weight: bold;
-  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
-  font-size: 1.2em;
+}
+
+background-preview .window.dark .header-bar {
+  background-color: #303030;
+}
+
+.background-preview-button {
+  background: none;
+  border-radius: 9px;
+  padding: 3px;
+  box-shadow: none;
+  outline: none;
+}
+
+.background-preview-button:checked {
+  box-shadow: 0 0 0 3px @accent_color;
+}
+
+.background-preview-button:focus:focus-visible {
+  box-shadow: 0 0 0 3px alpha(@accent_color, .3);
+}
+
+.background-preview-button:checked:focus:focus-visible {
+  box-shadow: 0 0 0 3px @accent_color, 0 0 0 6px alpha(@accent_color, .3);
 }
 
 image.slideshow-icon {


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]