[gnome-text-editor] themeselector: add follow button for theme selector

[Christian Hergert <chergert src gnome org>]

commit c0e727c4364aa3b7ac7fc35dbcfdaa92eb2a47c5
Author: Christian Hergert <chergert redhat com>
Date:   Fri Nov 19 14:59:01 2021 -0800

    themeselector: add follow button for theme selector
    
    This doesn't actually wire up the "follow" state to track libadwaita
    changes, but it does let us see how the styling will work. In particular
    my concern is making the border match the mockups.
    
    In the mockups, the border is different for the light and dark half of
    the button. For us to do that, we'd likely need to have two buttons and
    clip them in a snapshot. An alternative would be to use an SVG.
    
    Instead, this just uses a dark border that looks relatively good in both
    light and dark modes.
    
    Related #225

 data/org.gnome.TextEditor.gschema.xml |  1 +
 src/TextEditor.css                    |  5 +++++
 src/editor-theme-selector.c           | 28 +++++++++++++++++++++++++++-
 src/editor-theme-selector.ui          | 17 ++++++++++++++++-
 4 files changed, 49 insertions(+), 2 deletions(-)
---
diff --git a/data/org.gnome.TextEditor.gschema.xml b/data/org.gnome.TextEditor.gschema.xml
index d95c028..f269088 100644
--- a/data/org.gnome.TextEditor.gschema.xml
+++ b/data/org.gnome.TextEditor.gschema.xml
@@ -9,6 +9,7 @@
     </key>
     <key name="style-variant" type="s">
       <choices>
+        <choice value="follow"/>
         <choice value="light"/>
         <choice value="dark"/>
       </choices>
diff --git a/src/TextEditor.css b/src/TextEditor.css
index 3530e1a..cc7d13d 100644
--- a/src/TextEditor.css
+++ b/src/TextEditor.css
@@ -38,12 +38,17 @@
   border-color: transparent;
   border-radius: 9999px;
 }
+.org-gnome-TextEditor checkbutton.theme-selector.follow:checked,
 .org-gnome-TextEditor checkbutton.theme-selector.light:checked,
 .org-gnome-TextEditor checkbutton.theme-selector.dark:checked {
   border-color: @theme_selected_bg_color;
   border-width: 2px;
   margin: 9px 0 9px 0;
 }
+.org-gnome-TextEditor checkbutton.theme-selector.follow {
+  background: linear-gradient(to bottom right, #fff 50%, #2e3436 50%);
+  border-color: #2e3436;
+}
 .org-gnome-TextEditor checkbutton.theme-selector.light {
   background-color: #fff;
   border-color: #dcdddd;
diff --git a/src/editor-theme-selector.c b/src/editor-theme-selector.c
index d5c525d..65a18c7 100644
--- a/src/editor-theme-selector.c
+++ b/src/editor-theme-selector.c
@@ -32,6 +32,7 @@ struct _EditorThemeSelector
   GtkWidget *box;
   GtkToggleButton *dark;
   GtkToggleButton *light;
+  GtkToggleButton *follow;
   char *theme;
 };
 
@@ -51,6 +52,20 @@ _editor_theme_selector_new (void)
   return g_object_new (EDITOR_TYPE_THEME_SELECTOR, NULL);
 }
 
+static void
+on_notify_system_supports_color_schemes_cb (EditorThemeSelector *self,
+                                            GParamSpec          *pspec,
+                                            AdwStyleManager     *style_manager)
+{
+  gboolean visible;
+
+  g_assert (EDITOR_IS_THEME_SELECTOR (self));
+  g_assert (ADW_IS_STYLE_MANAGER (style_manager));
+
+  visible = adw_style_manager_get_system_supports_color_schemes (style_manager);
+  gtk_widget_set_visible (GTK_WIDGET (self->follow), visible);
+}
+
 static void
 editor_theme_selector_dispose (GObject *object)
 {
@@ -125,16 +140,27 @@ editor_theme_selector_class_init (EditorThemeSelectorClass *klass)
   gtk_widget_class_bind_template_child (widget_class, EditorThemeSelector, box);
   gtk_widget_class_bind_template_child (widget_class, EditorThemeSelector, dark);
   gtk_widget_class_bind_template_child (widget_class, EditorThemeSelector, light);
+  gtk_widget_class_bind_template_child (widget_class, EditorThemeSelector, follow);
 }
 
 static void
 editor_theme_selector_init (EditorThemeSelector *self)
 {
-  gboolean dark = adw_style_manager_get_dark (adw_style_manager_get_default ());
+  AdwStyleManager *style_manager = adw_style_manager_get_default ();
+  gboolean dark;
 
   gtk_widget_init_template (GTK_WIDGET (self));
 
+  g_signal_connect_object (style_manager,
+                           "notify::system-supports-color-schemes",
+                           G_CALLBACK (on_notify_system_supports_color_schemes_cb),
+                           self,
+                           G_CONNECT_SWAPPED);
+
+  dark = adw_style_manager_get_dark (style_manager);
   self->theme = g_strdup (dark ? "dark" : "light");
+
+  on_notify_system_supports_color_schemes_cb (self, NULL, style_manager);
 }
 
 const char *
diff --git a/src/editor-theme-selector.ui b/src/editor-theme-selector.ui
index 227196c..b7d7481 100644
--- a/src/editor-theme-selector.ui
+++ b/src/editor-theme-selector.ui
@@ -5,7 +5,22 @@
       <object class="GtkBox" id="box">
         <property name="halign">center</property>
         <property name="orientation">horizontal</property>
-        <property name="spacing">24</property>
+        <property name="spacing">12</property>
+        <child>
+          <object class="GtkCheckButton" id="follow">
+            <style>
+              <class name="theme-selector"/>
+              <class name="follow"/>
+            </style>
+            <property name="focus-on-click">false</property>
+            <property name="action-name">settings.style-variant</property>
+            <property name="action-target">'follow'</property>
+            <property name="tooltip-text" translatable="yes">Follow system style</property>
+            <accessibility>
+              <property name="label" translatable="yes">Follow system style</property>
+            </accessibility>
+          </object>
+        </child>
         <child>
           <object class="GtkCheckButton" id="light">
             <style>