Support GNOME 44 👽

2023-04-14 15:15:42 +01:00 · 2023-04-14 15:15:42 +01:00 · c80d054fd4
commit c80d054fd4
parent 4205a141bf
3 changed files with 117 additions and 192 deletions
--- a/modules/gnome/colors.mustache
+++ b/modules/gnome/colors.mustache
@ -1,71 +1,51 @@
-$is_highcontrast: "false";
+$is_highcontrast: false;

-$base_color: #{{base00-hex}};
+$base_color: #{{base01-hex}};
 $bg_color: #{{base00-hex}};
 $fg_color: #{{base05-hex}};
+$borders_color: transparentize($bg_color, 0.9);
+$outer_borders_color: transparentize($bg_color, 0.98);

 $selected_fg_color: #{{base00-hex}};
-$selected_bg_color: #{{base03-hex}};
-$selected_borders_color: if($variant== 'light', darken($selected_bg_color, 15%), darken($selected_bg_color, 30%));
-
-$borders_color: if($variant == 'light', transparentize($fg_color, .5), transparentize($fg_color, .9));
-$borders_edge: if($variant == 'light', rgba(255,255,255,0.8), lighten($bg_color, 5%));
+$selected_bg_color: #{{base0D-hex}};
+$selected_borders_color: transparentize($selected_bg_color, 0.9);

 $link_color: #{{base0D-hex}};
 $link_visited_color: #{{base0D-hex}};

-$warning_color: #{{base0E-hex}};
+$warning_color: #{{base0A-hex}};
 $error_color: #{{base08-hex}};
 $success_color: #{{base0B-hex}};
 $destructive_color: $error_color;

-$osd_fg_color: #{{base05-hex}};
 $osd_bg_color: #{{base01-hex}};
-$osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_color, 1), 10%), 0.5);
-$osd_insensitive_fg_color: $fg_color;
-$osd_borders_color: transparentize(black, 0.3);
-$osd_outer_borders_color: transparentize($osd_fg_color, 0.98);
+$osd_fg_color: #{{base05-hex}};
+$osd_insensitive_bg_color: #{{base01-hex}};
+$osd_insensitive_fg_color: #{{base05-hex}};
+$osd_borders_color: transparentize($osd_bg_color, 0.9);
+$osd_outer_borders_color: transparentize($osd_bg_color, 0.98);

-$shadow_color: if($variant == 'light', rgba(0,0,0,0.1), rgba(0,0,0,0.2));
+$shadow_color: rgba(0,0,0,0.1);

-// button
-$button_mix_factor: 5%;
+$button_mix_factor: 0%;
+$bubble_buttons_color: #{{base01-hex}};

-// cards
-$card_bg_color: #{{base01-hex}};
-$card_outer_borders_color: transparentize($fg_color, 0.98);
+$system_base_color: #{{base00-hex}};
+$system_fg_color: #{{base05-hex}};
+$system_bg_color: #{{base00-hex}};
+$system_borders_color: transparentize($system_bg_color, .9);
+$system_insensitive_fg_color: #{{base05-hex}};
+$system_overlay_bg_color: #{{base01-hex}}; // for non-transparent items, e.g. dash

-// notifications
-$bubble_buttons_color: $card_bg_color;
+$insensitive_fg_color: #{{base05-hex}};
+$insensitive_bg_color: #{{base01-hex}};
+$insensitive_borders_color: transparentize($insensitive_bg_color, 0.9);

-// overview background color
-$system_bg_color: $base_color;
+$checked_bg_color: #{{base01-hex}};
+$checked_fg_color: #{{base05-hex}};

-//insensitive state derived colors
-$insensitive_fg_color: $fg_color;
-$insensitive_bg_color: mix($bg_color, $base_color, 60%);
-$insensitive_borders_color: mix($borders_color, $base_color, 60%);
+$hover_bg_color: #{{base01-hex}};
+$hover_fg_color: #{{base05-hex}};

