[gnome-games] display-box: Show savestates list as an overlay on small sizes

[Alexander Mikhaylenko <alexm src gnome org>]

commit 2a870dcbe95bcad22730baad69efd7ff2a19802b
Author: Alexander Mikhaylenko <exalm7659 gmail com>
Date:   Sun Aug 11 00:06:20 2019 +0500

    display-box: Show savestates list as an overlay on small sizes

 data/ui/display-box.ui     |  6 ++++--
 data/ui/savestates-list.ui |  3 +++
 src/ui/display-box.vala    | 22 ++++++++++++++++++++--
 3 files changed, 27 insertions(+), 4 deletions(-)
---
diff --git a/data/ui/display-box.ui b/data/ui/display-box.ui
index 7cef4bdf..80f42dc2 100644
--- a/data/ui/display-box.ui
+++ b/data/ui/display-box.ui
@@ -25,7 +25,7 @@
               </packing>
             </child>
             <child>
-              <object class="GtkBox" id="display_box">
+              <object class="GtkOverlay" id="display_overlay">
                 <property name="visible">True</property>
                 <child>
                   <object class="GtkEventBox" id="display_bin">
@@ -33,9 +33,11 @@
                     <property name="hexpand">True</property>
                   </object>
                 </child>
-                <child>
+                <child type="overlay">
                   <object class="GamesSavestatesList" id="savestates_list">
                     <property name="visible">True</property>
+                    <property name="halign">end</property>
+                    <signal name="size-allocate" handler="on_savestates_list_size_allocate"/>
                   </object>
                 </child>
               </object>
diff --git a/data/ui/savestates-list.ui b/data/ui/savestates-list.ui
index 850e77af..af2f4470 100644
--- a/data/ui/savestates-list.ui
+++ b/data/ui/savestates-list.ui
@@ -10,6 +10,9 @@
         <child>
           <object class="GtkBox">
             <property name="visible">True</property>
+            <style>
+              <class name="solid-background"/>
+            </style>
             <child>
               <object class="GtkSeparator">
                 <property name="visible">True</property>
diff --git a/src/ui/display-box.vala b/src/ui/display-box.vala
index b46b651a..0329e973 100644
--- a/src/ui/display-box.vala
+++ b/src/ui/display-box.vala
@@ -34,7 +34,7 @@ private class Games.DisplayBox : Gtk.Bin {
        public Runner runner {
                get { return _runner; }
                set {
-                       stack.visible_child = display_box;
+                       stack.visible_child = display_overlay;
 
                        _runner = value;
                        remove_display ();
@@ -57,7 +57,7 @@ private class Games.DisplayBox : Gtk.Bin {
        [GtkChild]
        private ErrorDisplay error_display;
        [GtkChild]
-       private Gtk.Box display_box;
+       private Gtk.Overlay display_overlay;
        [GtkChild]
        private Gtk.EventBox display_bin;
        [GtkChild]
@@ -135,4 +135,22 @@ private class Games.DisplayBox : Gtk.Bin {
        private void on_fullscreen_header_bar_size_allocated (Gtk.Allocation allocation) {
                fullscreen_header_bar_height = allocation.height;
        }
+
+       [GtkCallback]
+       private void on_savestates_list_size_allocate (Gtk.Allocation allocation) {
+               update_margin ();
+       }
+
+       public override void size_allocate (Gtk.Allocation allocation) {
+               base.size_allocate (allocation);
+               update_margin ();
+       }
+
+       private void update_margin () {
+               var width = get_allocated_width ();
+               if (width > 900)
+                       display_bin.margin_right = savestates_list.get_allocated_width ();
+               else
+                       display_bin.margin_right = 0;
+       }
 }