From 4f27a6e52056bf1f486b49c2909c94c612c38f75 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Florian=20M=C3=BCllner?= Date: Wed, 2 Feb 2022 23:19:12 +0100 Subject: [PATCH] panel: Remove panel corners MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit They were a cute gimmick for a decade, now it's time to say goodbye ... 😢️ https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/5010 Part-of: --- data/theme/gnome-shell-high-contrast.scss | 4 - .../gnome-shell-sass/widgets/_panel.scss | 17 +- js/ui/panel.js | 215 +----------------- 3 files changed, 3 insertions(+), 233 deletions(-) diff --git a/data/theme/gnome-shell-high-contrast.scss b/data/theme/gnome-shell-high-contrast.scss index 2f7f9da3f..55745f1ac 100644 --- a/data/theme/gnome-shell-high-contrast.scss +++ b/data/theme/gnome-shell-high-contrast.scss @@ -22,10 +22,6 @@ stage { &.unlock-screen, &:overview { background-color: #000; - - .panel-corner { - -panel-corner-opacity: 1; - } } .panel-button { diff --git a/data/theme/gnome-shell-sass/widgets/_panel.scss b/data/theme/gnome-shell-sass/widgets/_panel.scss index ad63e24ba..7e577e828 100644 --- a/data/theme/gnome-shell-sass/widgets/_panel.scss +++ b/data/theme/gnome-shell-sass/widgets/_panel.scss @@ -1,7 +1,6 @@ /* Top Bar */ // a.k.a. the panel -$panel_corner_radius: $base_border_radius+1; $panel_bg_color: #000; $panel_fg_color: if($variant == 'light', lighten($bg_color, 10%), darken($fg_color, 5%)); $panel_height: 2.2em; @@ -19,20 +18,6 @@ $panel_transition_duration: 250ms; // same as the overview transition duration &.login-screen, &:overview { background-color: transparent; - - .panel-corner { - -panel-corner-opacity: 0; - } - } - - // the rounded outset corners - .panel-corner { - -panel-corner-radius: $panel_corner_radius; - -panel-corner-background-color: $panel_bg_color; - -panel-corner-border-width: 2px; - -panel-corner-border-color: transparent; - -panel-corner-opacity: 1; - transition-duration: $panel_transition_duration; } // panel menus @@ -184,4 +169,4 @@ $panel_transition_duration: 250ms; // same as the overview transition duration padding-left: $base_padding * 2; padding-right: $base_padding * 2; } -} \ No newline at end of file +} diff --git a/js/ui/panel.js b/js/ui/panel.js index 5e9e44660..153094643 100644 --- a/js/ui/panel.js +++ b/js/ui/panel.js @@ -2,7 +2,6 @@ /* exported Panel */ const { Atk, Clutter, GLib, GObject, Meta, Shell, St } = imports.gi; -const Cairo = imports.cairo; const Animation = imports.ui.animation; const { AppMenu } = imports.ui.appMenu; @@ -344,170 +343,6 @@ class ActivitiesButton extends PanelMenu.Button { } }); -var PanelCorner = GObject.registerClass( -class PanelCorner extends St.DrawingArea { - _init(side) { - this._side = side; - - super._init({ style_class: 'panel-corner' }); - } - - _findRightmostButton(container) { - if (!container.get_children) - return null; - - let children = container.get_children(); - - if (!children || children.length == 0) - return null; - - // Start at the back and work backward - let index; - for (index = children.length - 1; index >= 0; index--) { - if (children[index].visible) - break; - } - if (index < 0) - return null; - - if (!(children[index] instanceof St.Widget)) - return null; - - if (!children[index].has_style_class_name('panel-menu') && - !children[index].has_style_class_name('panel-button')) - return this._findRightmostButton(children[index]); - - return children[index]; - } - - _findLeftmostButton(container) { - if (!container.get_children) - return null; - - let children = container.get_children(); - - if (!children || children.length == 0) - return null; - - // Start at the front and work forward - let index; - for (index = 0; index < children.length; index++) { - if (children[index].visible) - break; - } - if (index == children.length) - return null; - - if (!(children[index] instanceof St.Widget)) - return null; - - if (!children[index].has_style_class_name('panel-menu') && - !children[index].has_style_class_name('panel-button')) - return this._findLeftmostButton(children[index]); - - return children[index]; - } - - setStyleParent(box) { - let side = this._side; - - let rtlAwareContainer = box instanceof St.BoxLayout; - if (rtlAwareContainer && - box.get_text_direction() == Clutter.TextDirection.RTL) { - if (this._side == St.Side.LEFT) - side = St.Side.RIGHT; - else if (this._side == St.Side.RIGHT) - side = St.Side.LEFT; - } - - let button; - if (side == St.Side.LEFT) - button = this._findLeftmostButton(box); - else if (side == St.Side.RIGHT) - button = this._findRightmostButton(box); - - if (button) { - if (this._button) { - if (this._buttonStyleChangedSignalId) { - this._button.disconnect(this._buttonStyleChangedSignalId); - this._button.style = null; - } - - if (this._buttonDestroySignalId) - this._button.disconnect(this._buttonDestroySignalId); - } - - this._button = button; - - this._buttonDestroySignalId = button.connect('destroy', () => { - if (this._button == button) { - this._button = null; - this._buttonStyleChangedSignalId = 0; - } - }); - - // Synchronize the locate button's pseudo classes with this corner - this._buttonStyleChangedSignalId = button.connect('style-changed', - () => { - let pseudoClass = button.get_style_pseudo_class(); - this.set_style_pseudo_class(pseudoClass); - }); - } - } - - vfunc_repaint() { - let node = this.get_theme_node(); - - let cornerRadius = node.get_length("-panel-corner-radius"); - let borderWidth = node.get_length('-panel-corner-border-width'); - - let backgroundColor = node.get_color('-panel-corner-background-color'); - - let cr = this.get_context(); - cr.setOperator(Cairo.Operator.SOURCE); - - cr.moveTo(0, 0); - if (this._side == St.Side.LEFT) { - cr.arc(cornerRadius, - borderWidth + cornerRadius, - cornerRadius, Math.PI, 3 * Math.PI / 2); - } else { - cr.arc(0, - borderWidth + cornerRadius, - cornerRadius, 3 * Math.PI / 2, 2 * Math.PI); - } - cr.lineTo(cornerRadius, 0); - cr.closePath(); - - Clutter.cairo_set_source_color(cr, backgroundColor); - cr.fill(); - - cr.$dispose(); - } - - vfunc_style_changed() { - super.vfunc_style_changed(); - let node = this.get_theme_node(); - - let cornerRadius = node.get_length("-panel-corner-radius"); - let borderWidth = node.get_length('-panel-corner-border-width'); - - const transitionDuration = - node.get_transition_duration() / St.Settings.get().slow_down_factor; - const opacity = node.get_double('-panel-corner-opacity'); - - this.set_size(cornerRadius, borderWidth + cornerRadius); - this.translation_y = -borderWidth; - - this.remove_transition('opacity'); - this.ease({ - opacity: opacity * 255, - duration: transitionDuration, - mode: Clutter.AnimationMode.EASE_IN_OUT_QUAD, - }); - } -}); - const UnsafeModeIndicator = GObject.registerClass( class UnsafeModeIndicator extends PanelMenu.SystemIndicator { _init() { @@ -656,14 +491,6 @@ class Panel extends St.Widget { this._rightBox = new St.BoxLayout({ name: 'panelRight' }); this.add_child(this._rightBox); - this._leftCorner = new PanelCorner(St.Side.LEFT); - this.bind_property('style', this._leftCorner, 'style', GObject.BindingFlags.SYNC_CREATE); - this.add_child(this._leftCorner); - - this._rightCorner = new PanelCorner(St.Side.RIGHT); - this.bind_property('style', this._rightCorner, 'style', GObject.BindingFlags.SYNC_CREATE); - this.add_child(this._rightCorner); - Main.overview.connect('showing', () => { this.add_style_pseudo_class('overview'); }); @@ -748,24 +575,6 @@ class Panel extends St.Widget { childBox.x2 = allocWidth; } this._rightBox.allocate(childBox); - - let cornerWidth, cornerHeight; - - [, cornerWidth] = this._leftCorner.get_preferred_width(-1); - [, cornerHeight] = this._leftCorner.get_preferred_height(-1); - childBox.x1 = 0; - childBox.x2 = cornerWidth; - childBox.y1 = allocHeight; - childBox.y2 = allocHeight + cornerHeight; - this._leftCorner.allocate(childBox); - - [, cornerWidth] = this._rightCorner.get_preferred_width(-1); - [, cornerHeight] = this._rightCorner.get_preferred_height(-1); - childBox.x1 = allocWidth - cornerWidth; - childBox.x2 = allocWidth; - childBox.y1 = allocHeight; - childBox.y2 = allocHeight + cornerHeight; - this._rightCorner.allocate(childBox); } _tryDragWindow(event) { @@ -880,19 +689,11 @@ class Panel extends St.Widget { Main.messageTray.bannerAlignment = Clutter.ActorAlign.CENTER; if (this._sessionStyle) - this._removeStyleClassName(this._sessionStyle); + this.remove_style_class_name(this._sessionStyle); this._sessionStyle = Main.sessionMode.panelStyle; if (this._sessionStyle) - this._addStyleClassName(this._sessionStyle); - - if (this.get_text_direction() == Clutter.TextDirection.RTL) { - this._leftCorner.setStyleParent(this._rightBox); - this._rightCorner.setStyleParent(this._leftBox); - } else { - this._leftCorner.setStyleParent(this._leftBox); - this._rightCorner.setStyleParent(this._rightBox); - } + this.add_style_class_name(this._sessionStyle); } _hideIndicators() { @@ -971,18 +772,6 @@ class Panel extends St.Widget { return indicator; } - _addStyleClassName(className) { - this.add_style_class_name(className); - this._rightCorner.add_style_class_name(className); - this._leftCorner.add_style_class_name(className); - } - - _removeStyleClassName(className) { - this.remove_style_class_name(className); - this._rightCorner.remove_style_class_name(className); - this._leftCorner.remove_style_class_name(className); - } - _onMenuSet(indicator) { if (!indicator.menu || indicator.menu._openChangedId) return;