brl/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

panelMenu: Use a normal St.Bin to allow styling

Browse Source 
Currently we don't add some style to ButtonBox like padding etc, we add
it programatically taking into account minimum padding and natural
padding. The thing is that with natural padding it works as expected
even for low resolutions.

As a design request, we need to style from css, and since the current
ButtonBox class doesn't add any worth functionality, change that and use
a simple St.Bin that allow normal styling.
This commit is contained in:
Carlos Soriano 2014-10-28 10:56:46 +01:00
parent 74a8fbfdaf
commit 3b86d23e09
4 changed files with 12 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
data/theme/_common.scss
View File

@ -265,8 +265,7 @@ StScrollBar {
}
.panel-button {
-natural-hpadding: 12px;
-minimum-hpadding: 6px;
padding: 0px 12px;
font-weight: bold;
color: #ccc;
transition-duration: 100ms;

3
data/theme/gnome-shell.css
View File

@ -1201,8 +1201,7 @@ StScrollBar {
-panel-corner-background-color: transparent;
-panel-corner-border-color: transparent; }
#panel .panel-button {
-natural-hpadding: 12px;
-minimum-hpadding: 6px;
padding: 0px 12px;
font-weight: bold;
color: #ccc;
transition-duration: 100ms; }

15
js/ui/panel.js
View File

@ -814,7 +814,7 @@ const AggregateMenu = new Lang.Class({
this.menu.actor.add_style_class_name('aggregate-menu');
this._indicators = new St.BoxLayout({ style_class: 'panel-status-indicators-box' });
this.actor.add_child(this._indicators);
this.actor.add_actor(this._indicators);
if (Config.HAVE_NETWORKMANAGER) {
this._network = new imports.ui.status.network.NMApplet();
@ -1100,7 +1100,7 @@ const Panel = new Lang.Class({
continue;
if (indicator.menu)
indicator.menu.close();
indicator.container.hide();
indicator.actor.hide();
}
},
@ -1132,21 +1132,14 @@ const Panel = new Lang.Class({
},
_addToPanelBox: function(role, indicator, position, box) {
let container = indicator.container;
container.show();
let parent = container.get_parent();
if (parent)
parent.remove_actor(container);
box.insert_child_at_index(container, position);
indicator.actor.show();
box.insert_child_at_index(indicator.actor, position);
if (indicator.menu)
this.menuManager.addMenu(indicator.menu);
this.statusArea[role] = indicator;
let destroyId = indicator.connect('destroy', Lang.bind(this, function(emitter) {
delete this.statusArea[role];
emitter.disconnect(destroyId);
container.destroy();
}));
},

90
js/ui/panelMenu.js
View File

@ -13,92 +13,16 @@ const Main = imports.ui.main;
const Params = imports.misc.params;
const PopupMenu = imports.ui.popupMenu;
const ButtonBox = new Lang.Class({
Name: 'ButtonBox',
_init: function(params) {
params = Params.parse(params, { style_class: 'panel-button' }, true);
this.actor = new Shell.GenericContainer(params);
this.actor._delegate = this;
this.container = new St.Bin({ y_fill: true,
x_fill: true,
child: this.actor });
this.actor.connect('get-preferred-width', Lang.bind(this, this._getPreferredWidth));
this.actor.connect('get-preferred-height', Lang.bind(this, this._getPreferredHeight));
this.actor.connect('allocate', Lang.bind(this, this._allocate));
this.actor.connect('style-changed', Lang.bind(this, this._onStyleChanged));
this._minHPadding = this._natHPadding = 0.0;
},
_onStyleChanged: function(actor) {
let themeNode = actor.get_theme_node();
this._minHPadding = themeNode.get_length('-minimum-hpadding');
this._natHPadding = themeNode.get_length('-natural-hpadding');
},
_getPreferredWidth: function(actor, forHeight, alloc) {
let child = actor.get_first_child();
if (child) {
[alloc.min_size, alloc.natural_size] = child.get_preferred_width(-1);
} else {
alloc.min_size = alloc.natural_size = 0;
}
alloc.min_size += 2 * this._minHPadding;
alloc.natural_size += 2 * this._natHPadding;
},
_getPreferredHeight: function(actor, forWidth, alloc) {
let child = actor.get_first_child();
if (child) {
[alloc.min_size, alloc.natural_size] = child.get_preferred_height(-1);
} else {
alloc.min_size = alloc.natural_size = 0;
}
},
_allocate: function(actor, box, flags) {
let child = actor.get_first_child();
if (!child)
return;
let [minWidth, natWidth] = child.get_preferred_width(-1);
let availWidth = box.x2 - box.x1;
let availHeight = box.y2 - box.y1;
let childBox = new Clutter.ActorBox();
if (natWidth + 2 * this._natHPadding <= availWidth) {
childBox.x1 = this._natHPadding;
childBox.x2 = availWidth - this._natHPadding;
} else {
childBox.x1 = this._minHPadding;
childBox.x2 = availWidth - this._minHPadding;
}
childBox.y1 = 0;
childBox.y2 = availHeight;
child.allocate(childBox, flags);
},
});
const Button = new Lang.Class({
Name: 'PanelMenuButton',
Extends: ButtonBox,
_init: function(menuAlignment, nameText, dontCreateMenu) {
this.parent({ reactive: true,
can_focus: true,
track_hover: true,
accessible_name: nameText ? nameText : "",
accessible_role: Atk.Role.MENU });
this.actor = new St.Bin({ style_class: 'panel-button',
reactive: true,
can_focus: true,
track_hover: true,
accessible_name: nameText ? nameText : "",
accessible_role: Atk.Role.MENU });
this.actor.connect('event', Lang.bind(this, this._onEvent));
this.actor.connect('notify::visible', Lang.bind(this, this._onVisibilityChanged));
@ -177,8 +101,6 @@ const Button = new Lang.Class({
},
destroy: function() {
this.actor._delegate = null;
if (this.menu)
this.menu.destroy();
this.actor.destroy();