From 132c51f046dbc9535dac474745ce6e3bfda83bea Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Daniel=20Ruiz=20de=20Alegr=C3=ADa?= Date: Thu, 21 Apr 2022 10:34:14 +0200 Subject: [PATCH 1/2] Fix stylesheet for gnome 42 --- _stylesheet.scss | 109 +++++++++++++++++++------------------------ appIconIndicators.js | 2 +- 2 files changed, 48 insertions(+), 63 deletions(-) diff --git a/_stylesheet.scss b/_stylesheet.scss index df7200b54..e97a761cb 100644 --- a/_stylesheet.scss +++ b/_stylesheet.scss @@ -1,26 +1,25 @@ // From https://gitlab.gnome.org/GNOME/gnome-shell/-/blob/c17dc9c8ecba0b542aab75f13da238f7b0690031/data/theme/gnome-shell-sass/_common.scss#L28 $base_padding: 6px; $base_margin: 4px; -$base_spacing: 6px; +// border radii $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*2; // 24px + // From https://gitlab.gnome.org/GNOME/gnome-shell/-/blob/c17dc9c8ecba0b542aab75f13da238f7b0690031/data/theme/gnome-shell-sass/widgets/_dash.scss $dash_background_color: #3b3b3b; $dash_placeholder_size: 32px; -$dash_padding: $base_padding + 4px; // 10px -$dash_spacing: round($base_padding / 4); -$dash_edge_items_padding: $dash_padding - $dash_spacing; -$dash_bottom_margin: $base_margin * 4; -$dash_border_radius: $modal_radius * 1.5; +$dash_padding: $base_padding*2; // 12px + -// Stock -$dock_start_margin: $dash_bottom_margin; -$dock_side_margin: $dock_start_margin / 4; -$dock_fixed_inner_margin: $dock_side_margin; +$dash_edge_items_padding: $dash_padding - $base_padding; -// Adapted to $dock_bottom_margin +$dash_margin: $dash_padding; + +$dash_border_radius: $modal_radius + $dash_padding; @function shrink($val) { @return round($val / 4); @@ -51,12 +50,15 @@ $osd_fg_color: #eeeeec; @each $side in bottom, top, left, right { #dashtodockContainer.#{$side} { #dash { - margin: 0px; padding: 0px; + @if is_horizontal($side) { + margin: $dash_margin 0; + } @else { + margin: 0 $dash_margin; + } .dash-background { margin: 0; - margin-#{$side}: $dock_side_margin; padding: 0; } @@ -66,22 +68,29 @@ $osd_fg_color: #eeeeec; margin-bottom: 0; } @else { height: 1px; - margin: ($dash_spacing + ($dash_padding / 2)) 0; } } #dashtodockDashContainer { padding: $dash_padding; - padding-#{$side}: 0; - padding-#{opposite($side)}: 0; } .dash-item-container { + > * { + @if is_horizontal($side) { + margin: 0 2px; + &:ltr:first-child { margin-left: 0; } + &:rtl:last-child { margin-right: 0; } + } @else { + margin: 2px 0; + &:ltr:first-child { margin-top: 0; } + &:rtl:last-child { margin-bottom: 0; } + } + } + .app-well-app, .show-apps { - padding: $dash_spacing; - padding-#{$side}: $dash_padding + $dock_side_margin; - padding-#{opposite($side)}: $dash_padding; + padding: 0; } .app-well-app { @@ -98,63 +107,37 @@ $osd_fg_color: #eeeeec; background-size: contain; } } + + .app-well-app-running-dot { + margin-bottom: 2px; + } } &.shrink { #dash { + @if is_horizontal($side) { + margin: shrink_light($dash_margin) 0; + } @else { + margin: 0 shrink_light($dash_margin); + } .dash-background { - margin-#{$side}: $dock_side_margin; - padding: shrink($dash_padding); + margin: 0; + padding: 0; border-radius: shrink_light($dash_border_radius); } #dashtodockDashContainer { - padding: shrink($dash_padding); - } - - .dash-item-container { - .app-well-app, - .show-apps { - padding: shrink($dash_spacing); - padding-#{$side}: shrink($dash_padding) + $dock_side_margin; - padding-#{opposite($side)}: shrink($dash_padding); - } - } - } - - &.fixed { - #dash { - .dash-background { - margin-#{opposite($side)}: shrink($dock_fixed_inner_margin); - } - - .dash-item-container { - .app-well-app, - .show-apps { - padding-#{opposite($side)}: shrink($dash_padding + $dock_fixed_inner_margin); - } - } - } - } - } - - &.fixed { - #dash { - .dash-background { - margin-#{opposite($side)}: $dock_fixed_inner_margin; - } - - .dash-item-container { - .app-well-app, - .show-apps { - padding-#{opposite($side)}: $dash_padding + $dock_fixed_inner_margin; - } + padding: shrink_light($dash_padding); } } } } } +.dash-label { + margin: $dash_padding * 1.5; +} + @mixin padded-edge-child($chid, $side, $padding) { @if $chid == first { @if is_horizontal($side) { @@ -201,6 +184,8 @@ $osd_fg_color: #eeeeec; @each $side in bottom, top, left, right { #dashtodockContainer.extended.#{$side} { #dash { + margin: 0; + .dash-background { margin: 0; border-radius: 0; diff --git a/appIconIndicators.js b/appIconIndicators.js index fe427574d..1d638a714 100644 --- a/appIconIndicators.js +++ b/appIconIndicators.js @@ -644,7 +644,7 @@ var UnityIndicator = class DashToDock_UnityIndicator extends IndicatorBase { super(source); - this._notificationBadgeLabel = new St.Label(); + this._notificationBadgeLabel = new St.Label({ style_class: 'dash-label' }); this._notificationBadgeBin = new St.Bin({ child: this._notificationBadgeLabel, x_align: Clutter.ActorAlign.END, From 56163af868f27150a4c9bf991ac740edd8a19f4f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Daniel=20Ruiz=20de=20Alegr=C3=ADa?= Date: Tue, 3 May 2022 15:07:39 +0200 Subject: [PATCH 2/2] Rise volume and workspace-switcher osd dialogs --- _stylesheet.scss | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/_stylesheet.scss b/_stylesheet.scss index e97a761cb..e558fe316 100644 --- a/_stylesheet.scss +++ b/_stylesheet.scss @@ -340,3 +340,8 @@ $osd_fg_color: #eeeeec; background-size: contain; } } + +// Rise volume and workspace-switcher osd dialogs +.osd-window, .workspace-switcher { + margin-bottom: 128px; +}