[gnome-shell/wip/snwh/style-updates] theme: some radii sanity



commit 8883ac55f42311134f873d266bb9c4a92f8bc1df
Author: Sam Hewitt <sam snwh org>
Date:   Fri Dec 31 15:43:00 2021 -0330

    theme: some radii sanity

 data/theme/gnome-shell-sass/_common.scss           | 21 +++++++++++----------
 data/theme/gnome-shell-sass/_drawing.scss          |  1 -
 data/theme/gnome-shell-sass/widgets/_app-grid.scss |  4 ++--
 data/theme/gnome-shell-sass/widgets/_calendar.scss |  1 -
 data/theme/gnome-shell-sass/widgets/_dash.scss     |  2 +-
 data/theme/gnome-shell-sass/widgets/_keyboard.scss |  7 ++++---
 data/theme/gnome-shell-sass/widgets/_popovers.scss |  2 +-
 7 files changed, 19 insertions(+), 19 deletions(-)
---
diff --git a/data/theme/gnome-shell-sass/_common.scss b/data/theme/gnome-shell-sass/_common.scss
index f89eba6d3d..37fb585ad0 100644
--- a/data/theme/gnome-shell-sass/_common.scss
+++ b/data/theme/gnome-shell-sass/_common.scss
@@ -31,9 +31,10 @@ $base_margin: 4px;
 $base_spacing: 6px;
 
 // border radii
-$base_border_radius: 10px;
+$base_border_radius: 8px;
 
-$modal_radius:$base_border_radius * 2;
+// radii of things that display over other things, e.g. popovers
+$modal_radius: $base_border_radius*3; // 24px
 
 // non-standard colors
 $bubble_borders_color: lighten($borders_color, if($variant=='light', 0%, 5%));
@@ -77,7 +78,7 @@ stage {
   color: $osd_fg_color;
   background-color: $osd_bg_color;
   border: 1px solid $osd_outer_borders_color;
-  border-radius: $base_border_radius*2 + 4px;
+  border-radius: $modal_radius;
   padding: $base_padding*2;
 }
 
