Change the way we deal with icon clipping

data/Application.css

@@ -1,6 +1,6 @@
 /*
  * SPDX-License-Identifier: GPL-3.0
- * SPDX-FileCopyrightText: 2023-2025 elementary, Inc. (https://elementary.io)
+ * SPDX-FileCopyrightText: 2023-2026 elementary, Inc. (https://elementary.io)
  */
 
 dock {
@@ -32,10 +32,6 @@ dock-window:not(.reduce-transparency) separator.vertical {
     border-right-color: alpha(@highlight_color, 0.15);
 }
 
-dock-window {
-    margin-top: 64px; /* Keep enough room so that icons don't clip when bouncing */
-}
-
 bottom-margin {
     min-height: 9px;
 }

src/AppSystem/Launcher.vala

@@ -1,6 +1,6 @@
 /*
  * SPDX-License-Identifier: GPL-3.0
- * SPDX-FileCopyrightText: 2022-2025 elementary, Inc. (https://elementary.io)
+ * SPDX-FileCopyrightText: 2022-2026 elementary, Inc. (https://elementary.io)
  */
 
 public class Dock.Launcher : BaseItem {
@@ -146,7 +146,7 @@ public class Dock.Launcher : BaseItem {
             valign = END
         };
 
-        insert_child_after (running_revealer, bin);
+        actionable_box.insert_child_after (running_revealer, bin);
 
         // We have to destroy the progressbar when it is not needed otherwise it will
         // cause continuous layouting of the surface see https://github.com/elementary/dock/issues/279

src/BaseItem.vala

@@ -1,6 +1,6 @@
 /*
  * SPDX-License-Identifier: GPL-3.0
- * SPDX-FileCopyrightText: 2025 elementary, Inc. (https://elementary.io)
+ * SPDX-FileCopyrightText: 2025-2026 elementary, Inc. (https://elementary.io)
  */
 
 public class Dock.BaseItem : Gtk.Box {
@@ -65,6 +65,11 @@ public class Dock.BaseItem : Gtk.Box {
         }
     }
 
+    /**
+     * A box that handles dnd and some other stuff.
+     * It's needed because top margin messes with dnd offsets and gsk transform.
+     */
+    protected Gtk.Box actionable_box;
     protected Gtk.Overlay overlay;
     protected Gtk.GestureClick gesture_click;
 
@@ -94,8 +99,12 @@ public class Dock.BaseItem : Gtk.Box {
             child = overlay
         };
 
-        append (bin);
-        append (new BottomMargin ());
+        actionable_box = new Gtk.Box (VERTICAL, 0);
+        actionable_box.append (bin);
+        actionable_box.append (new BottomMargin ());
+
+        append (new TopMargin ());
+        append (actionable_box);
 
         var tooltip_label = new Gtk.Label (null) {
             use_markup = true
@@ -193,7 +202,7 @@ public class Dock.BaseItem : Gtk.Box {
         var drag_source = new Gtk.DragSource () {
             actions = MOVE
         };
-        add_controller (drag_source);
+        actionable_box.add_controller (drag_source);
         drag_source.prepare.connect (on_drag_prepare);
         drag_source.drag_begin.connect (on_drag_begin);
         drag_source.drag_cancel.connect (on_drag_cancel);

src/BottomMargin.vala

@@ -1,9 +1,9 @@
 /*
  * SPDX-License-Identifier: GPL-3.0
- * SPDX-FileCopyrightText: 2025 elementary, Inc. (https://elementary.io)
+ * SPDX-FileCopyrightText: 2025-2026 elementary, Inc. (https://elementary.io)
  */
 
-public class BottomMargin : Gtk.Widget {
+public class Dock.BottomMargin : Gtk.Widget {
     private static GLib.List<unowned BottomMargin> instances = new GLib.List<unowned BottomMargin> ();
 
     class construct {

src/ItemManager.vala

@@ -1,17 +1,16 @@
 /*
  * SPDX-License-Identifier: GPL-3.0
- * SPDX-FileCopyrightText: 2023-2025 elementary, Inc. (https://elementary.io)
+ * SPDX-FileCopyrightText: 2023-2026 elementary, Inc. (https://elementary.io)
  */
 
  public class Dock.ItemManager : Gtk.Box {
     private static Settings settings;
 
     public Launcher? added_launcher { get; set; default = null; }
 
-    private DynamicWorkspaceIcon dynamic_workspace_item;
-
 #if WORKSPACE_SWITCHER
     private Gtk.Separator separator;
+    private DynamicWorkspaceIcon dynamic_workspace_item;
 #endif
 
     static construct {
@@ -25,19 +24,22 @@
         var background_group = new ItemGroup (background_item.group_model, (obj) => (BackgroundItem) obj);
 
 #if WORKSPACE_SWITCHER
-        dynamic_workspace_item = new DynamicWorkspaceIcon ();
-
         separator = new Gtk.Separator (VERTICAL) {
-            valign = START,
-            margin_top = Launcher.PADDING,
+            margin_top = Launcher.PADDING
         };
         settings.bind ("icon-size", separator, "height-request", GET);
+
+        var separator_box = new Gtk.Box (VERTICAL, 0);
+        separator_box.append (new TopMargin ());
+        separator_box.append (separator);
+
+        dynamic_workspace_item = new DynamicWorkspaceIcon ();
 #endif
 
         append (app_group);
         append (background_group);
 #if WORKSPACE_SWITCHER
-        append (separator);
+        append (separator_box);
         append (new ItemGroup (WorkspaceSystem.get_default ().workspaces, (obj) => new WorkspaceIconGroup ((Workspace) obj)));
         append (dynamic_workspace_item);
 #endif

src/MainWindow.vala

@@ -1,6 +1,6 @@
 /*
  * SPDX-License-Identifier: GPL-3.0
- * SPDX-FileCopyrightText: 2022-2025 elementary, Inc. (https://elementary.io)
+ * SPDX-FileCopyrightText: 2022-2026 elementary, Inc. (https://elementary.io)
  */
 
 public class Dock.MainWindow : Gtk.ApplicationWindow {
@@ -14,9 +14,6 @@ public class Dock.MainWindow : Gtk.ApplicationWindow {
         }
     }
 
-    // Matches top margin in Launcher.css
-    private const int TOP_MARGIN = 64;
-
     private Settings transparency_settings;
     private static Settings settings = new Settings ("io.elementary.dock");
 
@@ -38,6 +35,7 @@ public class Dock.MainWindow : Gtk.ApplicationWindow {
         titlebar = new Gtk.Label ("") { visible = false };
 
         var dock_box = new Gtk.Box (VERTICAL, 0);
+        dock_box.append (new TopMargin ());
         dock_box.append (new Container ());
         dock_box.append (new BottomMargin ());
 
@@ -115,7 +113,7 @@ public class Dock.MainWindow : Gtk.ApplicationWindow {
             // bouncing isn't added by default and instead counts to the frame
             var item_manager_width = item_manager.get_width ();
             var shadow_size = (surface.width - item_manager_width) / 2;
-            var top_margin = TOP_MARGIN + shadow_size - 1;
+            var top_margin = TopMargin.SIZE + shadow_size - 1;
             size.set_shadow_width (shadow_size, shadow_size, top_margin, shadow_size);
         });
 
@@ -124,7 +122,7 @@ public class Dock.MainWindow : Gtk.ApplicationWindow {
             // and it still gets window events
             var item_manager_width = item_manager.get_width ();
             var shadow_size = (width - item_manager_width) / 2;
-            var top_margin = TOP_MARGIN + shadow_size;
+            var top_margin = TopMargin.SIZE + shadow_size;
             surface.set_input_region (new Cairo.Region.rectangle ({
                 shadow_size,
                 top_margin,

src/TopMargin.vala

@@ -0,0 +1,12 @@
+/*
+ * SPDX-License-Identifier: GPL-3.0
+ * SPDX-FileCopyrightText: 2026 elementary, Inc. (https://elementary.io)
+ */
+
+public class Dock.TopMargin : Gtk.Widget {
+    public const int SIZE = 64;
+
+    construct {
+        height_request = SIZE;
+    }
+}

src/meson.build

@@ -8,6 +8,7 @@ sources = [
     'ItemManager.vala',
     'MainWindow.vala',
     'RenderNodeWalker.vala',
+    'TopMargin.vala',
     'AppSystem' / 'App.vala',
     'AppSystem' / 'AppSystem.vala',
     'AppSystem' / 'Launcher.vala',