From 6e119567c5060341cbdb674dc9ba853d067a93c2 Mon Sep 17 00:00:00 2001
From: John O'Nolan <john@ghost.org>
Date: Sat, 16 Aug 2014 19:40:35 +0300
Subject: [PATCH] Settings nav overhaul

---
 ghost/admin/templates/settings.hbs            | 39 +++++++--------
 ghost/admin/templates/settings/general.hbs    | 16 +++---
 .../admin/templates/settings/users/index.hbs  | 12 +++--
 ghost/admin/templates/settings/users/user.hbs | 50 ++++++++-----------
 ghost/admin/views/settings.js                 |  1 -
 5 files changed, 52 insertions(+), 66 deletions(-)

diff --git a/ghost/admin/templates/settings.hbs b/ghost/admin/templates/settings.hbs
index af54a0e1e8..286e3df794 100644
--- a/ghost/admin/templates/settings.hbs
+++ b/ghost/admin/templates/settings.hbs
@@ -1,31 +1,26 @@
 <header class="page-header">
     <a class="menu-button" href="#"><span class="sr-only">Menu</span></a>
-    <h2>Settings</h2>
+    <h2 class="page-title">Settings</h2>
 </header>
 
 <div class="page-content">
-    <aside class="settings-sidebar" role="complementary">
-        <header>
-            <h1 class="title">Settings</h1>
-        </header>
-        <nav class="settings-menu">
-            <ul>
-                {{#unless session.user.isAuthor}}
-                    {{#unless session.user.isEditor}}
-                        {{gh-activating-list-item route="settings.general" title="General" classNames="general"}}
-                    {{/unless}}
-
-                    {{gh-activating-list-item route="settings.users" title="Users" classNames="users"}}
-
-                    {{#if showApps}}
-                        {{#unless session.user.isEditor}}
-                            {{gh-activating-list-item route="settings.apps" title="Apps" classNames="apps"}}
-                        {{/unless}}
-                    {{/if}}
+    <nav class="settings-menu">
+        <ul>
+            {{#unless session.user.isAuthor}}
+                {{#unless session.user.isEditor}}
+                    {{gh-activating-list-item route="settings.general" title="General" classNames="general"}}
                 {{/unless}}
-            </ul>
-        </nav>
-    </aside>
+
+                {{gh-activating-list-item route="settings.users" title="Users" classNames="users"}}
+
+                {{#if showApps}}
+                    {{#unless session.user.isEditor}}
+                        {{gh-activating-list-item route="settings.apps" title="Apps" classNames="apps"}}
+                    {{/unless}}
+                {{/if}}
+            {{/unless}}
+        </ul>
+    </nav>
 
     {{outlet}}
 </div>
diff --git a/ghost/admin/templates/settings/general.hbs b/ghost/admin/templates/settings/general.hbs
index ba9acf493e..23a23e242d 100644
--- a/ghost/admin/templates/settings/general.hbs
+++ b/ghost/admin/templates/settings/general.hbs
@@ -1,13 +1,9 @@
-<header class="settings-content-header">
-    <h2 class="title">General</h2>
-
-    <div class="settings-header-inner">
-	{{#link-to 'settings' class='btn btn-default'}}Back{{/link-to}}
-
-        <section class="page-actions">
-            <button type="button" class="btn btn-blue" {{action "save"}}>Save</button>
-        </section>
-    </div>
+<header class="settings-view-header">
+    {{#link-to "settings" class="btn btn-default btn-back"}}Back{{/link-to}}
+    <h2 class="page-title">General</h2>
+    <section class="page-actions">
+        <button type="button" class="btn btn-blue" {{action "save"}}>Save</button>
+    </section>
 </header>
 
 <section class="content settings-general">
diff --git a/ghost/admin/templates/settings/users/index.hbs b/ghost/admin/templates/settings/users/index.hbs
index 2316499f95..8350cd68ba 100644
--- a/ghost/admin/templates/settings/users/index.hbs
+++ b/ghost/admin/templates/settings/users/index.hbs
@@ -1,6 +1,12 @@
-<header>
-    {{#link-to 'settings' class='btn btn-default'}}Back{{/link-to}}
-    <h2 class="title">Users</h2>
+<script>
+$(document).ready(function() {
+    $('body').addClass('settings-view');
+});
+</script>
+
+<header class="settings-view-header">
+    {{#link-to "settings" class="btn btn-default btn-back"}}Back{{/link-to}}
+    <h2 class="page-title">Users</h2>
     <section class="page-actions">
         <button class="btn btn-green" {{action "openModal" "invite-new-user"}} >New&nbsp;User</button>
     </section>
diff --git a/ghost/admin/templates/settings/users/user.hbs b/ghost/admin/templates/settings/users/user.hbs
index 17b46b6bcc..de0cfedefc 100644
--- a/ghost/admin/templates/settings/users/user.hbs
+++ b/ghost/admin/templates/settings/users/user.hbs
@@ -1,36 +1,26 @@
-<header class="settings-content-header user-settings-header">
-
-    <h2 class="hidden">Your Profile</h2>
-
-    <div class="settings-header-inner">
-        {{#link-to 'settings' class='btn btn-default'}}Back{{/link-to}}
-        <section class="page-actions page-actions-alt">
-            {{#unless session.user.isAuthor}}
-                {{#link-to "settings.users" class="button has-icon users-back" tagName="button"}}<i class="icon-chevron-left"></i>Users{{/link-to}}
-            {{/unless}}
-        </section>
-
-        <section class="page-actions">
-
-            {{#if view.userActionsAreVisible}}
-                <span class="dropdown">
-                    {{#gh-popover-button popoverName="user-actions-menu" classNames="button only-has-icon user-actions-cog" title="User Actions"}}
-                        <i class="icon-settings"></i>
-                        <span class="hidden">User Settings</span>
-                    {{/gh-popover-button}}
-                    {{#gh-popover name="user-actions-menu" tagName="ul" classNames="user-actions-menu dropdown-menu dropdown-triangle-top-right"}}
-                        {{render "user-actions-menu" model}}
-                    {{/gh-popover}}
-                </span>
-            {{/if}}
-
-            <button class="btn btn-blue" {{action "save"}}>Save</button>
-        </section>
-    </div>
+<header class="settings-subview-header">
+    {{#unless session.user.isAuthor}}
+        {{#link-to "settings.users" class="button has-icon users-back" tagName="button"}}<i class="icon-chevron-left"></i>Users{{/link-to}}
+    {{/unless}}
+    <h2 class="page-title">{{user.name}}</h2>
+    <section class="page-actions">
+        {{#if view.userActionsAreVisible}}
+            <span class="dropdown">
+                {{#gh-popover-button popoverName="user-actions-menu" classNames="button only-has-icon user-actions-cog" title="User Actions"}}
+                    <i class="icon-settings"></i>
+                    <span class="hidden">User Settings</span>
+                {{/gh-popover-button}}
+                {{#gh-popover name="user-actions-menu" tagName="ul" classNames="user-actions-menu dropdown-menu dropdown-triangle-top-right"}}
+                    {{render "user-actions-menu" model}}
+                {{/gh-popover}}
+            </span>
+        {{/if}}
 
+        <button class="btn btn-blue" {{action "save"}}>Save</button>
+    </section>
 </header>
 
-<section class="content settings-user no-padding">
+<section class="content settings-user">
 
     <header class="user-profile-header">
         <img id="user-cover" class="cover-image" {{bind-attr src=cover title=coverTitle}} />
diff --git a/ghost/admin/views/settings.js b/ghost/admin/views/settings.js
index 74b6602f23..50f6fd8409 100644
--- a/ghost/admin/views/settings.js
+++ b/ghost/admin/views/settings.js
@@ -1,7 +1,6 @@
 import {mobileQuery} from 'ghost/utils/mobile';
 
 var SettingsView = Ember.View.extend({
-    classNames: ['wrapper'],
     // used by SettingsContentBaseView and on resize to mobile from desktop
     showSettingsContent: function () {
         if (mobileQuery.matches) {