Add GDM theme scaling 200% support

lib-install.sh

@@ -842,6 +842,11 @@ customize_theme() {
     prompt -s "Changing Definition mode to HD (Bigger font, Bigger size) ... \n"
     #FIXME: @vince is it not implemented yet? (Only Gnome-shell and Gtk theme finished!)
   fi
+
+  if [[ "${scale}" == 'x2' ]]; then
+    prompt -s "Changing GDM scaling to 200% ... \n"
+    sed $SED_OPT "/\$scale/s/default/x2/"                                       "${THEME_SRC_DIR}/sass/_theme-options-temp.scss"
+  fi
 }
 
 #-----------------------------------DIALOGS------------------------------------#

src/sass/_theme-options.scss

@@ -28,3 +28,6 @@ $panel_size: 'default';
 
 // Monterey style
 $monterey: 'false';
+
+// GDM login dialog scale
+$scale: 'default';

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

@@ -2,7 +2,7 @@
 
 StEntry, %entry {
   min-height: $menuitem_size;
-  padding: 2px 10px !important;
+  padding: $base_padding / 2 $base_padding * 2 !important;
   // margin: 2px;
   color: $fg_color;
   caret-color: $fg_color;
@@ -20,10 +20,10 @@ StEntry, %entry {
   }
   StIcon.peek-password {
     icon-size: 16px;
-    padding: 0 4px;
+    padding: 0 $base_padding;
   }
   StLabel.hint-text {
-    margin-left: 2px;
+    margin-left: $base_padding / 2;
     color: $alt_fg_color;
   }
 }

src/sass/gnome-shell/common/_login-dialog.scss

@@ -4,16 +4,304 @@
   background-color: rgba($osd_bg_color, 1);
   background-image: url("assets/background.png");
   background-size: cover;