@@ -90,7 +91,7 @@ stage {
 
 // icon tiles
 %icon_tile {
-  border-radius: $base_border_radius + 4px;
+  border-radius: $base_border_radius * 2; // 16px
   padding: $base_padding;
   border: 2px solid transparent;
   transition-duration: 100ms;
@@ -106,7 +107,7 @@ stage {
 
 // button styling
 %button {
-  border-radius: $base_border_radius;
+  border-radius: $base_border_radius - 2px; // 6px
   border-style: solid;
   border-width: 1px;
   min-height: 22px;
@@ -162,18 +163,18 @@ stage {
   &:hover { @include button(hover, $shadow: none); }
   &:active { @include button(active, $shadow: none); }
 
-  // radius is 2 pixel less to fit in bubble
+  // make radius fit in bubble corner
   &:first-child {
-    border-radius: 0 0 0 $base_border_radius - 3px;
+    border-radius: 0 0 0 $base_border_radius - 5px;
   }
 
   &:last-child {
     border-right-width: 0;
-    border-radius: 0 0 $base_border_radius - 3px 0;
+    border-radius: 0 0 $base_border_radius - 5px 0;
   }
 
   &:first-child:last-child {
-    border-radius: 0 0 $base_border_radius - 3px $base_border_radius - 3px;
+    border-radius: 0 0 $base_border_radius - 5px $base_border_radius - 5px;
   }
 }
 
@@ -181,7 +182,7 @@ stage {
 @mixin notification_bubble($flat: false) {
   border-width: 0px;
   border-style: solid;
-  border-radius: $base_border_radius + 2px;
+  border-radius: $base_border_radius;
   margin: $base_margin;
 
   @if $flat {
diff --git a/data/theme/gnome-shell-sass/_drawing.scss b/data/theme/gnome-shell-sass/_drawing.scss
index 806fcba78d..7ec71cc7bc 100644
--- a/data/theme/gnome-shell-sass/_drawing.scss
+++ b/data/theme/gnome-shell-sass/_drawing.scss
@@ -143,7 +143,6 @@
     // box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
     text-shadow: 0 1px $text_shadow_color;
     icon-shadow: 0 1px $text_shadow_color;
-    border-radius: $base_border_radius - 2px;
   }
 
   // focused button
diff --git a/data/theme/gnome-shell-sass/widgets/_app-grid.scss 
b/data/theme/gnome-shell-sass/widgets/_app-grid.scss
index 1707ca1fe7..c90c4a358c 100644
--- a/data/theme/gnome-shell-sass/widgets/_app-grid.scss
+++ b/data/theme/gnome-shell-sass/widgets/_app-grid.scss
@@ -35,12 +35,12 @@ $app_grid_fg_color: #fff;
 /* App Folders */
 .app-well-app.app-folder {
   background-color: $dash_background_color;
-  border-radius: $base_border_radius + 4px; // same as %icon_tile
+  border-radius: $base_border_radius * 2; // same as %icon_tile
 }
 
 // expanded folder
 .app-folder-dialog { //style like the dash
-  border-radius: $modal_radius * 1.5;
+  border-radius: 48px;
   background-color: $dash_background_color;
   padding: 12px 0px 12px 0px;
 
diff --git a/data/theme/gnome-shell-sass/widgets/_calendar.scss 
b/data/theme/gnome-shell-sass/widgets/_calendar.scss
index 4e5d182efd..7273f3a370 100644
--- a/data/theme/gnome-shell-sass/widgets/_calendar.scss
+++ b/data/theme/gnome-shell-sass/widgets/_calendar.scss
@@ -72,7 +72,6 @@
     background-color: transparent;
     height: 32px;
     width: 32px;
-    border-radius: $base_border_radius - 3px;
     &:hover, &:focus { background-color: $hover_bg_color; }
     &:active { background-color: $active_bg_color; }
   }
diff --git a/data/theme/gnome-shell-sass/widgets/_dash.scss b/data/theme/gnome-shell-sass/widgets/_dash.scss
index 1d36122c32..8a2351bf52 100644
--- a/data/theme/gnome-shell-sass/widgets/_dash.scss
+++ b/data/theme/gnome-shell-sass/widgets/_dash.scss
@@ -5,7 +5,7 @@ $dash_placeholder_size: 32px;
 $dash_padding: $base_padding + 4px; // 10px
 $dash_spacing: $base_padding / 4;
 $dash_bottom_margin: $base_margin * 4;
-$dash_border_radius: $modal_radius + 6;
+$dash_border_radius: $modal_radius + 2px;
 
 #dash {
   @include fontsize($base_font_size - 2);
diff --git a/data/theme/gnome-shell-sass/widgets/_keyboard.scss 
b/data/theme/gnome-shell-sass/widgets/_keyboard.scss
index ac08b630f3..4a5dbc671d 100644
--- a/data/theme/gnome-shell-sass/widgets/_keyboard.scss
+++ b/data/theme/gnome-shell-sass/widgets/_keyboard.scss
@@ -1,7 +1,7 @@
 /* On-screen Keyboard */
 
 $key_size: 1.2em;
-$key_border_radius: $base_border_radius + 3px;
+$key_border_radius: $base_border_radius + 4px; // 12px
 $key_bg_color:  darken($osd_fg_color, 70%);
 // $default_key_bg_color: darken($key_bg_color, 4%);
 $default_key_bg_color: if($variant=='light', darken($key_bg_color, 11%), darken($key_bg_color, 10%));
@@ -87,13 +87,14 @@ $default_key_bg_color: if($variant=='light', darken($key_bg_color, 11%), darken(
 
 // long press on a key popup
 .keyboard-subkeys {
-  -arrow-border-radius: $modal_radius;
+  -arrow-border-radius: $base_border_radius*2;
   -arrow-background-color: $osd_bg_color;
   -arrow-border-width: 1px;
   -arrow-border-color: lighten($osd_bg_color, 9%);
   -arrow-base: 20px;
   -arrow-rise: 10px;
   -boxpointer-gap: $base_spacing;
+  padding: $base_padding;
 
   .keyboard-key {
     @include button(normal, $c:$key_bg_color, $tc:$osd_fg_color);
@@ -102,7 +103,7 @@ $default_key_bg_color: if($variant=='light', darken($key_bg_color, 11%), darken(
     &:hover, &:checked { @include button(hover, $c: $key_bg_color, $tc:$osd_fg_color);}
     &:active { @include button(active, $c: $key_bg_color, $tc:$osd_fg_color); }
 
-    border-radius:$base_border_radius;
+    border-radius:$key_border_radius;
   }
 }
 
diff --git a/data/theme/gnome-shell-sass/widgets/_popovers.scss 
b/data/theme/gnome-shell-sass/widgets/_popovers.scss
index 1e7bba4787..372d5841da 100644
--- a/data/theme/gnome-shell-sass/widgets/_popovers.scss
+++ b/data/theme/gnome-shell-sass/widgets/_popovers.scss
@@ -2,7 +2,7 @@
 
 // the popover itself
 .popup-menu-boxpointer {
-  -arrow-border-radius: $modal_radius - 3px;
+  -arrow-border-radius: $modal_radius;
   -arrow-background-color: $bg_color;
   -arrow-border-color: $borders_color;
   -arrow-border-width: 1px;


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]