From 07c899dd0c756e9bb4092b879bde250ba5145621 Mon Sep 17 00:00:00 2001
From: purian23 <purian23@gmail.com>
Date: Wed, 28 Oct 2026 07:58:22 -0400
Subject: [PATCH] settings: reposition appearance card in the interface tab

Port 2.0
---
 .../Modules/Settings/ThemeSurfacesTab.qml     | 88 +++++++++----------
 1 file changed, 44 insertions(+), 44 deletions(-)

diff --git a/quickshell/Modules/Settings/ThemeSurfacesTab.qml b/quickshell/Modules/Settings/ThemeSurfacesTab.qml
index 1b11d8e75..65e5ce77d 100644
--- a/quickshell/Modules/Settings/ThemeSurfacesTab.qml
+++ b/quickshell/Modules/Settings/ThemeSurfacesTab.qml
@@ -76,6 +76,50 @@ Column {
         PopoutService.colorPickerModal.open();
     }
 
+    SettingsCard {
+        tab: "theme"
+        title: I18n.tr("Appearance")
+        settingKey: "surfaceAppearance"
+
+        SettingsButtonGroupRow {
+            tab: "theme"
+            tags: ["style", "classic", "expressive", "pill", "round", "shape", "morph", "corners", "buttons"]
+            settingKey: "interfaceStyle"
+            text: I18n.tr("Style")
+            model: [I18n.tr("Expressive"), I18n.tr("Classic", "interface style option with one corner radius on controls and no shape change on press")]
+            values: ["expressive", "classic"]
+            value: SettingsData.interfaceStyle
+            fallbackValue: "expressive"
+            onValueSelected: value => SettingsData.set("interfaceStyle", value)
+        }
+
+        SettingsButtonGroupRow {
+            tab: "theme"
+            tags: ["density", "compact", "dense", "spacious", "comfortable", "spacing", "padding", "rows", "menus", "control center", "bar", "dock", "island", "frame", "size"]
+            settingKey: "density"
+            text: I18n.tr("Interface density", "interface density setting label")
+            model: [I18n.tr("Spacious", "interface density option with the most room between items"), I18n.tr("Comfortable", "interface density option with the default spacing"), I18n.tr("Compact", "interface density option fitting the most items on screen"), I18n.tr("Dense", "interface density option denser than compact for small text and tight rows")]
+            values: ["spacious", "comfortable", "compact", "dense"]
+            value: SettingsData.density
+            fallbackValue: "comfortable"
+            onValueSelected: value => SettingsData.set("density", value)
+        }
+
+        SettingsSliderRow {
+            tab: "theme"
+            tags: ["classic", "divider", "dividers", "lines", "rows", "sections", "sidebar", "outline"]
+            settingKey: "sectionDividerOpacity"
+            visible: SettingsData.interfaceStyle === "classic"
+            text: I18n.tr("Section dividers", "classic interface style: strength of the lines between rows of a settings section")
+            minimumLabel: I18n.tr("Off")
+            minimum: 0
+            maximum: 40
+            step: 1
+            value: Math.round((SettingsData.sectionDividerOpacity ?? 0) * 100)
+            onSliderValueChanged: newValue => SettingsData.set("sectionDividerOpacity", newValue / 100)
+        }
+    }
+
     SettingsCard {
         tab: "theme"
         tags: ["surface", "popup", "transparency", "opacity", "modal", "corner", "radius", "blur", "background", "glass", "frosted", "shadow", "elevation", "foreground", "layers"]
@@ -249,50 +293,6 @@ Column {
         }
     }
 
-    SettingsCard {
-        tab: "theme"
-        title: I18n.tr("Appearance")
-        settingKey: "surfaceAppearance"
-
-        SettingsButtonGroupRow {
-            tab: "theme"
-            tags: ["style", "classic", "expressive", "pill", "round", "shape", "morph", "corners", "buttons"]
-            settingKey: "interfaceStyle"
-            text: I18n.tr("Style")
-            model: [I18n.tr("Expressive"), I18n.tr("Classic", "interface style option with one corner radius on controls and no shape change on press")]
-            values: ["expressive", "classic"]
-            value: SettingsData.interfaceStyle
-            fallbackValue: "expressive"
-            onValueSelected: value => SettingsData.set("interfaceStyle", value)
-        }
-
-        SettingsButtonGroupRow {
-            tab: "theme"
-            tags: ["density", "compact", "dense", "spacious", "comfortable", "spacing", "padding", "rows", "menus", "control center", "bar", "dock", "island", "frame", "size"]
-            settingKey: "density"
-            text: I18n.tr("Interface density", "interface density setting label")
-            model: [I18n.tr("Spacious", "interface density option with the most room between items"), I18n.tr("Comfortable", "interface density option with the default spacing"), I18n.tr("Compact", "interface density option fitting the most items on screen"), I18n.tr("Dense", "interface density option denser than compact for small text and tight rows")]
-            values: ["spacious", "comfortable", "compact", "dense"]
-            value: SettingsData.density
-            fallbackValue: "comfortable"
-            onValueSelected: value => SettingsData.set("density", value)
-        }
-
-        SettingsSliderRow {
-            tab: "theme"
-            tags: ["classic", "divider", "dividers", "lines", "rows", "sections", "sidebar", "outline"]
-            settingKey: "sectionDividerOpacity"
-            visible: SettingsData.interfaceStyle === "classic"
-            text: I18n.tr("Section dividers", "classic interface style: strength of the lines between rows of a settings section")
-            minimumLabel: I18n.tr("Off")
-            minimum: 0
-            maximum: 40
-            step: 1
-            value: Math.round((SettingsData.sectionDividerOpacity ?? 0) * 100)
-            onSliderValueChanged: newValue => SettingsData.set("sectionDividerOpacity", newValue / 100)
-        }
-    }
-
     SettingsCard {
         tab: "theme"
         tags: ["corner", "radius", "rounded", "square", "fixed", "material", "shape", "window"]