diff options
Diffstat (limited to 'wikipedia/widgets/category_button.js')
-rw-r--r-- | wikipedia/widgets/category_button.js | 40 |
1 files changed, 13 insertions, 27 deletions
diff --git a/wikipedia/widgets/category_button.js b/wikipedia/widgets/category_button.js index 6388d68..08ce2ed 100644 --- a/wikipedia/widgets/category_button.js +++ b/wikipedia/widgets/category_button.js @@ -7,15 +7,9 @@ const Lang = imports.lang; const CompositeButton = imports.wikipedia.widgets.composite_button; const Utils = imports.wikipedia.utils; -const CATEGORY_LABEL_LEFT_MARGIN = 25; // pixels -const CATEGORY_LABEL_BOTTOM_MARGIN = 20; // pixels -const CATEGORY_BUTTON_RIGHT_MARGIN = 20; // pixels -const CATEGORY_BUTTON_BOTTOM_MARGIN = 20; // pixels +const CATEGORY_LABEL_LEFT_MARGIN_PIXELS = 5; // in addition to the 20px below +const CATEGORY_LABEL_SPACING_PIXELS = 20; const CATEGORY_BUTTON_SIZE_PIXELS = 42; -// The following two are corrections because GTK 3.8 doesn't have baseline -// alignment. Remove and align properly in GTK 3.10. FIXME -const CATEGORY_LABEL_BASELINE_CORRECTION = 0; // pixels -const CATEGORY_BUTTON_BASELINE_CORRECTION = 10; // pixels const CATEGORY_BUTTON_RESOURCE_URI = 'resource:///com/endlessm/wikipedia-domain/assets/wikipedia-category-forward-symbolic.svg'; const CATEGORY_MIN_WIDTH = 120; // pixels @@ -62,17 +56,19 @@ const CategoryButton = new Lang.Class({ this._is_main_category = null; this._pixbuf = null; - this._overlay = new Gtk.Overlay({ + this._inner_grid = new Gtk.Grid({ + valign: Gtk.Align.END, + halign: Gtk.Align.FILL, + border_width: CATEGORY_LABEL_SPACING_PIXELS, + column_spacing: CATEGORY_LABEL_SPACING_PIXELS, expand: true }); this._label = new Gtk.Label({ - margin_left: CATEGORY_LABEL_LEFT_MARGIN, - margin_bottom: CATEGORY_LABEL_BOTTOM_MARGIN - CATEGORY_LABEL_BASELINE_CORRECTION, + margin_left: CATEGORY_LABEL_LEFT_MARGIN_PIXELS, halign: Gtk.Align.START, - valign: Gtk.Align.END, + valign: Gtk.Align.BASELINE, xalign: 0.0, // deprecated Gtk.Misc properties; necessary because wrap: true, // "wrap" doesn't respect "halign" - width_chars: 18, max_width_chars: 20 }); this._arrow = new Gtk.Image({ @@ -80,16 +76,10 @@ const CategoryButton = new Lang.Class({ file: Gio.File.new_for_uri(CATEGORY_BUTTON_RESOURCE_URI) }), pixel_size: CATEGORY_BUTTON_SIZE_PIXELS, - margin_right: CATEGORY_BUTTON_RIGHT_MARGIN, - margin_bottom: CATEGORY_BUTTON_BOTTOM_MARGIN + CATEGORY_BUTTON_BASELINE_CORRECTION, + hexpand: true, halign: Gtk.Align.END, valign: Gtk.Align.END }); - // Make the arrow image transparent to mouse events - this._arrow.connect_after('realize', function (frame) { - let gdk_window = frame.get_window(); - gdk_window.set_child_input_shapes(); - }); this._arrow.get_style_context().add_class(Gtk.STYLE_CLASS_IMAGE); let context = this._label.get_style_context(); @@ -101,12 +91,10 @@ const CategoryButton = new Lang.Class({ this.parent(props); // Put widgets together - let alignment = new Gtk.Alignment({ expand: true }); - alignment.add(this._label); - this._overlay.add(alignment); - this._overlay.add_overlay(this._arrow); this.setSensitiveChildren([this._arrow]); - this.add(this._overlay); + this._inner_grid.add(this._label); + this._inner_grid.add(this._arrow); + this.add(this._inner_grid); this.show_all(); }, @@ -150,8 +138,6 @@ const CategoryButton = new Lang.Class({ if(this._is_main_category) { let context = this._label.get_style_context(); context.add_class(EndlessWikipedia.STYLE_CLASS_MAIN); - this._label.margin_bottom = 0; - this._label.width_chars = 8; this._label.max_width_chars = 9; } }, |