+
+  @if $scale != 'default' {
+    .user-icon {
+      icon-size: $base_icon_size * 8;
+
+      & StIcon {
+        padding: $base_padding * 4;
+        width: $base_icon_size * 5;
+        height:  $base_icon_size * 5;
+      }
+
+      &.user-avatar {
+        border: 4px solid $osd_fg_color;
+      }
+    }
+  }
 }
 
 .login-dialog-banner-view {
-  padding-top: 24px;
+  @if $scale == 'default' {
-  max-width: 23em;
+    padding-top: 24px;
+    max-width: 23em;
+  } @else {
+    padding-top: 48px;
+    max-width: 46em;
+  }
+}
+
+.unlock-dialog {
+  .user-icon {
+    icon-size: $base_icon_size * 4 !important;
+
+    & StIcon {
+      padding: $base_padding * 2 !important;
+      width: $base_icon_size * 2.5 !important;
+      height:  $base_icon_size * 2.5 !important;
+    }
+
+    &.user-avatar {
+      border: 2px solid $osd_fg_color !important;
+    }
+  }
+
+  StEntry {
+    @include fontsize($base_font_size - 1);
+    padding: 0 $base_padding * 2 !important;
+
+    StIcon.peek-password {
+      padding: 0 $base_padding !important;
+    }
+
+    StLabel.hint-text {
+      margin-left: $base_padding / 2 !important;
+    }
+  }
+
+  .modal-dialog-button-box {
+    spacing: $container_padding / 2 !important;
+  }
+
+  .modal-dialog-button {
+    padding: 2px $container_padding * 2 !important;
+  }
+
+  .cancel-button,
+  .switch-user-button,
+  .login-dialog-session-list-button {
+    width: 32px !important;
+    height: 32px !important;
+    padding: 0 !important;
+
+    StIcon {
+      icon-size: 16px !important;
+    }
+  }
+
+  .login-dialog-logo-bin { padding: $container_padding * 4 0; }
+  .login-dialog-button-box { spacing: $container_padding; }
+  .login-dialog-message-hint { padding-top: 0; padding-bottom: $container_padding * 3; }
+  .login-dialog-user-selection-box { padding: 100px 0px; }
+
+  .login-dialog-not-listed-label {
+    padding-left: 2px;
+  }
+
+  .login-dialog-not-listed-label {
+    font-size: 1em;
+    padding-top: 1em;
+  }
+
+  .login-dialog-user-list-view { -st-vfade-offset: 1em; }
+  .login-dialog-user-list {
+    spacing: $container_padding * 2;
+    padding: .2em;
+    width: 23em;
+
+    &:expanded .login-dialog-user-list-item:logged-in { border-right: 2px solid $selected_bg_color; }
+  }
+
+  .login-dialog-user-list-item {
+    border-radius: $mn_radius;
+    padding: $container_padding;
+
+    &:ltr .user-widget { padding-right: 1em; }
+    &:rtl .user-widget { padding-left: 1em; }
+
+    .login-dialog-timed-login-indicator {
+      height: 2px;
+      margin: $container_padding 0 0 0;
+      background-color: $visit_color !important;
+    }
+  }
+
+  .user-widget.horizontal .user-widget-label {
+    @include fontsize($base_font_size + 2);
+    padding-left: $container_padding * 2;
+
+    &:ltr { padding-left: $container_padding * 2; text-align: left; }
+    &:rtl { padding-right: $container_padding * 2; text-align: right; }
+  }
+
+  .user-widget.vertical .user-widget-label {
+    @include fontsize($base_font_size + 5);
+    padding-top: $container_padding * 3;
+  }
+
+  .login-dialog-prompt-layout {
+    padding-top: $container_padding * 4,;
+    padding-bottom: $container_padding * 2;
+    spacing: $base_spacing * 2;
+    width: 23em;
+  }
+
+  .login-dialog-prompt-entry {
+    height: 1.5em;
+  }
+
+  .login-dialog-prompt-label {
+    @include fontsize($base_font_size + 1);
+    padding-top: 1em;
+  }
+}
+
+.login-dialog {
+  StEntry {
+    @if $scale != 'default' {
+      @include fontsize($base_font_size + 3);
+      padding: 0 $base_padding * 4 !important;
+
+      StIcon.peek-password {
+        padding: 0 $base_padding * 2 !important;
+      }
+
+      StLabel.hint-text {
+        margin-left: $base_padding !important;
+      }
+    }
+
+    StIcon {
+      icon-size: if($scale == 'default', 16px, 32px);
+      padding: 0;
+      margin: 0;
+    }
+  }
+
+  .modal-dialog-button-box {
+    @if $scale == 'default' {
+      spacing: $container_padding / 2;
+    } @else {
+      spacing: $container_padding;
+    }
+  }
+
+  .modal-dialog-button {
+    @if $scale == 'default' {
+      padding: 2px $container_padding * 2;
+    } @else {
+      padding: 4px $container_padding * 4;
+    }
+  }
+
+  .cancel-button,
+  .switch-user-button,
+  .login-dialog-session-list-button {
+    @if $scale == 'default' {
+      width: 32px;
+      height: 32px;
+    } @else {
+      width: 64px;
+      height: 64px;
+    }
+
+    StIcon {
+      icon-size: if($scale == 'default', 16px, 32px);
+    }
+  }
+
+  @if $scale == 'default' {
+    .login-dialog-logo-bin { padding: $container_padding * 4 0; }
+    .login-dialog-button-box { spacing: $container_padding; }
+    .login-dialog-message-hint { padding-top: 0; padding-bottom: $container_padding * 3; }
+    .login-dialog-user-selection-box { padding: 100px 0px; }
+  } @else {
+    .login-dialog-logo-bin { padding: $container_padding * 8 0; }
+    .login-dialog-button-box { spacing: $container_padding * 2; }
+    .login-dialog-message-hint { padding-top: 0; padding-bottom: $container_padding * 6; }
+    .login-dialog-user-selection-box { padding: 200px 0px; }
+  }
+
+  .login-dialog-not-listed-label {
+    padding-left: 4px;
+  }
+
+  .login-dialog-not-listed-label {
+    @if $scale == 'default' {
+      font-size: 1em;
+      padding-top: 1em;
+    } @else {
+      font-size: 2em;
+      padding-top: 2em;
+    }
+  }
+
+  .login-dialog-user-list-view { -st-vfade-offset: if($scale == 'default', 1em, 2em); }
+  .login-dialog-user-list {
+    @if $scale == 'default' {
+      spacing: $container_padding * 2;
+      padding: .2em;
+      width: 23em;
+    } @else {
+      spacing: $container_padding * 4;
+      padding: .4em;
+      width: 46em;
+    }
+    &:expanded .login-dialog-user-list-item:logged-in { border-right: if($scale == 'default', 2px, 4px) solid $selected_bg_color; }
+  }
+
+  .login-dialog-user-list-item {
+    border-radius: if($scale == 'default', $mn_radius, $mn_radius * 2);
+    padding: if($scale == 'default', $container_padding, $container_padding * 2);
+
+    &:ltr .user-widget { padding-right: if($scale == 'default', 1em, 2em); }
+    &:rtl .user-widget { padding-left: if($scale == 'default', 1em, 2em); }
+
+    .login-dialog-timed-login-indicator {
+      height: if($scale == 'default', 2px, 4px);
+      margin: if($scale == 'default', $container_padding, $container_padding * 2) 0 0 0;
+    }
+  }
+
+  .user-widget.horizontal .user-widget-label {
+    @if $scale == 'default' {
+      @include fontsize($base_font_size + 2);
+    } @else {
+      @include fontsize($base_font_size * 2 + 4);
+    }
+
+    padding-left: if($scale == 'default', $container_padding * 2, $container_padding * 4);
+
+    &:ltr { padding-left: if($scale == 'default', $container_padding * 2, $container_padding * 4); text-align: left; }
+    &:rtl { padding-right: if($scale == 'default', $container_padding * 2, $container_padding * 4); text-align: right; }
+  }
+
+  .user-widget.vertical .user-widget-label {
+    @if $scale == 'default' {
+      @include fontsize($base_font_size + 5);
+    } @else {
+      @include fontsize($base_font_size * 2 + 10);
+    }
+
+    padding-top: if($scale == 'default', $base_padding * 2.5, $base_padding * 5);
+    padding-bottom: if($scale == 'default', $base_padding * 3.5, $base_padding * 7);
+  }
+
+  .login-dialog-prompt-layout {
+    padding-top: if($scale == 'default', $container_padding * 4, $container_padding * 8);
+    padding-bottom: if($scale == 'default', $container_padding * 2, $container_padding * 4);
+    spacing: if($scale == 'default', $base_spacing * 2, $base_spacing * 4);
+    width: if($scale == 'default', 23em, 46em);
+  }
+
+  .login-dialog-prompt-entry {
+    height: if($scale == 'default', 1.5em, 3em);
+  }
+
+  .login-dialog-prompt-label {
+    @if $scale == 'default' {
+      @include fontsize($base_font_size + 1);
+    } @else {
+      @include fontsize($base_font_size * 2 + 2);
+    }
+
+    padding-top: if($scale == 'default', 1em, 2em);
+  }
 }
 
 .login-dialog,
 .unlock-dialog {
-  //reset
   border: none;
   background-color: transparent;
 
@@ -21,8 +309,6 @@
     selection-background-color: $primary_color;
     selected-background-color: $primary_color;
     selected-color: white;
-    padding: 4px 8px;
-    min-height: $small_size;
     border-radius: $circular_radius;
     caret-color: $light_fg_color;
 
@@ -35,10 +321,7 @@
     }
   }
 
