Center align shortcut badges when iconSize < 48

Summary:
When iconSize is not big enough, center aligned shortcut badges look better than top-left aligned ones.

BUG: 406037

Test Plan:
- When iconSize < 48: shortcut badges are center aligned
- When iconSize >= 48: they are top-left aligned

For example, with iconSize = 32:
Before:
{F6736365}
After:
{F6736366}

Reviewers: #latte_dock, mvourlakos

Reviewed By: mvourlakos

Subscribers: mvourlakos, plasma-devel

Tags: #plasma

Differential Revision: https://phabricator.kde.org/D20128

containment/package/contents/ui/applet/ShortcutBadge.qml

@@ -97,10 +97,14 @@ Loader{
 
         LatteComponents.BadgeText {
             id: appletNumber
-            anchors.top: parent.top
-            anchors.left: parent.left
-            //anchors.centerIn: parent
 
+            // when iconSize < 48, height is always = 24, height / iconSize > 50%
+            // we prefer center aligned badges to top-left aligned ones
+            property bool centerInParent: root.iconSize < 48
+
+            anchors.left: centerInParent? undefined : parent.left
+            anchors.top: centerInParent? undefined : parent.top
+            anchors.centerIn: centerInParent? parent : undefined
             minimumWidth: 0.4 * (wrapper.zoomScale * root.iconSize)
             height: Math.max(24, 0.4 * (wrapper.zoomScale * root.iconSize))
 

plasmoid/package/contents/ui/task/ShortcutBadge.qml

@@ -58,9 +58,14 @@ Loader{
 
         LatteComponents.BadgeText {
             id: taskNumber
-            anchors.left: parent.left
+
-            anchors.top: parent.top
+            // when iconSize < 48, height is always = 24, height / iconSize > 50%
-            //anchors.centerIn: parent
+            // we prefer center aligned badges to top-left aligned ones
+            property bool centerInParent: root.iconSize < 48
+
+            anchors.left: centerInParent? undefined : parent.left
+            anchors.top: centerInParent? undefined : parent.top
+            anchors.centerIn: centerInParent? parent : undefined
             minimumWidth: 0.4 * (wrapper.mScale * root.iconSize)
             height: Math.max(24, 0.4 * (wrapper.mScale * root.iconSize))