WIP: Improve alignment of icons in plasmoid

model/syncthingicons.cpp

@@ -303,8 +303,8 @@ FontAwesomeIcons::FontAwesomeIcons(const QColor &color, const QSize &size, int m
 IconManager::IconManager()
     : m_statusIcons()
     , m_trayIcons(m_statusIcons)
-    , m_fontAwesomeIconsForLightTheme(QColor(10, 10, 10), QSize(64, 64), 8)
-    , m_fontAwesomeIconsForDarkTheme(Qt::white, QSize(64, 64), 8)
+    , m_fontAwesomeIconsForLightTheme(QColor(10, 10, 10), QSize(64, 64), 4)
+    , m_fontAwesomeIconsForDarkTheme(Qt::white, QSize(64, 64), 4)
 {
 }
 

plasmoid/package/contents/ui/DetailItem.qml

@@ -17,23 +17,30 @@ Item {
         width: parent.width
 
         PlasmaCore.IconItem {
-            source: detailIcon
+            id: icon
             Layout.leftMargin: units.iconSizes.small * 1.1
-            Layout.preferredWidth: units.iconSizes.small
             Layout.preferredHeight: units.iconSizes.small
+            Layout.preferredWidth: height
+            Layout.fillHeight: true
+            Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
+            source: detailIcon
             opacity: 0.8
         }
         PlasmaComponents.Label {
             Layout.preferredWidth: 100
+            Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
             text: detailName
             font.weight: Font.DemiBold
+            verticalAlignment: Qt.AlignVCenter
         }
         PlasmaComponents.Label {
             Layout.leftMargin: theme.defaultFont.pointSize * 0.9
             Layout.fillWidth: true
+            Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
             text: detailValue
             elide: Text.ElideRight
             horizontalAlignment: Qt.AlignRight
+            verticalAlignment: Qt.AlignVCenter
         }
     }
 

plasmoid/package/contents/ui/IconLabel.qml

@@ -18,12 +18,22 @@ Item {
 
         PlasmaCore.IconItem {
             id: iconItem
-            Layout.preferredWidth: 16
-            Layout.preferredHeight: 16
+            Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
+            Layout.maximumWidth: units.iconSizes.small
+            Layout.maximumHeight: units.iconSizes.small
             opacity: 0.7
+            Rectangle {
+                color: "red"
+                anchors.top: parent.top
+                anchors.left: parent.left
+                width: parent.paintedWidth
+                height: parent.paintedHeight
+            }
         }
         PlasmaComponents.Label {
             id: label
+            Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
+            verticalAlignment: Qt.AlignVCenter
         }
     }