css/quick-settings: Update icon-button styles

- add an entire	flat style to button drawing function
- clean	up the icon button css in quick	settings
- adjust padding in QS sliders
- fixes #5918

Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/2510>

2 files changed, 17 insertions, 8 deletions

diff --git a/widgets/_buttons.scss b/widgets/_buttons.scss
index df99524..def96fe 100644
--- a/widgets/_buttons.scss
+++ b/widgets/_buttons.scss
@@ -6,5 +6,14 @@
 }
 
 .icon-button {
-  @extend %icon_button; // that's it
-}
+  @extend .button; // same style as buttons
+
+  border-radius: 99px;
+  padding: $base_padding*2;
+  min-height: 16px;
+
+  StIcon {
+    icon-size: $base_icon_size;
+    -st-icon-style: symbolic;
+  }
+}
\ No newline at end of file
diff --git a/widgets/_quick-settings.scss b/widgets/_quick-settings.scss
index 4e84cdf..b429a2d 100644
--- a/widgets/_quick-settings.scss
+++ b/widgets/_quick-settings.scss
@@ -48,8 +48,6 @@
 }
 
 .quick-slider {
-  padding: 0 $base_padding;
-
   & > StBoxLayout { spacing: $base_padding; }
 
   .slider-bin {
@@ -58,8 +56,12 @@
     padding: $base_padding;
     border-radius: 99px;
   }
-  .quick-toggle-icon { icon-size: $base_icon_size; }
-  .icon-button { background-color: transparent; }
+  .quick-toggle-icon {
+    icon-size: $base_icon_size;
+
+    &:ltr { margin-left: $base_padding; }
+    &:rtl { margin-right: $base_padding; }
+  }
 }
 
 .quick-toggle-menu {
@@ -100,8 +102,6 @@
 .quick-settings-system-item {
   & > StBoxLayout { spacing: 2 * $base_padding; }
 
-  .icon-button > StIcon { -st-icon-style: symbolic; }
-
   & .power-item {
     min-height: 0;
     min-width: 0;