-  .modal-dialog-button-box { spacing: 3px; }
-
   .modal-dialog-button {
-    padding: 0 16px;
     border: none;
     @include button(flat-normal, $tc: $light_fg_color);
     &:hover, &:focus { @include button(flat-hover, $tc: $light_fg_color); }
@@ -56,31 +339,22 @@
   .cancel-button,
   .switch-user-button,
   .login-dialog-session-list-button {
-    padding: 0;
+    padding: 0 !important;
-    border-radius: 100px;
+    border-radius: $circular_radius;
-    width: 32px;
-    height: 32px;
     border: none;
     background-color: rgba($borders_color, 0.1);
     color: $light_fg_color;
-
-    StIcon { icon-size: 16px; }
-  }
-
-  .login-dialog-message-warning {
-    color: $light_alt_fg_color;
   }
 }
 
-.login-dialog-logo-bin { padding: 24px 0px; }
+.login-dialog-message-warning {
+  color: $light_alt_fg_color;
+}
+
 .login-dialog-banner { color: $light_alt_fg_color; }
-.login-dialog-button-box { spacing: 5px; }
 .login-dialog-message { text-align: center; }
 .login-dialog-message-warning { color: $warning_color; }
-.login-dialog-message-hint { padding-top: 0; padding-bottom: 20px; }
-.login-dialog-user-selection-box { padding: 100px 0px; }
 .login-dialog-not-listed-label {
-  padding-left: 2px;
   .login-dialog-not-listed-button:focus &,
   .login-dialog-not-listed-button:hover & {
     color: $light_fg_color;
@@ -88,39 +362,23 @@
 }
 
 .login-dialog-not-listed-label {
-  font-size: 1em;
+  font-weight: normal;
-  font-weight: bold;
   color: $light_alt_fg_color;
-  padding-top: 1em;
   &:hover { color: $light_alt_fg_color; }
   &:focus { background-color: $light_divider_color; }
 }
 
-.login-dialog-user-list-view { -st-vfade-offset: 1em; }
 .login-dialog-user-list {
-  spacing: 12px;
-  padding: .2em;
-  width: 23em;
   &:expanded .login-dialog-user-list-item:selected { background-color: $light_divider_color; color: $light_alt_fg_color; }
   &:expanded .login-dialog-user-list-item:hover { background-color: $light_divider_color; color: $light_alt_fg_color; }
   &:expanded .login-dialog-user-list-item:active { background-color: $light_track_color; color: $light_alt_fg_color; }
-  &:expanded .login-dialog-user-list-item:logged-in { border-right: 2px solid $selected_bg_color; }
 }
 
 .login-dialog-user-list-item {
-  border-radius: $mn_radius;
-  padding: 6px;
   color: $light_alt_fg_color;
 
-  &:ltr .user-widget { padding-right: 1em; }
-  &:rtl .user-widget { padding-left: 1em; }
-
   &:focus {
     background-color: if($variant == 'light', rgba(black, 0.05), rgba(white, 0.03)) !important;
-
-    // .login-dialog-timed-login-indicator {
-    //   background-color: $track_color;
-    // }
   }
 
   &:hover, &:focus:hover {
@@ -134,8 +392,6 @@
   }
 
   .login-dialog-timed-login-indicator {
-    height: 2px;
-    margin: 6px 0 0 0;
     background-color: $visit_color !important;
   }
 }
@@ -145,34 +401,14 @@
 }
 
 .user-widget.horizontal .user-widget-label {
-  @include fontsize($base_font_size + 2);
+  font-weight: normal;
-  font-weight: bold;
-  padding-left: 15px;
-
-  &:ltr { padding-left: 14px; text-align: left; }
-  &:rtl { padding-right: 14px; text-align: right; }
 }
 
 .user-widget.vertical .user-widget-label {
-  @include fontsize($base_font_size + 5);
   text-align: center;
   font-weight: normal;
-  padding-top: 16px;
-}
-
-.login-dialog-prompt-layout {
-  padding-top: 24px;
-  padding-bottom: 12px;
-  spacing: $base_spacing * 2;
-  width: 23em;
-}
-
-.login-dialog-prompt-entry {
-  height: 1.5em;
 }
 
 .login-dialog-prompt-label {
   color: $light_hint_fg_color;
-  @include fontsize($base_font_size + 1);
-  padding-top: 1em;
 }

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

