[gnome-shell] padOsd: shuffle title labels hierarchy

[Carlos Garnacho <carlosg src gnome org>]

commit e0c0d9223ef7c9027220924cd5d86c84a336ef6e
Author: Carlos Garnacho <carlosg gnome org>
Date:   Mon Feb 13 15:11:22 2017 +0100

    padOsd: shuffle title labels hierarchy
    
    Add some boxes in between, so we can add the pad chooser button
    and the overall result is still centered.
    
    https://bugzilla.gnome.org/show_bug.cgi?id=779986

 data/theme/gnome-shell-high-contrast.css |    4 ++++
 data/theme/gnome-shell-sass              |    2 +-
 data/theme/gnome-shell.css               |    4 ++++
 js/ui/padOsd.js                          |   14 ++++++++++++--
 4 files changed, 21 insertions(+), 3 deletions(-)
---
diff --git a/data/theme/gnome-shell-high-contrast.css b/data/theme/gnome-shell-high-contrast.css
index b46a695..fdb0d27 100644
--- a/data/theme/gnome-shell-high-contrast.css
+++ b/data/theme/gnome-shell-high-contrast.css
@@ -566,6 +566,10 @@ StScrollBar {
 .pad-osd-window {
   padding: 32px;
   background-color: rgba(0, 0, 0, 0.8); }
+  .pad-osd-window .pad-osd-title-box {
+    spacing: 12px; }
+  .pad-osd-window .pad-osd-title-menu-box {
+    spacing: 6px; }
 
 .combo-box-label {
   width: 15em; }
diff --git a/data/theme/gnome-shell-sass b/data/theme/gnome-shell-sass
index 671023a..c2e4db4 160000
--- a/data/theme/gnome-shell-sass
+++ b/data/theme/gnome-shell-sass
@@ -1 +1 @@
-Subproject commit 671023a8b333f027d8c88fca9963b11581c10a70
+Subproject commit c2e4db4980c4f99a237d20186dcd7f265a83cb6b
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 5f2d39f..ed8aa5e 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -566,6 +566,10 @@ StScrollBar {
 .pad-osd-window {
   padding: 32px;
   background-color: rgba(0, 0, 0, 0.8); }
+  .pad-osd-window .pad-osd-title-box {
+    spacing: 12px; }
+  .pad-osd-window .pad-osd-title-menu-box {
+    spacing: 6px; }
 
 .combo-box-label {
   width: 15em; }
diff --git a/js/ui/padOsd.js b/js/ui/padOsd.js
index e172a6e..e3ca881 100644
--- a/js/ui/padOsd.js
+++ b/js/ui/padOsd.js
@@ -560,13 +560,23 @@ const PadOsd = new Lang.Class({
         let constraint = new Layout.MonitorConstraint({ index: monitorIndex });
         this.actor.add_constraint(constraint);
 
+        this._titleBox = new St.BoxLayout({ style_class: 'pad-osd-title-box',
+                                            vertical: false,
+                                            x_expand: false,
+                                            x_align: Clutter.ActorAlign.CENTER });
+        this.actor.add_actor(this._titleBox);
+
+        let labelBox = new St.BoxLayout({ style_class: 'pad-osd-title-menu-box',
+                                          vertical: true });
+        this._titleBox.add_actor(labelBox);
+
         this._titleLabel = new St.Label({ style: 'font-side: larger; font-weight: bold;',
                                           x_align: Clutter.ActorAlign.CENTER });
         this._titleLabel.clutter_text.set_text(padDevice.get_device_name());
-        this.actor.add_actor(this._titleLabel);
+        labelBox.add_actor(this._titleLabel);
 
         this._tipLabel = new St.Label({ x_align: Clutter.ActorAlign.CENTER });
-        this.actor.add_actor(this._tipLabel);
+        labelBox.add_actor(this._tipLabel);
 
         this._actionEditor = new ActionEditor();
         this._actionEditor.connect('done', Lang.bind(this, this._endButtonActionEdition));