[gnome-shell] windowPreview: Use a proper spacing between icon and title

[Marge Bot <marge-bot src gnome org>]

commit 3795ccbcf343c4619d9e67279b862aee27b15ad0
Author: Jonas Dreßler <verdre v0yd nl>
Date:   Tue Feb 9 12:18:29 2021 +0100

    windowPreview: Use a proper spacing between icon and title
    
    Right now the spacing between icon and title works using a little trick
    that doesn't really seem intended: The title is offset by
    (icon-height * ICON_OVERLAP), when the icon is actually overlapping the
    preview by ICON_OVERLAP, and *overflowing* the preview by
    (1 - ICON_OVERLAP).
    
    So correct that and offset the title by
    (icon-height * (1 - ICON_OVERLAP)), and since now there's no spacing
    anymore, add a proper ICON_TITLE_SPACING to that offset.
    
    Also add the new ICON_TITLE_SPACING to the overlapHeight, where the
    spacing was ignored so far.
    
    Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/1692>

 js/ui/windowPreview.js | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)
---
diff --git a/js/ui/windowPreview.js b/js/ui/windowPreview.js
index 996d66bf55..f4a65b620e 100644
--- a/js/ui/windowPreview.js
+++ b/js/ui/windowPreview.js
@@ -20,6 +20,8 @@ var DRAGGING_WINDOW_OPACITY = 100;
 const ICON_SIZE = 64;
 const ICON_OVERLAP = 0.7;
 
+const ICON_TITLE_SPACING = 6;
+
 var WindowPreviewLayout = GObject.registerClass({
     Properties: {
         'bounding-box': GObject.ParamSpec.boxed(
@@ -325,10 +327,11 @@ var WindowPreview = GObject.registerClass({
             source: this._windowContainer,
             coordinate: Clutter.BindCoordinate.X,
         }));
+        const iconBottomOverlap = ICON_SIZE * (1 - ICON_OVERLAP);
         this._title.add_constraint(new Clutter.BindConstraint({
             source: this._windowContainer,
             coordinate: Clutter.BindCoordinate.Y,
-            offset: scaleFactor * ICON_SIZE * ICON_OVERLAP,
+            offset: scaleFactor * (iconBottomOverlap + ICON_TITLE_SPACING),
         }));
         this._title.add_constraint(new Clutter.AlignConstraint({
             source: this._windowContainer,
@@ -338,7 +341,7 @@ var WindowPreview = GObject.registerClass({
         this._title.add_constraint(new Clutter.AlignConstraint({
             source: this._windowContainer,
             align_axis: Clutter.AlignAxis.Y_AXIS,
-            pivot_point: new Graphene.Point({ x: -1, y: ICON_OVERLAP }),
+            pivot_point: new Graphene.Point({ x: -1, y: 0 }),
             factor: 1,
         }));
         this._title.clutter_text.ellipsize = Pango.EllipsizeMode.END;
@@ -455,7 +458,7 @@ var WindowPreview = GObject.registerClass({
         const [, titleHeight] = this._title.get_preferred_height(-1);
 
         const topOverlap = 0;
-        const bottomOverlap = titleHeight;
+        const bottomOverlap = ICON_TITLE_SPACING + titleHeight;
 
         return [topOverlap, bottomOverlap];
     }