Predefined ColorScheme: 2 columns layout so the name is not truncated

Modules/Settings/Tabs/ColorSchemeTab.qml

@@ -318,7 +318,7 @@ ColumnLayout {
 
     // Color Schemes Grid
     GridLayout {
-      columns: 3
+      columns: 2
       rowSpacing: Style.marginM
       columnSpacing: Style.marginM
       Layout.fillWidth: true
@@ -349,14 +349,14 @@ ColumnLayout {
           }
 
           RowLayout {
+            id: scheme
             anchors.fill: parent
             anchors.margins: Style.marginL
-            spacing: Style.marginXS
+            spacing: Style.marginS
 
             NText {
               text: schemeItem.schemeName
               pointSize: Style.fontSizeS
-              font.weight: Style.fontWeightMedium
               color: Color.mOnSurface
               Layout.fillWidth: true
               elide: Text.ElideRight
@@ -365,31 +365,33 @@ ColumnLayout {
               maximumLineCount: 1
             }
 
+            property int diameter: 16 * Style.uiScaleRatio
+
             Rectangle {
-              width: 14
-              height: 14
-              radius: width * 0.5
+              width: scheme.diameter
+              height: scheme.diameter
+              radius: scheme.diameter * 0.5
               color: root.getSchemeColor(schemeItem.schemeName, "mPrimary")
             }
 
             Rectangle {
-              width: 14
-              height: 14
-              radius: width * 0.5
+              width: scheme.diameter
+              height: scheme.diameter
+              radius: scheme.diameter * 0.5
               color: root.getSchemeColor(schemeItem.schemeName, "mSecondary")
             }
 
             Rectangle {
-              width: 14
-              height: 14
-              radius: width * 0.5
+              width: scheme.diameter
+              height: scheme.diameter
+              radius: scheme.diameter * 0.5
               color: root.getSchemeColor(schemeItem.schemeName, "mTertiary")
             }
 
             Rectangle {
-              width: 14
-              height: 14
-              radius: width * 0.5
+              width: scheme.diameter
+              height: scheme.diameter
+              radius: scheme.diameter * 0.5
               color: root.getSchemeColor(schemeItem.schemeName, "mError")
             }
           }
@@ -413,7 +415,7 @@ ColumnLayout {
             visible: (Settings.data.colorSchemes.predefinedScheme === schemeItem.schemeName)
             anchors.right: parent.right
             anchors.top: parent.top
-            anchors.rightMargin: -3
+            anchors.rightMargin: 0
             anchors.topMargin: -3
             width: 20
             height: 20