[gnome-text-editor/wip/exalm/preview-style] preferences-dialog: Use card styles for previews

[Alexander Mikhaylenko <alexm src gnome org>]

commit de63a2543d73c938e70606a6a5744e6e7b4eeee2
Author: Alexander Mikhaylenko <alexm gnome org>
Date:   Wed Apr 6 23:01:22 2022 +0400

    preferences-dialog: Use card styles for previews
    
    Copy the card shadow in tree for style scheme previews, use .card for the
    main preview.
    
    See https://gitlab.gnome.org/GNOME/gtksourceview/-/merge_requests/252

 src/editor-preferences-dialog.ui       | 41 ++++++++++++++++------------------
 src/org.gnome.TextEditor.gresource.xml |  1 +
 src/style-hc.css                       |  5 +++++
 src/style.css                          | 14 +++++++++---
 4 files changed, 36 insertions(+), 25 deletions(-)
---
diff --git a/src/editor-preferences-dialog.ui b/src/editor-preferences-dialog.ui
index d98fde1..bd28c49 100644
--- a/src/editor-preferences-dialog.ui
+++ b/src/editor-preferences-dialog.ui
@@ -16,36 +16,33 @@
           <object class="AdwPreferencesGroup">
             <property name="title" translatable="yes">Appearance</property>
             <child>
-              <object class="GtkFrame">
+              <object class="GtkSourceView" id="source_view">
+                <property name="editable">false</property>
+                <property name="cursor-visible">false</property>
+                <property name="top-margin">8</property>
+                <property name="bottom-margin">8</property>
+                <property name="left-margin">12</property>
+                <property name="right-margin">12</property>
+                <property name="right-margin-position">30</property>
+                <property name="monospace">true</property>
+                <property name="show-line-numbers">true</property>
                 <property name="margin-bottom">24</property>
-                <child>
-                  <object class="GtkSourceView" id="source_view">
-                    <property name="editable">false</property>
-                    <property name="cursor-visible">false</property>
-                    <property name="top-margin">8</property>
-                    <property name="bottom-margin">8</property>
-                    <property name="left-margin">12</property>
-                    <property name="right-margin">12</property>
-                    <property name="right-margin-position">30</property>
-                    <property name="monospace">true</property>
-                    <property name="show-line-numbers">true</property>
-                    <property name="buffer">
-                      <object class="GtkSourceBuffer" id="buffer">
-                      </object>
-                    </property>
-                    <style>
-                      <class name="preview"/>
-                    </style>
+                <property name="buffer">
+                  <object class="GtkSourceBuffer" id="buffer">
                   </object>
-                </child>
+                </property>
+                <style>
+                  <class name="preview"/>
+                  <class name="card"/>
+                </style>
               </object>
             </child>
             <child>
               <object class="GtkFlowBox" id="scheme_group">
                 <signal name="child-activated" handler="style_scheme_activated_cb" swapped="true"/>
                 <property name="hexpand">true</property>
-                <property name="column-spacing">0</property>
-                <property name="row-spacing">0</property>
+                <property name="column-spacing">12</property>
+                <property name="row-spacing">12</property>
                 <property name="max-children-per-line">4</property>
                 <property name="max-children-per-line">4</property>
                 <property name="selection-mode">none</property>
diff --git a/src/org.gnome.TextEditor.gresource.xml b/src/org.gnome.TextEditor.gresource.xml
index d2c14e7..c949fe8 100644
--- a/src/org.gnome.TextEditor.gresource.xml
+++ b/src/org.gnome.TextEditor.gresource.xml
@@ -19,6 +19,7 @@
   </gresource>
   <gresource prefix="/org/gnome/TextEditor">
     <file>style.css</file>
+    <file>style-hc.css</file>
   </gresource>
   <gresource prefix="/plugins/modelines">
     <file alias="language-mappings">modelines/language-mappings</file>
diff --git a/src/style-hc.css b/src/style-hc.css
new file mode 100644
index 0000000..5440b30
--- /dev/null
+++ b/src/style-hc.css
@@ -0,0 +1,5 @@
+window.org-gnome-TextEditor.preferences preferencesgroup flowboxchild 
GtkSourceStyleSchemePreview:not(.selected) {
+  box-shadow: 0 0 0 1px @borders,
+              0 1px 3px 1px alpha(black, .07),
+              0 2px 6px 2px alpha(black, .03);
+}
diff --git a/src/style.css b/src/style.css
index 4476d5b..e3155f6 100644
--- a/src/style.css
+++ b/src/style.css
@@ -3,11 +3,19 @@ window.org-gnome-TextEditor.preferences textview.preview {
   line-height: 1.2;
 }
 window.org-gnome-TextEditor.preferences preferencesgroup flowboxchild {
-  outline-offset: -3px;
-  border-radius: 14px;
-  outline-width: 2px;
+  outline-offset: 2px;
+  border-radius: 12px;
+  padding: 0;
 }
 
+window.org-gnome-TextEditor.preferences preferencesgroup flowboxchild GtkSourceStyleSchemePreview {
+  margin: 0;
+}
+window.org-gnome-TextEditor.preferences preferencesgroup flowboxchild 
GtkSourceStyleSchemePreview:not(.selected) {
+  box-shadow: 0 0 0 1px alpha(black, 0.03),
+              0 1px 3px 1px alpha(black, .07),
+              0 2px 6px 2px alpha(black, .03);
+}
 
 /* EditorThemeSelector */
 window.org-gnome-TextEditor themeselector {