From 2780e783dd18de9add084cbc4a7b127676d5968d Mon Sep 17 00:00:00 2001
From: John O'Nolan <john@ghost.org>
Date: Mon, 8 Jun 2015 14:08:28 +0100
Subject: [PATCH] Refactor Zelda dropdown styles

- New styles for dropdowns
- Fix minor tag-delete button bug
- Fix minor alignment bug on invite-user modal
- Update "about ghost" icon
---
 .../app/styles/components/dropdowns.css       | 26 +++++++++++--------
 core/client/app/styles/layouts/users.css      |  1 +
 .../app/templates/components/gh-nav-menu.hbs  |  3 +--
 .../templates/settings/tags/settings-menu.hbs |  2 +-
 4 files changed, 18 insertions(+), 14 deletions(-)

diff --git a/core/client/app/styles/components/dropdowns.css b/core/client/app/styles/components/dropdowns.css
index 3135f6639d..e451c3a9c6 100644
--- a/core/client/app/styles/components/dropdowns.css
+++ b/core/client/app/styles/components/dropdowns.css
@@ -16,9 +16,9 @@
     left: 0;
     float: left;
     margin: 2px 0 0;
-    padding: 5px 0;
+    padding: 10px;
     min-width: 220px;
-    border: color(var(--lightgrey) lightness(-15%)) 1px solid;
+    border: #e1e1e1 1px solid;
     background-color: #fff;
     background-clip: padding-box;
     border-radius: 4px;
@@ -38,28 +38,32 @@
 
 .dropdown-menu .divider {
     overflow: hidden;
-    margin: 4px 0;
+    margin: 8px 0;
     height: 1px;
-    background: color(var(--lightgrey) lightness(-5%));
+    background: color(#e1e1e1 lightness(+5%));
 }
 
 .dropdown-menu > li > a,
 .dropdown-menu > li > button {
     display: flex;
+    align-items: center;
     clear: both;
-    padding: 3px 20px;
+    padding: 6px 10px;
     width: 100%;
-    color: #333;
+    border-radius: 3px;
+    color: color(var(--darkgrey) lightness(+20%));
     text-align: left;
     white-space: nowrap;
-    line-height: 1.9em;
+    font-size: 1.3rem;
+    line-height: 1em;
     font-weight: normal;
     transition: none;
 }
 
 .dropdown-menu i {
-    margin-right: 0.5rem;
-    font-size: 0.9em;
+    margin-right: 10px;
+    font-size: 14px;
+    line-height: 1em;
 }
 
 
@@ -71,8 +75,8 @@
 .dropdown-menu > li > a:focus,
 .dropdown-menu > li > button:hover,
 .dropdown-menu > li > button:focus {
-    background: var(--blue);
-    color: #fff;
+    background: color(var(--blue) alpha(-85%));
+    color: var(--darkgrey);
     text-decoration: none;
 }
 
diff --git a/core/client/app/styles/layouts/users.css b/core/client/app/styles/layouts/users.css
index ac6ef3df52..0f95b9767b 100644
--- a/core/client/app/styles/layouts/users.css
+++ b/core/client/app/styles/layouts/users.css
@@ -229,5 +229,6 @@ a.user-list-item {
 }
 
 .invite-new-user .btn-green {
+    margin: 0;
     width: 100%;
 }
diff --git a/core/client/app/templates/components/gh-nav-menu.hbs b/core/client/app/templates/components/gh-nav-menu.hbs
index 6b7b19fe4d..c299cd32d3 100644
--- a/core/client/app/templates/components/gh-nav-menu.hbs
+++ b/core/client/app/templates/components/gh-nav-menu.hbs
@@ -8,10 +8,9 @@
 {{/gh-dropdown-button}}
 {{#gh-dropdown tagName="div" classNames="dropdown" name="user-menu" closeOnClick="true"}}
     <ul class="dropdown-menu dropdown-triangle-top js-user-menu-dropdown-menu" role="menu" style="right:-50%;left:auto;margin-right:40px">
-        <li role="presentation">{{#link-to "about" classNames="gh-nav-menu-about dropdown-item js-nav-item" role="menuitem" tabindex="-1"}}<i class="icon-gh"></i> About Ghost{{/link-to}}</li>
+        <li role="presentation">{{#link-to "about" classNames="gh-nav-menu-about dropdown-item js-nav-item" role="menuitem" tabindex="-1"}}<i class="icon-shop"></i> About Ghost{{/link-to}}</li>
         <li class="divider"></li>
         <li role="presentation">{{#link-to "settings.users.user" session.user.slug classNames="dropdown-item user-menu-profile js-nav-item" role="menuitem" tabindex="-1"}}<i class="icon-user"></i> Your Profile{{/link-to}}</li>
-        <li class="divider"></li>
         <li role="presentation">{{#link-to "signout" classNames="dropdown-item user-menu-signout" role="menuitem" tabindex="-1"}}<i class="icon-signout"></i> Sign Out{{/link-to}}</li>
     </ul>
 {{/gh-dropdown}}
diff --git a/core/client/app/templates/settings/tags/settings-menu.hbs b/core/client/app/templates/settings/tags/settings-menu.hbs
index ef2b8ca0f2..78a57ce497 100644
--- a/core/client/app/templates/settings/tags/settings-menu.hbs
+++ b/core/client/app/templates/settings/tags/settings-menu.hbs
@@ -35,7 +35,7 @@
                 </ul>
 
                 {{#unless activeTag.isNew}}
-                    <button type="button" class="btn btn-link btn-sm tag-delete-button icon-trash" {{action "openModal" "delete-tag" activeTag}}>Delete Tag</button>
+                    <button type="button" class="btn btn-link btn-sm tag-delete-button" {{action "openModal" "delete-tag" activeTag}}><i class="icon-trash"></i> Delete Tag</button>
                 {{/unless}}
             </form>
         </div>