Fixed gnome-shell 44.0 issues

install.sh

@@ -30,7 +30,9 @@ SIZE_VARIANTS=('' '-Compact')
 if [[ "$(command -v gnome-shell)" ]]; then
   gnome-shell --version
   SHELL_VERSION="$(gnome-shell --version | cut -d ' ' -f 3 | cut -d . -f -1)"
-  if [[ "${SHELL_VERSION:-}" -ge "42" ]]; then
+  if [[ "${SHELL_VERSION:-}" -ge "44" ]]; then
+    GS_VERSION="44-0"
+  elif [[ "${SHELL_VERSION:-}" -ge "42" ]]; then
     GS_VERSION="42-0"
   elif [[ "${SHELL_VERSION:-}" -ge "40" ]]; then
     GS_VERSION="40-0"
@@ -39,7 +41,7 @@ if [[ "$(command -v gnome-shell)" ]]; then
   fi
   else
     echo "'gnome-shell' not found, using styles for last gnome-shell version available."
-    GS_VERSION="42-0"
+    GS_VERSION="44-0"
 fi
 
 usage() {

src/sass/gnome-shell/_drawing.scss

@@ -92,6 +92,12 @@
     box-shadow: none !important;
   }
 
+  @if $t == checked {
+    color: on($fc);
+    background-color: $fc;
+    box-shadow: none !important;
+  }
+
   @if $t == insensitive {
     color: rgba($tc, 0.35);
     background-color: $bc;

src/sass/gnome-shell/_widgets-42-0.scss

@@ -19,7 +19,6 @@
 @import 'common/notifications';
 @import 'common/osd';
 @import 'common/overview';
-@import 'common/quick-settings';
 @import 'common/panel';
 @import 'common/popovers';
 @import 'common/screen-shield';
@@ -39,6 +38,7 @@
 @import 'widgets-42-0/osd';
 @import 'widgets-40-0/panel';
 @import 'widgets-42-0/popovers';
+@import 'widgets-42-0/quick-settings';
 @import 'widgets-40-0/search-entry';
 @import 'widgets-42-0/screenshot';
 @import 'widgets-40-0/window-picker';

src/sass/gnome-shell/_widgets-44-0.scss

@@ -0,0 +1,45 @@
+@import 'common/a11y';
+@import 'common/app-grid';
+@import 'common/base';
+@import 'common/buttons';
+@import 'common/calendar';
+@import 'common/check-box';
+@import 'common/corner-ripple';
+@import 'common/dash';
+@import 'common/dialogs';
+@import 'common/entries';
+@import 'common/hotplug';
+@import 'common/ibus-popup';
+@import 'common/keyboard';
+@import 'common/login-dialog';
+@import 'common/looking-glass';
+@import 'common/message-list';
+@import 'common/misc';
+@import 'common/network-dialog';
+@import 'common/notifications';
+@import 'common/osd';
+@import 'common/overview';
+@import 'common/panel';
+@import 'common/popovers';
+@import 'common/screen-shield';
+@import 'common/scrollbars';
+@import 'common/search-entry';
+@import 'common/search-results';
+@import 'common/slider';
+@import 'common/switcher-popup';
+@import 'common/switches';
+@import 'common/tiled-previews';
+@import 'common/workspace-switcher';
+@import 'widgets-44-0/app-grid';
+@import 'widgets-40-0/dash';
+@import 'widgets-40-0/misc';
+@import 'widgets-42-0/message-list';
+@import 'widgets-40-0/overview';
+@import 'widgets-42-0/osd';
+@import 'widgets-40-0/panel';
+@import 'widgets-42-0/popovers';
+@import 'widgets-44-0/quick-settings';
+@import 'widgets-40-0/search-entry';
+@import 'widgets-42-0/screenshot';
+@import 'widgets-40-0/window-picker';
+@import 'widgets-40-0/workspace-thumbnails';

src/sass/gnome-shell/common/_dialogs.scss

@@ -2,7 +2,7 @@
 
 %theme_dialogs {
   background-color: $popover;
-  border-radius: $modal_radius;
+  border-radius: $modal_radius + $base_padding / 2;
 
   @if $rimless == 'false' {
     border: 1px solid $window-border;

src/sass/gnome-shell/common/_notifications.scss

@@ -4,7 +4,7 @@
 .notification-banner {
   width: 34em;
   min-height: 64px;
-  margin: 2px 5px 8px;
+  margin: 12px 5px 8px;
   border-radius: $base_radius;
   color: $text-secondary;
   background-color: $popover;
@@ -17,7 +17,7 @@
     color: $text;
     background-color: $popover;
     box-shadow: 0 5px 12px rgba(0, 0, 0, 0.25);
-    margin: 2px 12px 17px;
+    margin: 12px 12px 17px;
   }
 
   &:focus {

src/sass/gnome-shell/common/_popovers.scss

@@ -52,7 +52,7 @@
       box-shadow: none;
       color: $text !important;
       background-color: $divider !important;
-      border-radius: $base_radius $base_radius 0 0;
+      border-radius: $base_radius $base_radius 0 0 !important;
 
       &:focus, &:hover, &.selected {
         color: $text !important;
@@ -87,7 +87,7 @@
     border: none;
     box-shadow: none;
     margin: 0;
-    border-radius: 0 0 $base_radius $base_radius;
+    border-radius: 0 0 $base_radius $base_radius !important;
 
     .popup-menu-item {
       margin: 0;

src/sass/gnome-shell/widgets-42-0/_quick-settings.scss

@@ -5,6 +5,10 @@
 
   .icon-button, .button {
     padding: $base_padding * 1.75;
+
+    > StIcon {
+      icon-size: $base_icon_size;
+    }
   }
 }
 
@@ -163,7 +167,10 @@
     border-radius: $base_radius;
     @extend %button;
 
-    > StIcon { -st-icon-style: symbolic; }
+    > StIcon {
+      -st-icon-style: symbolic;
+      icon-size: $base_icon_size;
+    }
   }
 
   & .power-item {

src/sass/gnome-shell/widgets-42-0/_screenshot.scss

@@ -97,7 +97,7 @@ $screenshot_ui_button_red: $error;
   background-color: transparent;
   &:hover, &:focus { background-color: lighten($osd, 10%);}
   &:active { background-color: $track;}
-  &:checked { background-color: white; color: black;}
+  &:checked { background-color: $white; color: $black;}
   &:insensitive { color: transparentize(on($osd), 0.5);}
 
   border-radius: $modal_radius - $screenshot_ui_shot_cast_spacing;
@@ -122,13 +122,13 @@ $screenshot_ui_button_red: $error;
   }
 
   .screenshot-ui-area-indicator-selection {
-    border: 2px white;
+    border: 2px solid $white;
   }
 }
 
 .screenshot-ui-area-selector-handle {
   border-radius: $circular_radius;
-  background-color: white;
+  background-color: $primary;
   box-shadow: 0 1px 3px 2px rgba(0,0,0, .2);
   width: 24px;
   height: 24px;
@@ -158,7 +158,7 @@ $screenshot_ui_button_red: $error;
 .screenshot-ui-window-selector-check {
   transition-duration: 200ms;
   color: transparent;
-  border-radius: 99px;
+  border-radius: $circular_radius;
   border-width: 12px;
   icon-size: 24px;
 }
@@ -190,7 +190,7 @@ $screenshot_ui_button_red: $error;
   &:active { background-color: rgba(0,0,0,.7);}
   &:checked {
     background-color: transparent;
-    border: 2px white;
+    border: 2px solid $white;
   }
 }
 

src/sass/gnome-shell/widgets-44-0/_app-grid.scss

@@ -0,0 +1,79 @@
+
+$app_icon_size: 96px;
+$app_icon_spacing: 6px;
+
+// app icons
+.icon-grid {
+  row-spacing: $app_icon_spacing * 2;
+  column-spacing: $app_icon_spacing * 2;
+  max-row-spacing: $app_icon_spacing * 12;
+  max-column-spacing: $app_icon_spacing * 12;
+  page-padding-top: $app_icon_spacing * 4;
+  page-padding-bottom: $app_icon_spacing * 4;
+  page-padding-left: $app_icon_spacing * 2;
+  page-padding-right: $app_icon_spacing * 2;
+}
+
+// App Grid pagination indicators
+.page-indicator {
+  padding: $base_padding $base_padding * 2 0;
+
+  .page-indicator-icon {
+    width: 10px;
+    height: 10px;
+    border-radius: 10px; // the same as height&width
+    background-color: white;
+  }
+}
+
+.apps-scroll-view {
+  padding: 0;
+}
+
+.page-navigation-hint {
+  width: 300px;
+
+  &.dnd {
+    background: rgba(255, 255, 255, 0.1);
+  }
+
+  &.next:ltr,
+  &.previous:rtl {
+    background-gradient-start: rgba(255, 255, 255, 0.05);
+    background-gradient-end: transparent;
+    background-gradient-direction: horizontal;
+    border-radius: 15px 0px 0px 15px;
+  }
+
+  &.previous:ltr,
+  &.next:rtl {
+    background-gradient-start: transparent;
+    background-gradient-end: rgba(255, 255, 255, 0.05);
+    background-gradient-direction: horizontal;
+    border-radius: 0px 15px 15px 0px;
+  }
+}
+
+.page-navigation-arrow {
+  margin: 6px;
+  padding: 18px;
+  width: 24px;
+  height: 24px;
+  border-radius: $circular-radius;
+  color: on($osd, secondary);
+
+  &:insensitive {
+    background-color: on($osd, fill);
+    color: on($osd, disabled);
+  }
+
+  &:hover {
+    background-color: on($osd, divider);
+    color: on($osd);
+  }
+
+  &:active {
+    background-color: on($osd, track);
+    color: on($osd);
+  }
+}

src/sass/gnome-shell/widgets-44-0/_quick-settings.scss

@@ -0,0 +1,264 @@
+.quick-settings {
+  padding: $base_padding * 3 !important;
+  border-radius: $base_radius + $base_padding * 3 !important;
+  margin-top: $base_padding !important;
+
+  .icon-button, .button {
+    padding: $base_padding * 1.75;
+
+    > StIcon {
+      icon-size: $base_icon_size;
+    }
+  }
+}
+
+.quick-settings-grid {
+  spacing-rows: $base_padding * 2;
+  spacing-columns: $base_padding * 2;
+}
+
+.quick-toggle, .quick-menu-toggle {
+  border-radius: $base_radius;
+  min-width: 12em;
+  max-width: 12em;
+  min-height: 44px;
+  border: none;
+}
+
+.quick-toggle {
+  background-color: $button !important;
+
+  &:hover {
+    background-color: $divider !important;
+  }
+
+  &:active {
+    background-color: rgba($text, 0.15) !important;
+  }
+
+  &:checked {
+    background-color: $primary !important;
+    color: on($primary);
+
+    &:hover {
+      background-color: mix($text, $primary, 6%) !important;
+      color: on($primary);
+    }
+
+    &:active {
+      background-color: mix($text, $primary, 15%) !important;
+      color: on($primary);
+    }
+  }
+
+  & > StBoxLayout { spacing: $base_padding; }
+
+  /* Move padding into the box; this is to allow menu arrows
+     to extend to the border */
+  &.button { padding: 0; }
+  & > StBoxLayout { padding: 0 $base_padding * 2; }
+  &:ltr > StBoxLayout { padding-left: $base_padding * 2.5; }
+  &:rtl > StBoxLayout { padding-right: $base_padding * 2.5; }
+
+  .quick-toggle-title { font-weight: bold; }
+
+  & StBoxLayout > .quick-toggle-subtitle {
+    font-weight: normal;
+    font-size: 12px;
+  }
+
+  .quick-toggle-icon { icon-size: $base_icon_size; }
+}
+
+.quick-menu-toggle {
+  & .quick-toggle {
+    min-width: auto;
+    max-width: auto;
+
+    &:ltr { border-radius: $base_radius 0 0 $base_radius; }
+    &:ltr > StBoxLayout { padding-right: $base_padding * 1.5; }
+    &:rtl { border-radius: 0 $base_radius $base_radius 0; }
+    &:rtr > StBoxLayout { padding-left: $base_padding * 1.5; }
+
+    &:ltr:last-child { border-radius: $base_radius; }
+    &:rtl:last-child { border-radius: $base_radius; }
+  }
+
+  .quick-toggle-arrow {
+    background-color: $button !important;
+    padding: $base_padding $base_padding * 1.75;
+    border: none !important;
+
+    &:hover {
+      background-color: $divider !important;
+    }
+  
+    &:active {
+      background-color: rgba($text, 0.15) !important;
+    }
+  
+    &:checked {
+      background-color: $primary !important;
+      color: on($primary);
+  
+      &:hover {
+        background-color: mix($text, $primary, 6%) !important;
+        color: on($primary);
+      }
+  
+      &:active {
+        background-color: mix($text, $primary, 15%) !important;
+        color: on($primary);
+      }
+    }
+
+    &:ltr { border-radius: 0 $base_radius $base_radius 0; }
+    &:rtl { border-radius: $base_radius 0 0 $base_radius; }
+  }
+}
+
+.quick-slider {
+  & > StBoxLayout { spacing: $base_padding; }
+
+  .slider-bin {
+    &:focus { @include button(focus); }
+    min-height: 16px; // slider size
+    padding: $base_padding;
+    border-radius: $circular_radius;
+  }
+
+  .quick-toggle-icon {
+    icon-size: $base_icon_size;
+  }
+
+  .icon-button {
+    background-color: transparent;
+    color: $text !important;
+    padding: $base_padding;
+
+    &:hover {
+      background-color: $fill;
+    }
+
+    &:active {
+      background-color: $divider;
+    }
+  }
+}
+
+.quick-toggle-menu {
+  background-color: $popover !important;
+  color: $text !important;
+  border-radius: $base_radius + $base_padding * 2 !important;
+  padding: $base_padding * 2;
+  margin: $base_padding * 2 $base_padding * 3 0;
+
+  .popup-menu-item {
+    border-radius: $base_radius !important;
+
+    &:focus, &:hover, &.selected {
+      color: $text !important;
+      background-color: rgba($text, 0.1) !important;
+    }
+
+    &:active {
+      color: $text !important;
+      background-color: rgba($text, 0.2) !important;
+    }
+
+    > StIcon { -st-icon-style: symbolic; }
+  }
+
+  & .header {
+    spacing-rows: 0.5 * $base_padding;
+    spacing-columns: $base_padding * 2;
+    padding-bottom: 2 * $base_padding;
+
+    & .icon {
+      icon-size: $base_icon_size * 1.5; // a non-standard symbolic size but ok
+      border-radius: $base_radius;
+      padding: 1.5 * $base_padding;
+      background-color: on($popover, divider) !important;
+
+      &.active {
+        background-color: $primary !important;
+        color: on($primary);
+      }
+    }
+
+    & .title {
+      @extend %title_3;
+    }
+
+    & .subtitle {
+      @extend %caption_heading;
+    }
+  }
+}
+
+.quick-settings-system-item {
+  & > StBoxLayout { spacing: 2 * $base_padding; }
+
+  .icon-button {
+    background-color: $button;
+    color: $text;
+    border-radius: $base_radius;
+    @extend %button;
+
+    > StIcon {
+      -st-icon-style: symbolic;
+      icon-size: $base_icon_size;
+    }
+  }
+
+  & .power-item {
+    min-height: 0;
+    min-width: 0;
+
+    &:insensitive {
+      @include button(normal);
+      background-color: transparent;
+    }
+  }
+}
+
+.nm-network-item {
+  .wireless-secure-icon { icon-size: 0.5 * $base_icon_size; }
+}
+
+.bt-device-item {
+  .popup-menu-icon { -st-icon-style: symbolic; }
+}
+
+.bt-menu-placeholder.popup-menu-item {
+  @extend %title_4;
+  text-align: center;
+
+  padding: 2em 4em;
+}
+
+.device-subtitle { color: $text-disabled; }
+
+// background apps
+
+.background-apps-quick-toggle {
+  min-height: 40px;
+  background-color: transparent;
+
+  & StIcon { icon-size: $base_icon_size !important; }
+}
+
+.background-app-item {
+  & .title { @extend %heading; }
+  & .subtitle { @extend %caption; }
+  & .popup-menu-icon {
+    icon-size: $base_icon_size * 2 !important;
+    -st-icon-style: regular !important;
+  }
+  & .close-button {
+    @extend .icon-button;
+    padding: $base_padding;
+  }
+
+  &.popup-inactive-menu-item { color: $text; }
+}