-//colors for the backdrop state, derived from the main colors.
-$backdrop_base_color: if($variant =='light', darken($base_color,1%), lighten($base_color,1%));
-$backdrop_bg_color: $bg_color;
-$backdrop_fg_color: mix($fg_color, $backdrop_bg_color, 80%);
-$backdrop_insensitive_color: if($variant =='light', darken($backdrop_bg_color,15%), lighten($backdrop_bg_color,15%));
-$backdrop_borders_color: mix($borders_color, $bg_color, 90%);
-$backdrop_dark_fill: mix($backdrop_borders_color,$backdrop_bg_color, 35%);
-
-
-// derived checked colors
-$checked_bg_color: if($variant=='light', darken($bg_color, 7%), lighten($bg_color, 7%));
-$card_checked_bg_color: if($variant=='light', darken($card_bg_color, 7%), lighten($card_bg_color, 7%));
-$checked_fg_color: if($variant=='light', darken($fg_color, 7%), lighten($fg_color, 7%));
-
-// derived hover colors
-$hover_bg_color: if($variant=='light', darken($bg_color, 3%), lighten($bg_color, 10%));
-$card_hover_bg_color: if($variant=='light', darken($card_bg_color, 3%), lighten($card_bg_color, 10%));
-$hover_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 10%));
-
-// derived active colors
-$active_bg_color: if($variant=='light', darken($bg_color, 5%), lighten($bg_color, 12%));
-$card_active_bg_color: if($variant=='light', darken($card_bg_color, 5%), lighten($card_bg_color, 12%));
-$active_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 12%));
+$active_bg_color: #{{base01-hex}};
+$active_fg_color: #{{base05-hex}};
--- a/modules/gnome/shell_colors.patch
+++ b/modules/gnome/shell_colors.patch
@ -1,161 +1,103 @@
+diff --git a/data/gnome-shell-theme.gresource.xml b/data/gnome-shell-theme.gresource.xml
+index 24b3be8db..3ec37da33 100644
+--- a/data/gnome-shell-theme.gresource.xml
+++ b/data/gnome-shell-theme.gresource.xml
+@@ -10,7 +10,6 @@
+     <file>checkbox-off-light.svg</file>
+     <file>checkbox-off.svg</file>
+     <file>gnome-shell.css</file>
+-    <file>gnome-shell-high-contrast.css</file>
+     <file>gnome-shell-start.svg</file>
+     <file>pad-osd.css</file>
+     <file>process-working.svg</file>
+diff --git a/data/theme/gnome-shell-sass/_common.scss b/data/theme/gnome-shell-sass/_common.scss
+index 953bee598..36ce19a4d 100644
+--- a/data/theme/gnome-shell-sass/_common.scss
+++ b/data/theme/gnome-shell-sass/_common.scss
+@@ -166,8 +166,8 @@ stage {
+ 
+ // tooltip
+ %tooltip {
+-  background-color: transparentize(black, 0.1);
+-  color: $light_1;
+  background-color: transparentize($bg_color, 0.1);
+  color: $fg_color;
+ 
+   border-radius: 99px;
+   padding: $base_padding $base_padding * 2;
 diff --git a/data/theme/gnome-shell-sass/_drawing.scss b/data/theme/gnome-shell-sass/_drawing.scss
-index 7c8959e2c..6066def91 100644
+index a69d38175..e79dc0c28 100644
 --- a/data/theme/gnome-shell-sass/_drawing.scss
 +++ b/data/theme/gnome-shell-sass/_drawing.scss
-@@ -248,7 +248,7 @@
-     &:insensitive {
-       @include button(insensitive);
-       background-color: transparent;
-      color: transparentize($selected_fg_color, .5);
-+      color: $insensitive_fg_color;
-     }
-   }
- }
-diff --git a/data/theme/gnome-shell-sass/widgets/_dash.scss b/data/theme/gnome-shell-sass/widgets/_dash.scss
-index 8f5d5f939..f3a7e1029 100644
--- a/data/theme/gnome-shell-sass/widgets/_dash.scss
-+++ b/data/theme/gnome-shell-sass/widgets/_dash.scss
-@@ -1,6 +1,6 @@
- /* Dash */
+@@ -143,7 +143,7 @@
+ //
+ // since buttons are all flat an borderless now the mixin is simpler
 
