[libadwaita/wip/exalm/stylesheet2: 98/103] stylesheet: Split misc widget styles into a separate file

[Alexander Mikhaylenko <alexm src gnome org>]

commit 02427234b67dd8500f343a4af3d70c9b5047a9d6
Author: Alexander Mikhaylenko <alexm gnome org>
Date:   Fri Apr 9 14:30:38 2021 +0500

    stylesheet: Split misc widget styles into a separate file

 src/stylesheet/_common.scss       | 135 +------------------------------------
 src/stylesheet/_widgets.scss      |   1 +
 src/stylesheet/meson.build        |   1 +
 src/stylesheet/widgets/_misc.scss | 136 ++++++++++++++++++++++++++++++++++++++
 4 files changed, 139 insertions(+), 134 deletions(-)
---
diff --git a/src/stylesheet/_common.scss b/src/stylesheet/_common.scss
index 21f2896..01123ef 100644
--- a/src/stylesheet/_common.scss
+++ b/src/stylesheet/_common.scss
@@ -17,9 +17,6 @@ $popover_radius: $button_radius + 4;
 $treeview_borders_color: if($variant=='light',mix($borders_color, $base_color,80%),mix($fg_color, 
$base_color, 20%));
 $treeview_backdrop_borders_color: if($variant=='light',mix($backdrop_borders_color, $base_color, 
80%),mix($backdrop_fg_color, $base_color, 20%));
 