@@ -21,12 +21,12 @@
   & StIcon {
     background-color: transparentize($light_alt_fg_color, 0.95);
     border-radius: $circular_radius;
-    padding: $base_padding * 2 ; // 12px
+    padding: $base_padding * 2; // 12px
     width: $base_icon_size * 2.5; height:  $base_icon_size * 2.5; // 40px;
   }
 
   &.user-avatar {
-    border: 2px $osd_fg_color;
+    border: 2px solid $osd_fg_color;
   }
 }
 

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

@@ -11,15 +11,54 @@ $panel_height: $menuitem_size;
   $panel_height: $menuitem_size + 4px;
 }
 
+#panel.login-screen {
+  @if $scale != 'default' {
+    @include fontsize($base_font_size * 2 - 2);
+    height: $panel_height * 2 !important;
+    box-shadow: 0 10px 32px rgba(black, 0.05) !important;
+
+    .panel-button {
+      -natural-hpadding: $container_padding * 2 + 4px !important;
+      -minimum-hpadding: $container_padding * 2 + 4px !important;
+      border-radius: $bt_radius * 2 !important;
+
+      &.clock-display {
+        StLabel { padding: 0 $base_padding * 2 !important; }
+
+        .clock {
+          border-radius: $bt_radius * 2 !important;
+          padding: 0 $base_padding * 6 !important;
+          spacing: $base_padding * 2 !important;
+        }
+      }
+
+      // status area icons
+      .system-status-icon {
+        icon-size: $base_icon_size * 2 !important;
+        padding: $base_padding * 2 !important;
+        margin: 0 $base_padding * 2 !important;
+      }
+
+      .panel-status-menu-box StLabel { padding: 0 0 0 $base_padding !important; }
+
+      .appindicator-trayicons-box { margin: 0 $base_padding * 2 !important; }
+
+      StIcon {
+        icon-size: 32px !important;
+      }
+    }
+  }
+}
+
 #panel {
   background-color: $panel_bg;
   font-weight: normal;
-  height: $panel_height !important;
-  box-shadow: 0 5px 16px rgba(black, 0.05);
   color: $panel_fg;
   font-feature-settings: "tnum";
   transition-duration: 250ms;
   @include font(body-1);