-$dash_background_color: lighten($system_bg_color, 5%);
-+$dash_background_color: $card_bg_color;
- $dash_placeholder_size: 32px;
- $dash_padding: $base_padding*2; // 12px
- $dash_border_radius: $modal_radius + $dash_padding;
-diff --git a/data/theme/gnome-shell-sass/widgets/_message-list.scss b/data/theme/gnome-shell-sass/widgets/_message-list.scss
-index 5196661c1..663e754bd 100644
--- a/data/theme/gnome-shell-sass/widgets/_message-list.scss
-+++ b/data/theme/gnome-shell-sass/widgets/_message-list.scss
-@@ -128,7 +128,7 @@
-   }
+-@mixin button($t, $tc:$fg_color, $c:$bg_color, $flat: false) {
+@mixin button($t, $tc:$fg_color, $c:$base_color, $flat: false) {
 
-   // body
-  .message-body {color: darken($fg_color, 10%);}
-+  .message-body {color: $fg_color;}
+   $button_bg_color: mix($tc, $c, $button_mix_factor);
+   transition-duration: 100ms;
+diff --git a/data/theme/gnome-shell-sass/widgets/_calendar.scss b/data/theme/gnome-shell-sass/widgets/_calendar.scss
+index 393221627..0bc93111a 100644
+--- a/data/theme/gnome-shell-sass/widgets/_calendar.scss
+++ b/data/theme/gnome-shell-sass/widgets/_calendar.scss
+@@ -27,6 +27,8 @@
+   .date-label {
+     @extend %title_2;
+   }
+
+  color: $fg_color !important;
 }
 
- // URLs in messages
-@@ -143,18 +143,17 @@
-   border-radius: $base_border_radius;
-   color: $fg_color;
- 
-  // colors are lightened since the media controls are in a card
-   &:hover {
-    background-color: lighten($hover_bg_color, 5%);
-+    background-color: $card_hover_bg_color;
-     color: $fg_color;
+ /* Calendar */
+@@ -250,7 +252,7 @@
+   .weather-forecast-time {
+     @extend %numeric;
+     @extend %caption;
+-    color: darken($fg_color,30%);
+    color: transparentize($insensitive_fg_color, 0.5);
+     padding-top: 0.2em;
+     padding-bottom: 0.4em;
   }
- 
-   &:active { 
-    background-color: lighten($active_bg_color, 5%);
-+    background-color: $card_active_bg_color;
-     color: $fg_color;
-   }
- 
-  &:insensitive { color: lighten($insensitive_fg_color, 5%); }
-+  &:insensitive { color: $insensitive_fg_color; }
-   
-   // fix margin for last button
-   &:last-child:ltr { margin-right: $base_margin*3; }
-@@ -171,7 +170,7 @@
-   // when there is no artwork
-   &.fallback {
-     color: darken($fg_color, 17%);
-    background-color: $bg_color;
-+    background-color: $card_bg_color;
-     border: 1px solid transparent;
-     border-radius: $base_border_radius;
-     icon-size: $large_icon_size !important; // 32px
 diff --git a/data/theme/gnome-shell-sass/widgets/_panel.scss b/data/theme/gnome-shell-sass/widgets/_panel.scss
-index fd3e7d2da..051eefbfe 100644
+index 650d4fa83..63ac5df8f 100644
 --- a/data/theme/gnome-shell-sass/widgets/_panel.scss
 +++ b/data/theme/gnome-shell-sass/widgets/_panel.scss
-@@ -1,7 +1,7 @@
+@@ -1,9 +1,9 @@
 /* Top Bar */
 // a.k.a. the panel
 
-$panel_bg_color: #000;
-+$panel_bg_color: $osd_bg_color;
- $panel_fg_color: if($variant == 'light', lighten($bg_color, 10%), darken($fg_color, 5%));
+-$panel_bg_color: if($variant == 'light', $light_3, $dark_5);
+-$panel_fg_color: if($variant == 'light', $fg_color, darken($fg_color, 5%));
+-$panel_border_color: if($variant == 'light', darken($panel_bg_color, 2%), $panel_bg_color);
+$panel_bg_color: $base_color;
+$panel_fg_color: $fg_color;
+$panel_border_color: transparentize($panel_bg_color, 0.9);
+ 
+ $panel_system_fg_color: $system_fg_color; // always light for lockscreen, overview and other transparent panels
 $panel_height: 2.2em;
- $panel_transition_duration: 250ms; // same as the overview transition duration
-diff --git a/data/theme/gnome-shell-sass/widgets/_popovers.scss b/data/theme/gnome-shell-sass/widgets/_popovers.scss
-index 138a4fc0f..ccd020a0f 100644
--- a/data/theme/gnome-shell-sass/widgets/_popovers.scss
-+++ b/data/theme/gnome-shell-sass/widgets/_popovers.scss
-@@ -37,22 +37,22 @@
-   &:rtl {padding-right: $base_padding;}
- 
-   &:focus, &:hover {
-    background-color: $hover_bg_color !important;
-    &:active { background-color: $active_bg_color !important;}
-+    background-color: $card_hover_bg_color !important;
-+    &:active { background-color: $card_active_bg_color !important;}
-   }
- 
-  &:checked {background-color: $checked_bg_color !important;}
-+  &:checked {background-color: $card_checked_bg_color !important;}
- 
-   &:checked {
-     margin-bottom: 0;
-    box-shadow: inset 0 -1px 0 0 darken($checked_bg_color, 5%);
-+    box-shadow: inset 0 -1px 0 0 darken($card_checked_bg_color, 5%);
-     border-radius: $base_border_radius $base_border_radius 0 0;
-    &:focus,&:hover { background-color: lighten($checked_bg_color, 3%) !important;}
-    &:active { background-color: lighten($checked_bg_color, 5%) !important;}
-+    &:focus,&:hover { background-color: lighten($card_checked_bg_color, 3%) !important;}
-+    &:active { background-color: lighten($card_checked_bg_color, 5%) !important;}
-   }
- 
-   &:active {
-    background-color: lighten($active_bg_color, 5%);
-+    background-color: lighten($card_active_bg_color, 5%);
-     color: $active_fg_color;
-   }
- 
-@@ -84,7 +84,7 @@
- 
- // popover submenus
- .popup-sub-menu {
-  background-color: $checked_bg_color;
-+  background-color: $card_checked_bg_color;
-   border-radius: 0 0 $base_border_radius $base_border_radius;
- 
-   .popup-menu-ornament {
-@@ -100,12 +100,12 @@
-       border-radius: 0 0 $base_border_radius $base_border_radius;
-     }
- 
-    &:focus,&:hover { background-color: $hover_bg_color !important;}
-+    &:focus,&:hover { background-color: $card_hover_bg_color !important;}
-     &:checked {
-      background-color: $checked_bg_color !important;
-      &:focus,&:hover { background-color: lighten($checked_bg_color, 8%) !important;}
-+      background-color: $card_checked_bg_color !important;
-+      &:focus,&:hover { background-color: lighten($card_checked_bg_color, 8%) !important;}
-     }
-    &:active { background-color: $active_bg_color !important;}
-+    &:active { background-color: $card_active_bg_color !important;}
-   }
- 
-   .popup-menu-section {
 diff --git a/data/theme/gnome-shell-sass/widgets/_quick-settings.scss b/data/theme/gnome-shell-sass/widgets/_quick-settings.scss
-index b429a2dc5..858f286a2 100644
+index 82a5e11aa..681d73e33 100644
 --- a/data/theme/gnome-shell-sass/widgets/_quick-settings.scss
 +++ b/data/theme/gnome-shell-sass/widgets/_quick-settings.scss
-@@ -81,9 +81,12 @@
-       icon-size: $base_icon_size*1.5; // a non-standard symbolic size but ok
-       border-radius: 999px;
-       padding: 1.5 * $base_padding;
-      background-color: lighten($bg_color, 10%);
-+      background-color: $card_bg_color;
+@@ -108,15 +108,10 @@
+     padding-bottom: 2 * $base_padding;
 
-      &.active { background-color: $selected_bg_color; }
-+      &.active {
-+        color: $selected_fg_color;
-+        background-color: $selected_bg_color;
-+      }
+     & .icon {
+-      icon-size: $base_icon_size*1.5; // a non-standard symbolic size but ok
+-      border-radius: 999px;
+-      padding: 1.5 * $base_padding;
+-      background-color: transparentize($fg_color, 0.8);
+-
+-      &.active {
+-        background-color: $selected_bg_color;
+-        color: $selected_fg_color;
+-      }
+      icon-size: $base_icon_size * 1.5;
+      padding: $base_padding;
+      background-color: $bg_color;
+      color: $fg_color;
     }
 
     & .title {
--- a/modules/gnome/theme.nix
+++ b/modules/gnome/theme.nix
@ -9,9 +9,12 @@ let
 in pkgs.stdenv.mkDerivation {
  name = "stylix-gnome-shell-theme";

-  src = pkgs.fetchurl {
-    url = "mirror://gnome/sources/gnome-shell/43/gnome-shell-43.2.tar.xz";
-    sha256 = "52/UvpNCQQ7p+9zday2Bxv8GDnyMxaDxyuanq6JdGGA=";
+  src = pkgs.fetchFromGitLab {
+    domain = "gitlab.gnome.org";
+    owner = "GNOME";
+    repo = "gnome-shell";
+    rev = "beb77f58243265a6cc62b720a5b0ecd66efd50a1";
+    sha256 = "7BKvv4j4YbfjXwCUeT7lZmXNljFhwoXO/Z9pqB091w0=";
  };

  patches = [ ./shell_colors.patch ];