[gnome-control-center/wip/exalm/appearance: 3/7] background: Redo the layout to match the new mockups

[Alexander Mikhaylenko <alexm src gnome org>]

commit 54fe68fce7c6a6347f999ad00604724a94172fba
Author: Alexander Mikhaylenko <alexm gnome org>
Date:   Sun Dec 12 21:07:18 2021 +0500

    background: Redo the layout to match the new mockups

 panels/background/cc-background-chooser.ui | 105 ++++++++--------------
 panels/background/cc-background-panel.c    |  17 ----
 panels/background/cc-background-panel.ui   | 134 +++++++++++++++++++++++------
 panels/background/cc-background-preview.c  |   7 +-
 4 files changed, 149 insertions(+), 114 deletions(-)
---
diff --git a/panels/background/cc-background-chooser.ui b/panels/background/cc-background-chooser.ui
index 1609d4cab..204e7176c 100644
--- a/panels/background/cc-background-chooser.ui
+++ b/panels/background/cc-background-chooser.ui
@@ -3,81 +3,52 @@
   <template class="CcBackgroundChooser" parent="GtkBox">
     <property name="orientation">vertical</property>
 
+    <!-- Recent -->
     <child>
-      <object class="GtkSeparator">
-      </object>
-    </child>
+      <object class="GtkBox" id="recent_box">
+        <property name="orientation">vertical</property>
+        <property name="halign">center</property>
 
-    <child>
-      <object class="GtkScrolledWindow">
-        <property name="hexpand">True</property>
-        <property name="vexpand">True</property>
-        <property name="hscrollbar-policy">never</property>
-        <property name="vscrollbar-policy">automatic</property>
         <child>
-          <object class="GtkBox">
-            <property name="orientation">vertical</property>
-            <property name="hexpand">True</property>
-            <property name="vexpand">True</property>
-            <style>
-              <class name="view" />
-            </style>
-
-            <!-- Recent -->
-            <child>
-              <object class="GtkBox" id="recent_box">
-                <property name="orientation">vertical</property>
-                <property name="halign">center</property>
-
-                <child>
-                  <object class="GtkFlowBox" id="recent_flowbox">
-                    <property name="margin-start">12</property>
-                    <property name="margin-end">12</property>
-                    <property name="margin-top">12</property>
-                    <property name="margin-bottom">12</property>
-                    <property name="column-spacing">12</property>
-                    <property name="row-spacing">12</property>
-                    <property name="homogeneous">True</property>
-                    <property name="halign">center</property>
-                    <property name="min-children-per-line">1</property>
-                    <property name="max-children-per-line">8</property>
-                    <property name="activate-on-single-click">True</property>
-                    <property name="selection-mode">single</property>
-                    <signal name="child-activated" handler="on_item_activated_cb" 
object="CcBackgroundChooser" swapped="no" />
-                  </object>
-                </child>
-
-                <child>
-                  <object class="GtkSeparator">
-                    <property name="margin-top">12</property>
-                    <property name="margin-bottom">12</property>
-                  </object>
-                </child>
-
-              </object>
-            </child>
+          <object class="GtkFlowBox" id="recent_flowbox">
+            <property name="margin-top">12</property>
+            <property name="margin-bottom">12</property>
+            <property name="column-spacing">12</property>
+            <property name="row-spacing">12</property>
+            <property name="homogeneous">True</property>
+            <property name="halign">center</property>
+            <property name="min-children-per-line">1</property>
+            <property name="max-children-per-line">8</property>
+            <property name="activate-on-single-click">True</property>
+            <property name="selection-mode">single</property>
+            <signal name="child-activated" handler="on_item_activated_cb" object="CcBackgroundChooser" 
swapped="no" />
+          </object>
+        </child>
 
-            <child>
-              <object class="GtkFlowBox" id="flowbox">
-                <property name="margin-start">12</property>
-                <property name="margin-end">12</property>
-                <property name="margin-top">12</property>
-                <property name="margin-bottom">12</property>
-                <property name="column-spacing">12</property>
-                <property name="row-spacing">12</property>
-                <property name="homogeneous">True</property>
-                <property name="halign">center</property>
-                <property name="min-children-per-line">1</property>
-                <property name="max-children-per-line">8</property>
-                <property name="activate-on-single-click">True</property>
-                <property name="selection-mode">single</property>
-                <signal name="child-activated" handler="on_item_activated_cb" object="CcBackgroundChooser" 
swapped="no" />
-              </object>
-            </child>
+        <child>
+          <object class="GtkSeparator">
+            <property name="margin-top">12</property>
+            <property name="margin-bottom">12</property>
           </object>
         </child>
       </object>
     </child>
 