-/***************
- * Base States *
- ***************/
 .background {
   color: $fg_color;
   background-color: $bg_color;
@@ -37,26 +34,6 @@ dnd {
   -gtk-icon-size: 32px;
 }
 
-window.assistant {
-  .sidebar {
-    padding: $menu-margin;
-    border-top: 1px solid $borders_color;
-  }
-
-  &.csd .sidebar { border-top-style: none; }
-
-  .sidebar > label { padding: 6px 12px; }
-
-  .sidebar > label.highlight {
-    background-color: $menu_selected_color;
-    border-radius: $menu-margin;
-  }
-}
-
-window.aboutdialog image.large-icons {
-  -gtk-icon-size: 128px;
-}
-
 %osd,
 .osd {
   color: $osd_fg_color;
@@ -65,107 +42,6 @@ window.aboutdialog image.large-icons {
   background-clip: padding-box;
 }
 
-/****************
- * Print dialog *
-*****************/
-window.dialog.print {
-  drawing {
-    color: $fg_color;
-    background: none;
-    border: none;
-    padding: 0;
-
-    paper {
-      background: white;
-      color: #2e3436;
-      border: 1px solid $borders_color;
-    }
-  }
-
-  .dialog-action-box { margin: 12px; }
-}
-
-
-/**********
- * Frames *
- **********/
-frame,
-.frame {
-  border: 1px solid $borders_color;
-}
-
-frame {
-  border-radius: $window_radius;
-
-  > label {
-    margin: 4px;
-  }
-}
-
-//vbox and hbox separators
-separator {
-  background: lighten($borders_color, 5%);
-  min-width: 1px;
-  min-height: 1px;
-}
-
-
-/*********************
- * App Notifications *
- *********************/
-.app-notification {
-  @extend %osd;
-
-  padding: 10px;
-  border-spacing: 10px;
-  border-radius: 0 0 5px 5px;
-  background-color: $osd_bg_color;
-  background-image: linear-gradient(to bottom, transparentize(black, 0.8),
-                                               transparent 2px);
-  background-clip: padding-box;
-
-  button { @extend %osd_button; }
-
-  border { border: none; }
-}
-
-
-/**************
- * GtkVideo *
- **************/
-
-video {
-  & image.osd {
-    min-width: 64px;
-    min-height: 64px;
-    border-radius: 32px;
-  }
-  background: black;
-}
-
-
-/********
- * Misc *
- ********/
-
-.scale-popup {
-  .osd & { @extend %osd; }
-
-  .osd & button.flat {  //FIXME: quick hack, redo properly
-    border-style: none;
-    border-radius: 5px;
-  }
-
-  button { // +/- buttons on GtkVolumeButton popup
-    &:hover {
-      @extend %undecorated_button;
-      background-color: transparentize($fg_color,0.9);
-      border-radius: 5px;
-    }
-  }
-}
-
-
 // catch all extend :)
 
 %selected_items {
@@ -197,10 +73,6 @@ expander-widget {
   }
 }
 
-
-/*************
- * App Icons *
- *************/
 /* Outline for low res icons */
 .lowres-icon {
     -gtk-icon-shadow: 0 -1px rgba(0,0,0,0.05),
@@ -209,7 +81,7 @@ expander-widget {
       -1px 0 rgba(0,0,0,0.1);
 }
 
-/* Drapshadow for large icons */
+/* Drop shadow for large icons */
 .icon-dropshadow {
   -gtk-icon-shadow: 0 1px 12px rgba(0,0,0,0.05),
       0 -1px rgba(0,0,0,0.05),
@@ -218,10 +90,5 @@ expander-widget {
       -1px 0 rgba(0,0,0,0.1);
 }
 
-
-statusbar {
-  padding: 6px 10px 6px 10px;
-}
-
 @import 'widgets';
 @import 'custom';
diff --git a/src/stylesheet/_widgets.scss b/src/stylesheet/_widgets.scss
index a44cfd6..26057c3 100644
--- a/src/stylesheet/_widgets.scss
+++ b/src/stylesheet/_widgets.scss
@@ -14,6 +14,7 @@
 @import 'widgets/lists';
 @import 'widgets/menus';
 @import 'widgets/message-dialog';
+@import 'widgets/misc';
 @import 'widgets/notebook';
 @import 'widgets/paned';
 @import 'widgets/popovers';
diff --git a/src/stylesheet/meson.build b/src/stylesheet/meson.build
index 06f6fe1..d1b6915 100644
--- a/src/stylesheet/meson.build
+++ b/src/stylesheet/meson.build
@@ -36,6 +36,7 @@ if not fs.exists('Adwaita-light.css')
       'widgets/_lists.scss',
       'widgets/_menus.scss',
       'widgets/_message-dialog.scss',
+      'widgets/_misc.scss',
       'widgets/_notebook.scss',
       'widgets/_paned.scss',
       'widgets/_popovers.scss',
diff --git a/src/stylesheet/widgets/_misc.scss b/src/stylesheet/widgets/_misc.scss
new file mode 100644
index 0000000..08bdfb7
--- /dev/null
+++ b/src/stylesheet/widgets/_misc.scss
@@ -0,0 +1,136 @@
+/**********
+ * Frames *
+ **********/
+frame,
+.frame {
+  border: 1px solid $borders_color;
+}
+
+frame {
+  border-radius: $window_radius;
+
+  > label {
+    margin: 4px;
+  }
+}
+
+/**************
+ * Separators *
+ **************/
+
+separator {
+  background: lighten($borders_color, 5%);
+  min-width: 1px;
+  min-height: 1px;
+}
+
+/*********************
+ * App Notifications *
+ *********************/
+
+.app-notification {
+  @extend %osd;
+
+  padding: 10px;
+  border-spacing: 10px;
+  border-radius: 0 0 5px 5px;
+  background-color: $osd_bg_color;
+  background-image: linear-gradient(to bottom, transparentize(black, 0.8),
+                                               transparent 2px);
+  background-clip: padding-box;
+
+  button { @extend %osd_button; }
+
+  border { border: none; }
+}
+
+/**************
+ * GtkVideo *
+ **************/
+
+video {
+  & image.osd {
+    min-width: 64px;
+    min-height: 64px;
+    border-radius: 32px;
+  }
+  background: black;
+}
+
+/******************
+ * GtkScaleButton *
+ ******************/
+
+.scale-popup {
+  .osd & { @extend %osd; }
+
+  .osd & button.flat {  //FIXME: quick hack, redo properly
+    border-style: none;
+    border-radius: 5px;
+  }
+
+  button { // +/- buttons on GtkVolumeButton popup
+    &:hover {
+      @extend %undecorated_button;
+      background-color: transparentize($fg_color,0.9);
+      border-radius: 5px;
+    }
+  }
+}
+
+/****************
+ * Print dialog *
+*****************/
+
+window.dialog.print {
+  drawing {
+    color: $fg_color;
+    background: none;
+    border: none;
+    padding: 0;
+
+    paper {
+      background: white;
+      color: #2e3436;
+      border: 1px solid $borders_color;
+    }
+  }
+
+  .dialog-action-box { margin: 12px; }
+}
+
+/****************
+ * GtkAssistant *
+ ****************/
+
+window.assistant {
+  .sidebar {
+    padding: $menu-margin;
+    border-top: 1px solid $borders_color;
+  }
+
+  &.csd .sidebar { border-top-style: none; }
+
+  .sidebar > label { padding: 6px 12px; }
+
+  .sidebar > label.highlight {
+    background-color: $menu_selected_color;
+    border-radius: $menu-margin;
+  }
+}
+
+/****************
+ * GtkAboutDialog *
+ ****************/
+
+window.aboutdialog image.large-icons {
+  -gtk-icon-size: 128px;
+}
+
+/****************
+ * GtkStatusBar *
+ ****************/
+
+statusbar {
+  padding: 6px 10px 6px 10px;
+}