+  height: $panel_height !important;
+  box-shadow: 0 5px 16px rgba(black, 0.05);
 
   // the rounded outset corners
   .panel-corner {
@@ -33,8 +72,8 @@ $panel_height: $menuitem_size;
 
   // panel menus
   .panel-button {
-    -natural-hpadding: 8px;
+    -natural-hpadding: $container_padding + 2px;
-    -minimum-hpadding: 8px;
+    -minimum-hpadding: $container_padding + 2px;
     font-weight: normal;
     color: $panel_fg;
     transition-duration: 150ms;

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

@@ -14,6 +14,54 @@ $popop_menuitem_radius: $wm_radius - 4px;
   background: transparent; // needs to reset?
 }
 
+@if $scale != 'default' {
+  #lockDialogGroup .popup-menu,
+  .login-screen .popup-menu { // FIXME: not use? how to set the popovers on login-screen?
+    min-width: 24em;
+    @include fontsize($base_font_size * 2 - 2);
+
+    .popup-menu-content {
+      padding: 12px 0 !important;
+      box-shadow: 0 10px 20px 0 rgba(black, 0.18);
+      border: 2px solid if($variant=='light', rgba(black, 0), rgba(black, 0.75));
+      margin: 8px 24px 34px 24px !important;
+      @include fontsize($base_font_size * 2 - 2);
+    }
+
+    .popup-menu-item {
+      spacing: $base_spacing * 4;
+      padding-top: 12px !important;
+      padding-bottom: 12px !important;
+      border-radius: $popop_menuitem_radius * 2;
+      margin: 0 12px;
+
+      &:ltr { padding-right: 4em !important; padding-left: 0 !important; }
+      &:rtl { padding-right: 0 !important; padding-left: 4em !important; }
+
+      &:checked {
+        border-radius: $popop_menuitem_radius * 2 $popop_menuitem_radius * 2 0 0;
+      }
+    }
+
+    .popup-sub-menu {
+      border-radius: 0 0 $popop_menuitem_radius * 2 $popop_menuitem_radius * 2;
+      margin: 0 6px;
+
+      .popup-menu-item {
+        border-radius: $popop_menuitem_radius * 2;
+      }
+    }
+
+    &.panel-menu {
+      -boxpointer-gap: $base_margin * 2; // distance from the panel
+      margin-bottom: 3.5em;
+    }
+  }
+  // symbolic icons in popover
+  .popup-menu-arrow,
+  .popup-menu-icon { icon-size: $base_icon_size * 2; }
+}
+
 // container of the popover menu
 .popup-menu {
   min-width: 12em;

tweaks.sh

@@ -27,7 +27,7 @@ usage() {
   helpify "-e, --edit-firefox"  ""                                                  "Edit '${THEME_NAME}' theme for Firefox settings and also connect the theme to the current Firefox profiles" ""
   helpify "-F, --flatpak"       ""                                                  "Connect '${THEME_NAME}' theme to Flatpak"                                    ""
   helpify "-s, --snap"          ""                                                  "Connect '${THEME_NAME}' theme the currently installed snap apps"             ""
-  helpify "-g, --gdm"           ""                                                  "Install '${THEME_NAME}' theme for GDM"                                       "Requires to run this shell as root"
+  helpify "-g, --gdm"           "[default|x2]"                                      "Install '${THEME_NAME}' theme for GDM (scaling: 100%/200%, default is 100%)" "Requires to run this shell as root"
   helpify "-d, --dash-to-dock"  ""                                                  "Install '${THEME_NAME}' theme for Dash to Dock when Gnome < 40 or install fixed version on Gnome > 40" ""
   helpify "-N, --no-darken"     ""                                                  "Don't darken '${THEME_NAME}' GDM theme background image"                     ""
   helpify "-n, --no-blur"       ""                                                  "Don't blur '${THEME_NAME}' GDM theme background image"                       ""
@@ -120,6 +120,18 @@ while [[ $# -gt 0 ]]; do
       showapps_normal="true" # use normal showapps icon
       background="default"
 
+      for variant in "${@}"; do
+        case "${variant}" in
+          default)
+            shift 1
+            ;;
+          x2)
+            scale="x2"
+            shift 1
+            ;;
+        esac
+      done
+
       if ! has_command gdm && ! has_command gdm3 && [[ ! -e /usr/sbin/gdm3 ]]; then
         prompt -e "'${1}' ERROR: There's no GDM installed in your system"
         has_any_error="true"