ags: update to new syntax

.config/ags/scss/_common.scss

@@ -47,14 +47,14 @@ menu {
     animation-iteration-count: 1;
 }
 
-menubar>menuitem {
+menubar > menuitem {
     border-radius: 0.545rem;
     -gtk-outline-radius: 0.545rem;
     min-width: 13.636rem;
     min-height: 2.727rem;
 }
 
-menu>menuitem {
+menu > menuitem {
     padding: 0.4em 1.5rem;
     background: transparent;
     transition: 0.2s ease background;
@@ -62,14 +62,33 @@ menu>menuitem {
     -gtk-outline-radius: 0.545rem;
 }
 
-menu>menuitem:hover,
-menu>menuitem:focus {
+menu > menuitem:hover,
+menu > menuitem:focus {
     background-color: mix($surfaceVariant, $onSurfaceVariant, 90%);
 }
-menu>menuitem:active {
+menu > menuitem:active {
     background-color: mix($surfaceVariant, $onSurfaceVariant, 80%);
 }
 
+radio {
+    @include full-rounding;
+    margin: 0.273rem;
+    min-width: 15px;
+    min-height: 15px;
+    border: 0.068rem solid $outline;
+}
+
+// radio:first-child {
+//     background-color: red;
+// }
+
+radio:checked {
+    min-width: 8px;
+    min-height: 8px;
+    background-color: $onPrimary;
+    border: 0.477rem solid $primary;
+}
+
 tooltip {
     @include normal-rounding;
     background-color: $surfaceVariant;
@@ -129,17 +148,17 @@ tooltip {
     border: 0.068rem solid $outline;
 }
 
-.segment-container>*:first-child {
+.segment-container > *:first-child {
     border-top-left-radius: 9999px;
     border-bottom-left-radius: 9999px;
 }
 
-.segment-container>* {
+.segment-container > * {
     border-right: 0.068rem solid $outline;
     padding: 0.341rem 0.682rem;
 }
 
-.segment-container>*:last-child {
+.segment-container > *:last-child {
     border-right: 0rem solid transparent;
     border-top-right-radius: 9999px;
     border-bottom-right-radius: 9999px;
@@ -155,13 +174,13 @@ tooltip {
 }
 
 .segment-btn-enabled {
-    background-color: $secondaryContainer; 
+    background-color: $secondaryContainer;
     color: $onSecondaryContainer;
 }
 
 .segment-btn-enabled:hover,
 .segment-btn-enabled:focus {
-    background-color: $secondaryContainer; 
+    background-color: $secondaryContainer;
     color: $onSecondaryContainer;
 }
 
@@ -187,4 +206,4 @@ tooltip {
 
 .gap-h-15 {
     min-width: 1.023rem;
-}
+}

.config/ags/scss/_material.scss

@@ -1,29 +1,29 @@
 $darkmode: true;
-$primary: #ffabf1;
-$onPrimary: #551251;
-$primaryContainer: #702c69;
-$onPrimaryContainer: #ffd6f5;
-$secondary: #dbbed2;
-$onSecondary: #3d2b39;
-$secondaryContainer: #554050;
-$onSecondaryContainer: #f8daee;
-$tertiary: #f5b9a6;
-$onTertiary: #4c2619;
-$tertiaryContainer: #663c2e;
-$onTertiaryContainer: #ffdbcf;
+$primary: #51d7ef;
+$onPrimary: #00363f;
+$primaryContainer: #004e5a;
+$onPrimaryContainer: #9cefff;
+$secondary: #b1cbd1;
+$onSecondary: #1c3439;
+$secondaryContainer: #334a4f;
+$onSecondaryContainer: #cde7ed;
+$tertiary: #bcc5ea;
+$onTertiary: #262f4d;
+$tertiaryContainer: #3d4665;
+$onTertiaryContainer: #dae1ff;
 $error: #ffb4a9;
 $onError: #680003;
 $errorContainer: #930006;
 $onErrorContainer: #ffb4a9;
-$colorbarbg: #120F11;
-$background: #120F11;
-$onBackground: #eae0e4;
-$surface: #1f1a1d;
-$onSurface: #eae0e4;
-$surfaceVariant: #4e444b;
-$onSurfaceVariant: #d1c2cb;
-$outline: #9a8d95;
+$colorbarbg: #0F1011;
+$background: #0F1011;
+$onBackground: #e1e3e4;
+$surface: #191c1d;
+$onSurface: #e1e3e4;
+$surfaceVariant: #3f484a;
+$onSurfaceVariant: #bfc8ca;
+$outline: #899294;
 $shadow: #000000;
-$inverseSurface: #eae0e4;
-$inverseOnSurface: #342f32;
-$inversePrimary: #8c4483;
+$inverseSurface: #e1e3e4;
+$inverseOnSurface: #2d3132;
+$inversePrimary: #006877;