From bdfd972bad25d00f6f47a0c1294538cc73c7e346 Mon Sep 17 00:00:00 2001
From: John O'Nolan <john@onolan.org>
Date: Thu, 27 Aug 2015 12:14:59 +0200
Subject: [PATCH 1/2] Minor visual bugfixes

- Line height on forgotten password butotn
- Regresson in button display mode
---
 ghost/admin/app/styles/layouts/auth.css     | 2 ++
 ghost/admin/app/styles/patterns/buttons.css | 1 +
 2 files changed, 3 insertions(+)

diff --git a/ghost/admin/app/styles/layouts/auth.css b/ghost/admin/app/styles/layouts/auth.css
index 2880b9a4fb..f26c7a4393 100644
--- a/ghost/admin/app/styles/layouts/auth.css
+++ b/ghost/admin/app/styles/layouts/auth.css
@@ -41,6 +41,8 @@
     border-radius: 0;
     text-transform: none;
     letter-spacing: 0;
+    font-size: 1.1rem;
+    line-height: 1.2rem;
     /* Needs white BG to hide ugly lastpass icon */
 }
 
diff --git a/ghost/admin/app/styles/patterns/buttons.css b/ghost/admin/app/styles/patterns/buttons.css
index d30f429f4c..14852318b9 100644
--- a/ghost/admin/app/styles/patterns/buttons.css
+++ b/ghost/admin/app/styles/patterns/buttons.css
@@ -3,6 +3,7 @@
 
 /* Base button style */
 .btn {
+    display: inline-block;
     margin-bottom: 0;
     padding: 9px 15px;
     border: #dfe1e3 1px solid;

From 65939c2d866d8bdbb975c2df969677c630cb2784 Mon Sep 17 00:00:00 2001
From: John O'Nolan <john@onolan.org>
Date: Thu, 27 Aug 2015 12:15:37 +0200
Subject: [PATCH 2/2] Customised selectize theme for Ghost tags

---
 .../admin/app/styles/components/selectize.css | 483 ++----------------
 1 file changed, 32 insertions(+), 451 deletions(-)

diff --git a/ghost/admin/app/styles/components/selectize.css b/ghost/admin/app/styles/components/selectize.css
index 418ecb5874..cd2db1bdb0 100644
--- a/ghost/admin/app/styles/components/selectize.css
+++ b/ghost/admin/app/styles/components/selectize.css
@@ -1,27 +1,8 @@
-/**
- * selectize.css (v0.12.1)
- * Copyright (c) 2013–2015 Brian Reavis & contributors
- *
- * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
- * file except in compliance with the License. You may obtain a copy of the License at:
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
- * ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- *
- * @author Brian Reavis <brian@thirdroute.com>
- */
-
 .selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder {
     visibility: visible !important;
     border: 0 none !important;
     background: #f2f2f2 !important;
     background: rgba(0, 0, 0, 0.06) !important;
-    box-shadow: inset 0 0 12px 4px #fff;
-
-    -webkit-box-shadow: inset 0 0 12px 4px #fff;
 }
 .selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
     content: "!";
@@ -29,18 +10,13 @@
 }
 .selectize-control.plugin-drag_drop .ui-sortable-helper {
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
-
-    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
 }
 .selectize-dropdown-header {
     position: relative;
     padding: 5px 8px;
     border-bottom: 1px solid #d0d0d0;
     background: #f8f8f8;
-    border-radius: 3px 3px 0 0;
-
-    -webkit-border-radius: 3px 3px 0 0;
-    -moz-border-radius: 3px 3px 0 0;
+    border-radius: var(--border-radius) var(--border-radius) 0 0;
 }
 .selectize-dropdown-header-close {
     position: absolute;
@@ -60,9 +36,6 @@
     box-sizing: border-box;
     border-top: 0 none;
     border-right: 1px solid #f2f2f2;
-
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
 }
 .selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
     border-right: 0 none;
