panel: Remove panel corners

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: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/2151>
This commit is contained in:
Florian Müllner 2022-02-02 23:19:12 +01:00
parent 61b34ffe78
commit 4f27a6e520
3 changed files with 3 additions and 233 deletions

View File

@ -22,10 +22,6 @@ stage {
&.unlock-screen,
&:overview {
background-color: #000;
.panel-corner {
-panel-corner-opacity: 1;
}
}
.panel-button {

View File

@ -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

View File

@ -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;