From e0c0d9223ef7c9027220924cd5d86c84a336ef6e Mon Sep 17 00:00:00 2001
From: Carlos Garnacho <carlosg@gnome.org>
Date: Mon, 13 Feb 2017 15:11:22 +0100
Subject: [PATCH] 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 b46a695c8..fdb0d271e 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 671023a8b..c2e4db498 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 5f2d39ff4..ed8aa5eee 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 e172a6e4f..e3ca88179 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));