Move buttons inside of the game cover

data/gtk/game.blp

@@ -9,72 +9,88 @@ template $Game : Box {
 
   Adw.Clamp {
     maximum-size: 200;
+
     Box {
       orientation: vertical;
-      Button cover_button {
-        Overlay {
-          [overlay]
-          Spinner spinner {
-            margin-start: 72;
-            margin-end: 72;
-          }
-          Picture cover {
-            width-request: 200;
-            height-request: 300;
-            hexpand: true;
-            vexpand: true;
-          }
-        }
 
-        styles [
-          "card",
-          "flat",
-        ]
-      }
-      Overlay overlay {
+      Overlay {
         [overlay]
-        Revealer play_revealer {
-          reveal-child: false;
-          transition-type: crossfade;
-          Box {
+        Box {
+          halign: start;
+          valign: end;
+
+          Revealer play_revealer {
+            transition-type: slide_up;
+            valign: end;
+
             Button play_button {
-              halign: start;
+              icon-name: "media-playback-start-symbolic";
               margin-start: 6;
-              margin-end: 6;
-              margin-top: 6;
               margin-bottom: 6;
-            }
-            MenuButton menu_button {
-              icon-name: "view-more-symbolic";
-              margin-top: 6;
-              margin-bottom: 6;
-              margin-end: 6;
-              margin-start: 6;
-              hexpand: true;
-              halign: end;
+              margin-top: 3;
 
               styles [
-                "flat",
+                "circular",
+                "osd",
+              ]
+            }
+          }
+
+          Revealer menu_revealer {
+            transition-type: slide_up;
+            valign: end;
+
+            MenuButton menu_button {
+              icon-name: "view-more-symbolic";
+              margin-start: 6;
+              margin-bottom: 6;
+              margin-top: 3;
+              margin-end: 3;
+              direction: up;
+
+              styles [
+                "circular",
+                "osd",
               ]
             }
           }
         }
-        Revealer title_revealer {
-          transition-type: slide_down;
-          reveal-child: true;
-          valign: start;
-          Label title {
-            label: _("Title");
-            ellipsize: end;
-            hexpand: true;
-            halign: start;
-            margin-top: 14;
-            margin-bottom: 14;
-            margin-start: 12;
-            margin-end: 12;
+
+        Button cover_button {
+          name: "cover_button";
+
+          Overlay {
+            [overlay]
+            Spinner spinner {
+              margin-start: 72;
+              margin-end: 72;
+            }
+
+            Picture cover {
+              width-request: 200;
+              height-request: 300;
+              hexpand: true;
+              vexpand: true;
+            }
           }
+
+          styles [
+            "card",
+            "flat",
+          ]
         }
       }
+
+      Label title {
+        label: _("Title");
+        ellipsize: end;
+        hexpand: true;
+        halign: start;
+        margin-top: 14;
+        margin-bottom: 14;
+        margin-start: 12;
+        margin-end: 12;
+      }
     }
   }
 
@@ -119,4 +135,4 @@ menu hidden_game_options {
       action: "app.remove_game";
     }
   }
-}
+}

data/gtk/preferences.blp

@@ -90,7 +90,7 @@ template $PreferencesWindow : Adw.PreferencesWindow {
           subtitle: _("Select other directories where you have Steam games installed");
 
           Revealer steam_clear_button_revealer {
-            reveal-child: false;
+
             transition-type: slide_left;
             Button steam_clear_button {
               label: _("Clear");

data/gtk/style.css

@@ -9,4 +9,10 @@
     color: @light_1;
     background-color: @dark_5;
     opacity: 0.8;
+}
+
+/* The HIG claims another victim... */
+#cover_button {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
 }

src/game.py

@@ -30,7 +30,6 @@ from .game_cover import GameCover
 class Game(Gtk.Box):
     __gtype_name__ = "Game"
 
-    overlay = Gtk.Template.Child()
     title = Gtk.Template.Child()
     play_button = Gtk.Template.Child()
     cover = Gtk.Template.Child()
@@ -38,7 +37,7 @@ class Game(Gtk.Box):
     cover_button = Gtk.Template.Child()
     menu_button = Gtk.Template.Child()
     play_revealer = Gtk.Template.Child()
-    title_revealer = Gtk.Template.Child()
+    menu_revealer = Gtk.Template.Child()
     game_options = Gtk.Template.Child()
     hidden_game_options = Gtk.Template.Child()
 
@@ -67,8 +66,7 @@ class Game(Gtk.Box):
 
         self.win.games[self.game_id] = self
 
-        self.set_play_label()
-        self.overlay.set_measure_overlay(self.play_revealer, True)
+        self.set_play_icon()
 
         self.event_contoller_motion = Gtk.EventControllerMotion.new()
         self.add_controller(self.event_contoller_motion)
@@ -228,8 +226,8 @@ class Game(Gtk.Box):
 
     def toggle_play(self, _widget, _prop1, _prop2, state=True):
         if not self.menu_button.get_active():
-            self.title_revealer.set_reveal_child(state)
             self.play_revealer.set_reveal_child(not state)
+            GLib.timeout_add(40, self.menu_revealer.set_reveal_child, not state)
 
     def main_button_clicked(self, _widget, button):
         if self.win.schema.get_boolean("cover-launches-game") ^ button:
@@ -237,13 +235,13 @@ class Game(Gtk.Box):
         else:
             self.win.show_details_view(self)
 
-    def set_play_label(self):
-        self.play_button.set_label(
-            _("Details")
+    def set_play_icon(self):
+        self.play_button.set_icon_name(
+            "help-about-symbolic"
             if self.win.schema.get_boolean("cover-launches-game")
-            else _("Play")
+            else "media-playback-start-symbolic"
         )
 
     def schema_changed(self, _settings, key):
         if key == "cover-launches-game":
-            self.set_play_label()
+            self.set_play_icon()