@@ -75,20 +48,19 @@
 }
 .selectize-control.plugin-remove_button [data-value] {
     position: relative;
-    padding-right: 24px !important;
+    padding-right: 20px !important;
 }
 .selectize-control.plugin-remove_button [data-value] .remove {
-    /* fixes ie bug (see #392) */
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     z-index: 1;
-    display: inline-block;
+    display: flex;
+    justify-content: center;
+    align-items: center;
     box-sizing: border-box;
-    padding: 2px 0 0 0;
     width: 17px;
-    border-left: 1px solid #d0d0d0;
     border-radius: 0 2px 2px 0;
     color: inherit;
     vertical-align: middle;
@@ -96,342 +68,6 @@
     text-decoration: none;
     font-size: 12px;
     font-weight: bold;
-
-    -webkit-border-radius: 0 2px 2px 0;
-    -moz-border-radius: 0 2px 2px 0;
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-}
-.selectize-control.plugin-remove_button [data-value] .remove:hover {
-    background: rgba(0, 0, 0, 0.05);
-}
-.selectize-control.plugin-remove_button [data-value].active .remove {
-    border-left-color: #cacaca;
-}
-.selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
-    background: none;
-}
-.selectize-control.plugin-remove_button .disabled [data-value] .remove {
-    border-left-color: #fff;
-}
-.selectize-control {
-    position: relative;
-}
-.selectize-dropdown,
-.selectize-input,
-.selectize-input input {
-    color: #303030;
-    font-family: inherit;
-    font-size: 13px;
-    line-height: 18px;
-
-    -webkit-font-smoothing: inherit;
-}
-.selectize-input,
-.selectize-control.single .selectize-input.input-active {
-    display: inline-block;
-    background: #fff;
-    cursor: text;
-}
-.selectize-input {
-    position: relative;
-    z-index: 1;
-    display: inline-block;
-    overflow: hidden;
-    box-sizing: border-box;
-    padding: 8px 8px;
-    width: 100%;
-    border: 1px solid #d0d0d0;
-    border-radius: 3px;
-    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
-
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
-    -webkit-border-radius: 3px;
-    -moz-border-radius: 3px;
-}
-.selectize-control.multi .selectize-input.has-items {
-    padding: 6px 8px 3px;
-}
-.selectize-input.full {
-    background-color: #fff;
-}
-.selectize-input.disabled,
-.selectize-input.disabled * {
-    cursor: default !important;
-}
-.selectize-input.focus {
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
-
-    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
-}
-.selectize-input.dropdown-active {
-    border-radius: 3px 3px 0 0;
-
-    -webkit-border-radius: 3px 3px 0 0;
-    -moz-border-radius: 3px 3px 0 0;
-}
-.selectize-input > * {
-    display: -moz-inline-stack;
-    display: inline-block;
-    vertical-align: baseline;
-    zoom: 1;
-
-    *display: inline;
-}
-.selectize-control.multi .selectize-input > div {
-    margin: 0 3px 3px 0;
-    padding: 2px 6px;
-    border: 0 solid #d0d0d0;
-    background: #f2f2f2;
-    color: #303030;
-    cursor: pointer;
-}
-.selectize-control.multi .selectize-input > div.active {
-    border: 0 solid #cacaca;
-    background: #e8e8e8;
-    color: #303030;
-}
-.selectize-control.multi .selectize-input.disabled > div,
-.selectize-control.multi .selectize-input.disabled > div.active {
-    border: 0 solid #fff;
-    background: #fff;
-    color: #7d7d7d;
-}
-.selectize-input > input {
-    display: inline-block !important;
-    margin: 0 2px 0 0 !important;
-    padding: 0 !important;
-    min-height: 0 !important;
-    max-width: 100% !important;
-    max-height: none !important;
-    border: 0 none !important;
-    background: none !important;
-    box-shadow: none !important;
-    text-indent: 0 !important;
-    line-height: inherit !important;
-
-    -webkit-user-select: auto !important;
-    -webkit-box-shadow: none !important;
-}
-.selectize-input > input::-ms-clear {
-    display: none;
-}
-.selectize-input > input:focus {
-    outline: none !important;
-}
-.selectize-input::after {
-    content: " ";
-    display: block;
-    clear: left;
-}
-.selectize-input.dropdown-active::before {
-    content: " ";
-    position: absolute;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    display: block;
-    height: 1px;
-    background: #f0f0f0;
-}
-.selectize-dropdown {
-    position: absolute;
-    z-index: 10;
-    box-sizing: border-box;
-    margin: -1px 0 0 0;
-    border: 1px solid #d0d0d0;
-    border-top: 0 none;
-    background: #fff;
-    border-radius: 0 0 3px 3px;
-    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-    -webkit-border-radius: 0 0 3px 3px;
-    -moz-border-radius: 0 0 3px 3px;
-}
-.selectize-dropdown [data-selectable] {
-    overflow: hidden;
-    cursor: pointer;
-}
-.selectize-dropdown [data-selectable] .highlight {
-    background: rgba(125, 168, 208, 0.2);
-    border-radius: 1px;
-
-    -webkit-border-radius: 1px;
-    -moz-border-radius: 1px;
-}
-.selectize-dropdown [data-selectable],
-.selectize-dropdown .optgroup-header {
-    padding: 5px 8px;
-}
-.selectize-dropdown .optgroup:first-child .optgroup-header {
-    border-top: 0 none;
-}
-.selectize-dropdown .optgroup-header {
-    background: #fff;
-    color: #303030;
-    cursor: default;
-}
-.selectize-dropdown .active {
-    background-color: #f5fafd;
-    color: #495c68;
-}
-.selectize-dropdown .active.create {
-    color: #495c68;
-}
-.selectize-dropdown .create {
-    color: rgba(48, 48, 48, 0.5);
-}
-.selectize-dropdown-content {
-    overflow-x: hidden;
-    overflow-y: auto;
-    max-height: 200px;
-}
-.selectize-control.single .selectize-input,
-.selectize-control.single .selectize-input input {
-    cursor: pointer;
-}
-.selectize-control.single .selectize-input.input-active,
-.selectize-control.single .selectize-input.input-active input {
-    cursor: text;
-}
-.selectize-control.single .selectize-input:after {
-    content: " ";
-    position: absolute;
-    top: 50%;
-    right: 15px;
-    display: block;
-    margin-top: -3px;
-    width: 0;
-    height: 0;
-    border-width: 5px 5px 0 5px;
-    border-style: solid;
-    border-color: #808080 transparent transparent transparent;
-}
-.selectize-control.single .selectize-input.dropdown-active:after {
-    margin-top: -4px;
-    border-width: 0 5px 5px 5px;
-    border-color: transparent transparent #808080 transparent;
-}
-.selectize-control.rtl.single .selectize-input:after {
-    right: auto;
-    left: 15px;
-}
-.selectize-control.rtl .selectize-input > input {
-    margin: 0 4px 0 -2px !important;
-}
-.selectize-control .selectize-input.disabled {
-    background-color: #fafafa;
-    opacity: 0.5;
-}
-
-
-/**
- * selectize.default.css (v0.12.1) - Default Theme
- * Copyright (c) 2013–2015 Brian Reavis & contributors
- *
- * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
- * file except in compliance with the License. You may obtain a copy of the License at:
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
- * ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- *
- * @author Brian Reavis <brian@thirdroute.com>
- */
-.selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder {
-    visibility: visible !important;
-    border: 0 none !important;
-    background: #f2f2f2 !important;
-    background: rgba(0, 0, 0, 0.06) !important;
-    box-shadow: inset 0 0 12px 4px #fff;
-
-    -webkit-box-shadow: inset 0 0 12px 4px #fff;
-}
-.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
-    content: "!";
-    visibility: hidden;
-}
-.selectize-control.plugin-drag_drop .ui-sortable-helper {
-    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
-
-    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
-}
-.selectize-dropdown-header {
-    position: relative;
-    padding: 5px 8px;
-    border-bottom: 1px solid #d0d0d0;
-    background: #f8f8f8;
-    border-radius: 3px 3px 0 0;
-
-    -webkit-border-radius: 3px 3px 0 0;
-    -moz-border-radius: 3px 3px 0 0;
-}
-.selectize-dropdown-header-close {
-    position: absolute;
-    top: 50%;
-    right: 8px;
-    margin-top: -12px;
-    color: #303030;
-    font-size: 20px !important;
-    line-height: 20px;
-    opacity: 0.4;
-}
-.selectize-dropdown-header-close:hover {
-    color: #000;
-}
-.selectize-dropdown.plugin-optgroup_columns .optgroup {
-    float: left;
-    box-sizing: border-box;
-    border-top: 0 none;
-    border-right: 1px solid #f2f2f2;
-
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-}
-.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
-    border-right: 0 none;
-}
-.selectize-dropdown.plugin-optgroup_columns .optgroup:before {
-    display: none;
-}
-.selectize-dropdown.plugin-optgroup_columns .optgroup-header {
-    border-top: 0 none;
-}
-.selectize-control.plugin-remove_button [data-value] {
-    position: relative;
-    padding-right: 24px !important;
-}
-.selectize-control.plugin-remove_button [data-value] .remove {
-    /* fixes ie bug (see #392) */
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    z-index: 1;
-    display: inline-block;
-    box-sizing: border-box;
-    padding: 2px 0 0 0;
-    width: 17px;
-    border-left: 1px solid #0073bb;
-    border-radius: 0 2px 2px 0;
-    color: inherit;
-    vertical-align: middle;
-    text-align: center;
-    text-decoration: none;
-    font-size: 12px;
-    font-weight: bold;
-
-    -webkit-border-radius: 0 2px 2px 0;
-    -moz-border-radius: 0 2px 2px 0;
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
 }
 .selectize-control.plugin-remove_button [data-value] .remove:hover {
     background: rgba(0, 0, 0, 0.05);
@@ -453,10 +89,7 @@
 .selectize-input input {
     color: #303030;
     font-family: inherit;
-    font-size: 13px;
-    line-height: 18px;
-
-    -webkit-font-smoothing: inherit;
+    font-size: 1.4rem;
 }
 .selectize-input,
 .selectize-control.single .selectize-input.input-active {
@@ -470,20 +103,20 @@
     display: inline-block;
     overflow: hidden;
     box-sizing: border-box;
-    padding: 8px 8px;
+    padding: 8px 10px;
     width: 100%;
-    border: 1px solid #d0d0d0;
-    border-radius: 3px;
-    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
-
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
-    -webkit-border-radius: 3px;
-    -moz-border-radius: 3px;
+    height: 37px;
+    border: 1px solid #dfe1e3;
+    border-radius: var(--border-radius);
+    color: #666;
+    transition: border-color 0.15s linear;
+}
+.selectize-input.focus {
+    border-color: #b1b1b1;
 }
 .selectize-control.multi .selectize-input.has-items {
     padding: 5px 8px 2px;
+    height: auto;
 }
 .selectize-input.full {
     background-color: #fff;
@@ -492,16 +125,8 @@
 .selectize-input.disabled * {
     cursor: default !important;
 }
-.selectize-input.focus {
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
-
-    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
-}
 .selectize-input.dropdown-active {
-    border-radius: 3px 3px 0 0;
-
-    -webkit-border-radius: 3px 3px 0 0;
-    -moz-border-radius: 3px 3px 0 0;
+    border-radius: var(--border-radius) var(--border-radius) 0 0;
 }
 .selectize-input > * {
     display: -moz-inline-stack;
@@ -513,15 +138,15 @@
 }
 .selectize-control.multi .selectize-input > div {
     margin: 0 3px 3px 0;
-    padding: 2px 6px;
-    border: 1px solid #0073bb;
-    background: #1da7ee;
+    padding: 1px 4px;
+    background: var(--blue);
     color: #fff;
     cursor: pointer;
 }
+
+/* Active tag - selected state when tag is clicked */
 .selectize-control.multi .selectize-input > div.active {
-    border: 1px solid #00578d;
-    background: #92c836;
+    background: color(var(--blue) lightness(-10%));
     color: #fff;
 }
 .selectize-control.multi .selectize-input.disabled > div,
@@ -542,9 +167,6 @@
     box-shadow: none !important;
     text-indent: 0 !important;
     line-height: inherit !important;
-
-    -webkit-user-select: auto !important;
-    -webkit-box-shadow: none !important;
 }
 .selectize-input > input::-ms-clear {
     display: none;
@@ -569,20 +191,14 @@
 }
 .selectize-dropdown {
     position: absolute;
-    z-index: 10;
+    z-index: 1000;
     box-sizing: border-box;
     margin: -1px 0 0 0;
-    border: 1px solid #d0d0d0;
+    border: 1px solid #b1b1b1;
     border-top: 0 none;
     background: #fff;
-    border-radius: 0 0 3px 3px;
-    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-    -webkit-border-radius: 0 0 3px 3px;
-    -moz-border-radius: 0 0 3px 3px;
+    border-radius: 0 0 var(--border-radius) var(--border-radius);
+    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
 }
 .selectize-dropdown [data-selectable] {
     overflow: hidden;
@@ -591,9 +207,6 @@
 .selectize-dropdown [data-selectable] .highlight {
     background: rgba(125, 168, 208, 0.2);
     border-radius: 1px;
-
-    -webkit-border-radius: 1px;
-    -moz-border-radius: 1px;
 }
 .selectize-dropdown [data-selectable],
 .selectize-dropdown .optgroup-header {
@@ -608,11 +221,11 @@
     cursor: default;
 }
 .selectize-dropdown .active {
-    background-color: #f5fafd;
-    color: #495c68;
+    background: color(var(--blue) alpha(-85%));
+    color: var(--darkgrey);
 }
 .selectize-dropdown .active.create {
-    color: #495c68;
+    color: #666;
 }
 .selectize-dropdown .create {
     color: rgba(48, 48, 48, 0.5);
@@ -668,8 +281,6 @@
     box-shadow: none;
     color: #999;
     text-shadow: none;
-
-    -webkit-box-shadow: none;
 }
 .selectize-control.multi .selectize-input.disabled [data-value],
 .selectize-control.multi .selectize-input.disabled [data-value] .remove {
@@ -679,44 +290,14 @@
     background: none;
 }
 .selectize-control.multi .selectize-input [data-value] {
-    background-color: #1b9dec;
-    background-image: -moz-linear-gradient(top, #1da7ee, #178ee9);
-    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#1da7ee), to(#178ee9));
-    background-image: -webkit-linear-gradient(top, #1da7ee, #178ee9);
-    background-image: -o-linear-gradient(top, #1da7ee, #178ee9);
-    background-image: linear-gradient(to bottom, #1da7ee, #178ee9);
-    background-repeat: repeat-x;
+    background: var(--blue);
     border-radius: 3px;
-    box-shadow: 0 1px 0 rgba(0,0,0,0.2),inset 0 1px rgba(255,255,255,0.03);
-    text-shadow: 0 1px 0 rgba(0, 51, 83, 0.3);
-    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff1da7ee', endColorstr='#ff178ee9', GradientType=0);
-
-    -webkit-border-radius: 3px;
-    -moz-border-radius: 3px;
-    -webkit-box-shadow: 0 1px 0 rgba(0,0,0,0.2),inset 0 1px rgba(255,255,255,0.03);
 }
 .selectize-control.multi .selectize-input [data-value].active {
-    background-color: #0085d4;
-    background-image: -moz-linear-gradient(top, #008fd8, #0075cf);
-    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#008fd8), to(#0075cf));
-    background-image: -webkit-linear-gradient(top, #008fd8, #0075cf);
-    background-image: -o-linear-gradient(top, #008fd8, #0075cf);
-    background-image: linear-gradient(to bottom, #008fd8, #0075cf);
-    background-repeat: repeat-x;
-    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff008fd8', endColorstr='#ff0075cf', GradientType=0);
+    background: color(var(--blue) lightness(-10%));
 }
 .selectize-control.single .selectize-input {
-    background-color: #f9f9f9;
-    background-image: -moz-linear-gradient(top, #fefefe, #f2f2f2);
-    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fefefe), to(#f2f2f2));
-    background-image: -webkit-linear-gradient(top, #fefefe, #f2f2f2);
-    background-image: -o-linear-gradient(top, #fefefe, #f2f2f2);
-    background-image: linear-gradient(to bottom, #fefefe, #f2f2f2);
-    background-repeat: repeat-x;
-    box-shadow: 0 1px 0 rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.8);
-    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffefefe', endColorstr='#fff2f2f2', GradientType=0);
-
-    -webkit-box-shadow: 0 1px 0 rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.8);
+    background: #f9f9f9;
 }
 .selectize-control.single .selectize-input,
 .selectize-dropdown.single {