+    <child>
+      <object class="GtkFlowBox" id="flowbox">
+        <property name="margin-top">12</property>
+        <property name="margin-bottom">12</property>
+        <property name="column-spacing">12</property>
+        <property name="row-spacing">12</property>
+        <property name="homogeneous">True</property>
+        <property name="halign">center</property>
+        <property name="min-children-per-line">1</property>
+        <property name="max-children-per-line">8</property>
+        <property name="activate-on-single-click">True</property>
+        <property name="selection-mode">single</property>
+        <signal name="child-activated" handler="on_item_activated_cb" object="CcBackgroundChooser" 
swapped="no" />
+      </object>
+    </child>
+
   </template>
 </interface>
diff --git a/panels/background/cc-background-panel.c b/panels/background/cc-background-panel.c
index 3e50f506b..efeb7fea0 100644
--- a/panels/background/cc-background-panel.c
+++ b/panels/background/cc-background-panel.c
@@ -57,7 +57,6 @@ struct _CcBackgroundPanel
   CcBackgroundItem *current_background;
 
   CcBackgroundChooser *background_chooser;
-  GtkButton *add_picture_button;
   CcBackgroundPreview *desktop_preview;
 };
 
@@ -217,20 +216,6 @@ cc_background_panel_get_help_uri (CcPanel *panel)
   return "help:gnome-help/look-background";
 }
 
-static void
-cc_background_panel_constructed (GObject *object)
-{
-  CcBackgroundPanel *self;
-  CcShell *shell;
-
-  self = CC_BACKGROUND_PANEL (object);
-  shell = cc_panel_get_shell (CC_PANEL (self));
-
-  cc_shell_embed_widget_in_header (shell, GTK_WIDGET (self->add_picture_button), GTK_POS_RIGHT);
-
-  G_OBJECT_CLASS (cc_background_panel_parent_class)->constructed (object);
-}
-
 static void
 cc_background_panel_dispose (GObject *object)
 {
@@ -265,13 +250,11 @@ cc_background_panel_class_init (CcBackgroundPanelClass *klass)
 
   panel_class->get_help_uri = cc_background_panel_get_help_uri;
 
-  object_class->constructed = cc_background_panel_constructed;
   object_class->dispose = cc_background_panel_dispose;
   object_class->finalize = cc_background_panel_finalize;
 
   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, add_picture_button);
   gtk_widget_class_bind_template_child (widget_class, CcBackgroundPanel, background_chooser);
   gtk_widget_class_bind_template_child (widget_class, CcBackgroundPanel, desktop_preview);
 
diff --git a/panels/background/cc-background-panel.ui b/panels/background/cc-background-panel.ui
index 392decb12..6d50deb62 100644
--- a/panels/background/cc-background-panel.ui
+++ b/panels/background/cc-background-panel.ui
@@ -3,46 +3,124 @@
   <!-- interface-requires gtk+ 3.0 -->
   <template class="CcBackgroundPanel" parent="CcPanel">
     <child>
-      <object class="GtkBox">
-        <property name="orientation">vertical</property>
+      <object class="GtkScrolledWindow">
+        <property name="hexpand">True</property>
+        <property name="vexpand">True</property>
+        <property name="hscrollbar-policy">never</property>
 
         <child>
-          <object class="AdwClamp">
-            <property name="visible">1</property>
-            <property name="maximum_size">300</property>
-            <property name="tightening_threshold">200</property>
+          <object class="GtkViewport">
+            <property name="scroll-to-focus">True</property>
+
             <child>
-              <object class="GtkBox">
-                <property name="spacing">24</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="hexpand">True</property>
+              <object class="AdwClamp">
+
                 <child>
