feishinize more the play queue

and also readd the drag widget i guess

src/style.css

@@ -19,10 +19,6 @@
   min-height: 15px;
 }
 
-#play-queue .playing .title-label {
+#play-queue .playing label.title {
   font-weight: bold;
 }
-
-.drag-handle {
-  color: color-mix(in srgb, currentColor 40%, transparent);
-}

src/ui/play_queue.vala

@@ -7,13 +7,14 @@ class Ui.PlayQueueSong : Gtk.Box {
     public bool show_artist { get; set; default = false; }
     public bool show_album { get; set; default = false; }
 
+    private bool _current = false;
     public bool current {
+        get { return _current; }
         set {
+            this._current = value;
             if (value) {
-                this.play_icon_name = "media-playback-start";
                 this.add_css_class ("playing");
             } else {
-                this.play_icon_name = "";
                 this.remove_css_class ("playing");
             }
         }
@@ -21,8 +22,6 @@ class Ui.PlayQueueSong : Gtk.Box {
     public uint displayed_position { get; set; }
     public Subsonic.Song song { get; set; }
 
-    public string play_icon_name { get; set; default = ""; }
-
     private weak Playbin playbin;
     public PlayQueueSong (Playbin playbin) {
         this.playbin = playbin;
@@ -75,25 +74,28 @@ class Ui.PlayQueueSong : Gtk.Box {
     private Gtk.ListBox? drag_widget;
 
     [GtkCallback] private void on_drag_begin (Gtk.DragSource source, Gdk.Drag drag) {
-        /* FIXME
         this.drag_widget = new Gtk.ListBox ();
-        this.drag_widget.set_size_request (this.get_width (), this.get_height ());
 
         var drag_row = new PlayQueueSong (this.playbin);
         drag_row.draggable = false;
+        drag_row.show_position = this.show_position;
         drag_row.show_artist = this.show_artist;
         drag_row.show_album = this.show_album;
-        drag_row.current = false;
+        drag_row.current = this.current;
         drag_row.displayed_position = this.displayed_position;
         drag_row.song = this.song;
-        drag_row.play_icon_name = this.play_icon_name;
+        drag_row.set_size_request (this.get_width (), this.get_height ());
 
-        this.drag_widget.append (drag_row);
+        var drag_row_real = new Gtk.ListBoxRow ();
-        this.drag_widget.drag_highlight_row (drag_row);
+        drag_row_real.child = drag_row;
+
+        this.drag_widget.append (drag_row_real);
+        this.drag_widget.drag_highlight_row (drag_row_real);
+        this.drag_widget.add_css_class ("rich-list");
 
         var drag_icon = Gtk.DragIcon.get_for_drag (drag);
         drag_icon.set("child", this.drag_widget);
-        drag.set_hotspot ((int) this.drag_x, (int) this.drag_y); */
+        drag.set_hotspot ((int) this.drag_x, (int) this.drag_y);
     }
 
     [GtkCallback] private bool on_drop (Value value, double x, double y) {

src/ui/play_queue_song.blp

@@ -2,89 +2,40 @@ using Gtk 4.0;
 
 template $UiPlayQueueSong: Box {
   Box {
+    width-request: 24;
     focusable: false;
-    spacing: 6;
+    homogeneous: true;
 
     Image {
-      visible: bind template.draggable;
+      visible: bind template.current;
-      icon-name: "list-drag-handle";
+      focusable: false;
-      styles [ "drag-handle" ]
+      halign: end;
+      icon-size: normal;
+      icon-name: "media-playback-start";
     }
 
+    Label {
+      visible: bind template.current inverted;
+      focusable: false;
+      halign: end;
+      justify: right;
+      styles [ "dim-label", "numeric" ]
+
+      label: bind template.displayed_position;
+    }
+  }
+
+  Box title_box {
+    styles [ "header"]
+    focusable: false;
+    hexpand: true;
+
     Box {
-      width-request: 48;
+      styles [ "title" ]
-      focusable: false;
+      orientation: vertical;
-      homogeneous: true;
-
-      Image {
-        focusable: false;
-        icon-size: normal;
-        icon-name: bind template.play-icon-name;
-      }
 
       Label {
-        visible: bind template.show_position;
+        styles [ "title" ]
-        focusable: false;
-        halign: end;
-        justify: right;
-        styles [ "dim-label", "numeric" ]
-
-        label: bind template.displayed_position;
-      }
-    }
-
-    Box title_box {
-      focusable: false;
-      hexpand: true;
-
-      Box {
-        orientation: vertical;
-
-        Label {
-          focusable: false;
-          xalign: 0;
-          halign: start;
-          hexpand: true;
-          ellipsize: end;
-          max-width-chars: 90;
-          justify: fill;
-          margin-start: 9;
-
-          label: bind template.song as <$SubsonicSong>.title;
-        }
-
-        Label {
-          focusable: false;
-          xalign: 0;
-          halign: start;
-          hexpand: true;
-          ellipsize: end;
-          max-width-chars: 90;
-          justify: fill;
-          margin-start: 9;
-
-          label: bind template.song as <$SubsonicSong>.artist;
-
-          styles [ "dim-label" ]
-        }
-      }
-    }
-
-    Box artist_box {
-      visible: bind template.show_artist;
-      focusable: false;
-      hexpand: true;
-
-    }
-
-    Box album_duration_box {
-      focusable: false;
-      hexpand: true;
-      spacing: 6;
-
-      /*
-      Label {
-        visible: bind template.show_album;
         focusable: false;
         xalign: 0;
         halign: start;
@@ -92,38 +43,52 @@ template $UiPlayQueueSong: Box {
         ellipsize: end;
         max-width-chars: 90;
         justify: fill;
+        margin-start: 9;
 
-        label: bind template.song as <$SubsonicSong>.album;
+        label: bind template.song as <$SubsonicSong>.title;
       }
-      */
 
       Label {
+        styles [ "subtitle" ]
         focusable: false;
-        halign: end;
+        xalign: 0;
+        halign: start;
         hexpand: true;
-        single-line-mode: true;
+        ellipsize: end;
-        styles [ "numeric" ]
+        max-width-chars: 90;
+        justify: fill;
+        margin-start: 9;
 
-        label: bind $format_duration (template.song as <$SubsonicSong>.duration) as <string>;
+        label: bind template.song as <$SubsonicSong>.artist;
       }
     }
+  }
 
-    Button {
+  Label {
-      focusable: true;
+    focusable: false;
-      icon-name: bind $star_button_icon_name (template.song as <$SubsonicSong>.starred) as <string>;
+    halign: end;
-      styles [ "flat" ]
+    hexpand: true;
-    }
+    single-line-mode: true;
+    styles [ "numeric", "dim-label" ]
 
-    MenuButton {
+    label: bind $format_duration (template.song as <$SubsonicSong>.duration) as <string>;
-      //visible: false;
+  }
-      focusable: true;
-      icon-name: "view-more";
-      styles [ "flat" ]
 
-      popover: PopoverMenu {
+  Button {
-        menu-model: song-menu;
+    focusable: true;
-      };
+    icon-name: bind $star_button_icon_name (template.song as <$SubsonicSong>.starred) as <string>;
-    }
+    styles [ "flat" ]
+  }
+
+  MenuButton {
+    //visible: false;
+    focusable: true;
+    icon-name: "view-more";
+    styles [ "flat" ]
+
+    popover: PopoverMenu {
+      menu-model: song-menu;
+    };
   }
 
   DragSource {
@@ -143,13 +108,6 @@ template $UiPlayQueueSong: Box {
   }
 }
 
-/*
-SizeGroup {
-  mode: horizontal;
-  widgets [title_box, artist_box, album_duration_box]
-}
-*/
-
 menu song-menu {
   item ("View song", "song.view")
   item ("View artist", "song.view-artist")