From bd7d16825b3ede69dc5a122f93d67530b2439d1a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Danielle=20For=C3=A9?= <danielle@elementary.io>
Date: Thu, 29 Oct 2026 12:34:25 -0700
Subject: [PATCH] SettingsPage.scss: modernize

---
 data/styles/SettingsPage.scss | 26 +++++++++++++-------------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/data/styles/SettingsPage.scss b/data/styles/SettingsPage.scss
index 916bad23..a2c2c7f8 100644
--- a/data/styles/SettingsPage.scss
+++ b/data/styles/SettingsPage.scss
@@ -4,13 +4,13 @@ settingspage {
             background:
                 linear-gradient(
                     to top,
-                    #{'alpha(@accent_color, 0)'} 80%,
-                    #{'alpha(@accent_color, 0.25)'} 100%
+                    color-mix(in srgb, #{'@accent_color'} 0%, transparent) 80%,
+                    color-mix(in srgb, #{'@accent_color'} 25%, transparent) 100%
                 ),
                 linear-gradient(
                     #{'@borders'},
-                    rgba(black, 0.05) 1px,
-                    rgba(black, 0.0) rem(3px)
+                    color-mix(in srgb, black 5%, transparent) 1px,
+                    transparent 0.25rem
                 );
         }
 
@@ -18,8 +18,8 @@ settingspage {
             background:
                 linear-gradient(
                     #{'@borders'},
-                    rgba(black, 0.05) 1px,
-                    rgba(black, 0.0) rem(3px)
+                    color-mix(in srgb, black 5%, transparent) 1px,
+                    transparent 0.25rem
                 );
         }
     }
@@ -33,11 +33,11 @@ settingspage {
         widget {
             &:dir(ltr) {
                 margin-left: rem(4px);
-                margin-right: rem(3px);
+                margin-right: 0.25rem;
             }
 
             &:dir(rtl) {
-                margin-left: rem(3px);
+                margin-left: 0.25rem;
                 margin-right: rem(4px);
             }
         }
@@ -68,7 +68,7 @@ settingspage {
 
     .header-area,
     .content-area {
-        padding: rem(12px);
+        padding: 1rem;
     }
 
     actionbar.action-area {
@@ -79,17 +79,17 @@ settingspage {
 
         box.end,
         box.start {
-            border-spacing: rem(6px);
-            padding: rem(12px);
+            border-spacing: 0.5rem;
+            padding: 1rem;
         }
     }
 
     windowcontrols {
-        margin: rem(6px);
+        margin: 0.5rem;
 
         &.start,
         &.end {
-            border-spacing: rem(6px);
+            border-spacing: 0.5rem;
         }
     }
 }