-                  <object class="CcBackgroundPreview" id="desktop_preview">
-                    <property name="valign">center</property>
+                  <object class="GtkBox">
+                    <property name="orientation">vertical</property>
+                    <property name="spacing">24</property>
+                    <property name="margin-top">24</property>
+                    <property name="margin-bottom">24</property>
+                    <property name="margin-start">12</property>
+                    <property name="margin-end">12</property>
+
+                    <child>
+                      <object class="AdwPreferencesGroup">
+
+                        <child>
+                          <object class="AdwPreferencesRow">
+                            <property name="activatable">False</property>
+                            <child>
+                              <object class="AdwClamp">
+                                <property name="visible">1</property>
+                                <property name="maximum_size">300</property>
+                                <property name="tightening_threshold">200</property>
+                                <child>
+                                  <object class="GtkBox">
+                                    <property name="spacing">24</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="hexpand">True</property>
+                                    <child>
+                                      <object class="CcBackgroundPreview" id="desktop_preview">
+                                        <property name="valign">center</property>
+                                      </object>
+                                    </child>
+                                  </object>
+                                </child>
+                              </object>
+                            </child>
+                          </object>
+                        </child>
+
+                      </object>
+                    </child>
+
+                    <child>
+                      <object class="GtkBox">
+                        <property name="orientation">vertical</property>
+                        <property name="spacing">6</property>
+                        <child>
+                          <object class="GtkBox">
+                            <property name="spacing">6</property>
+                            <child>
+                              <object class="GtkLabel">
+                                <property name="label" translatable="yes">Background</property>
+                                <property name="hexpand">True</property>
+                                <property name="xalign">0</property>
+                                <property name="ellipsize">end</property>
+                                <style>
+                                  <class name="heading"/>
+                                </style>
+                              </object>
+                            </child>
+                            <child>
+                              <object class="GtkButton">
+                                <child>
+                                  <object class="AdwButtonContent">
+                                    <property name="icon-name">list-add-symbolic</property>
+                                    <property name="label" translatable="yes">Add Picture…</property>
+                                  </object>
+                                </child>
+                                <signal name="clicked" handler="on_add_picture_button_clicked_cb" 
object="CcBackgroundPanel" swapped="yes" />
+                                <style>
+                                  <class name="flat"/>
+                                </style>
+                              </object>
+                            </child>
+                          </object>
+                        </child>
+
+                        <child>
+                          <object class="AdwBin">
+                            <style>
+                              <class name="card"/>
+                            </style>
+                            <child>
+                              <object class="CcBackgroundChooser" id="background_chooser">
+                                <property name="hexpand">True</property>
+                                <property name="vexpand">True</property>
+                                <signal name="background-chosen" handler="on_chooser_background_chosen_cb" 
object="CcBackgroundPanel" swapped="yes" />
+                              </object>
+                            </child>
+                          </object>
+                        </child>
+
+                      </object>
+                    </child>
+
                   </object>
                 </child>
+
               </object>
             </child>
-          </object>
-        </child>
 
-        <child>
-          <object class="CcBackgroundChooser" id="background_chooser">
-            <property name="hexpand">True</property>
-            <property name="vexpand">True</property>
-            <signal name="background-chosen" handler="on_chooser_background_chosen_cb" 
object="CcBackgroundPanel" swapped="yes" />
           </object>
         </child>
+
       </object>
     </child>
   </template>
-
-  <!-- Header button -->
-  <object class="GtkButton" id="add_picture_button">
-    <property name="label" translatable="yes">Add Picture…</property>
-    <signal name="clicked" handler="on_add_picture_button_clicked_cb" object="CcBackgroundPanel" 
swapped="yes" />
-  </object>
 </interface>
diff --git a/panels/background/cc-background-preview.c b/panels/background/cc-background-preview.c
index 6e5052c0e..b9985db5b 100644
--- a/panels/background/cc-background-preview.c
+++ b/panels/background/cc-background-preview.c
@@ -315,8 +315,6 @@ cc_background_preview_measure (GtkWidget      *widget,
                       &child_nat,
                       NULL, NULL);
 
-  *minimum = child_min;
-
   if (orientation == GTK_ORIENTATION_HORIZONTAL)
     *natural = width;
   else if (for_size < 0)
@@ -325,6 +323,11 @@ cc_background_preview_measure (GtkWidget      *widget,
     *natural = floor ((double) MIN (for_size, width) / width * height);
 
   *natural = MAX (*natural, child_nat);
+
+  if (orientation == GTK_ORIENTATION_VERTICAL)
+    *minimum = *natural;
+  else
+    *minimum = 0;
 }
 
 static void