diff --git a/ghost/admin/_config.yml b/ghost/admin/_config.yml index 834e54ad82..53d3122683 100644 --- a/ghost/admin/_config.yml +++ b/ghost/admin/_config.yml @@ -1,25 +1,21 @@ # Dependencies -markdown: rdiscount -highlighter: pygments +markdown: kramdown +highlighter: rouge # Permalinks permalink: pretty # Server -source: ./docs -destination: ./_gh_pages +source: docs +destination: _gh_pages host: 0.0.0.0 -port: 9008 +port: 9001 baseurl: / url: http://localhost:9001 encoding: UTF-8 -exclude: - - "jade" - - "vendor" - # Custom vars -current_version: 0.1.0 +current_version: 2.0.0 repo: https://github.com/TryGhost/Ghost-UI download: diff --git a/ghost/admin/assets/sass/helpers/mixins.scss b/ghost/admin/assets/sass/helpers/mixins.scss index 4d25c40f5c..3b6fceb777 100644 --- a/ghost/admin/assets/sass/helpers/mixins.scss +++ b/ghost/admin/assets/sass/helpers/mixins.scss @@ -1,60 +1,7 @@ -/* - * Mixins - * - * Table of Contents - * - * Baseline - * Gradients - */ - - -/* ========================================================================== - Baseline - ========================================================================== */ +// +// Styles +// -------------------------------------------------- @mixin baseline { margin: 1.6em 0; -} - - -/* ========================================================================== - Gradients - ========================================================================== */ - -@mixin gradient($color1: #aaa, $color2: none) { - - @if $color2 == 'none' { - background-color: lighten($color1, 10%); - background-image: -webkit-linear-gradient(bottom, $color1, lighten($color1, 10%)); - background-image: -moz-linear-gradient(bottom, $color1, lighten($color1, 10%)); - background-image: -ms-linear-gradient(bottom, $color1, lighten($color1, 10%)); - background-image: linear-gradient(bottom, $color1, lighten($color1, 10%)); - } @else { - background-color: $color2; - background-image: -webkit-linear-gradient(bottom, $color1, $color2); - background-image: -moz-linear-gradient(bottom, $color1, $color2); - background-image: -ms-linear-gradient(bottom, $color1, $color2); - background-image: linear-gradient(to top, $color1, $color2); - } - -} - -// The same as the above, but with the colours reversed. - -@mixin inversegradient($color1: #aaa, $color2: none) { - - @if $color2 == 'none' { - background-color: $color1; - background-image: -webkit-linear-gradient(bottom, lighten($color1, 10%), $color1); - background-image: -moz-linear-gradient(bottom, lighten($color1, 10%), $color1); - background-image: -ms-linear-gradient(bottom, lighten($color1, 10%), $color1); - background-image: linear-gradient(bottom, lighten($color1, 10%), $color1); - } @else { - background-color: $color1; - background-image: -webkit-linear-gradient(bottom, $color2, $color1); - background-image: -moz-linear-gradient(bottom, $color2, $color1); - background-image: -ms-linear-gradient(bottom, $color2, $color1); - background-image: linear-gradient(to top, $color2, $color1); - } - } \ No newline at end of file diff --git a/ghost/admin/assets/sass/helpers/variables.scss b/ghost/admin/assets/sass/helpers/variables.scss index 3ec06600d8..90a2687978 100644 --- a/ghost/admin/assets/sass/helpers/variables.scss +++ b/ghost/admin/assets/sass/helpers/variables.scss @@ -1,34 +1,6 @@ -/* - * Variables used in Ghost-UI - * - * Table of Contents - * - * Misc Default Values - * Pixel Densities - * Colours - * Typography - */ - - -/* ========================================================================== - Misc Default Values - ========================================================================== */ - -$rounded: 2px; -$shadow: rgba(0,0,0,0.05) 0 1px 5px; -$default-transition-duration: 0.3s; - - -/* ========================================================================== - Pixel Densities - ========================================================================== */ - -$at2x: 2 device-pixel-ratio; - - -/* ========================================================================== - Colours - ========================================================================== */ +// +// Colours +// -------------------------------------------------- $darkgrey: #242628; $grey: #35393b; @@ -56,11 +28,15 @@ $list-colours: ('green' $green); -/* ========================================================================== - Typography - ========================================================================== */ +// +// Styles +// -------------------------------------------------- + +$rounded: 2px; +$shadow: rgba(0,0,0,0.05) 0 1px 5px; +$default-transition-duration: 0.3s; $font-family: 'Open Sans', sans-serif; -$font-family-sans: $font-family; -$font-family-serif: serif; -$font-family-mono: Inconsolata, monospace; \ No newline at end of file +$font-family-mono: Inconsolata, monospace; + +$at2x: 2 device-pixel-ratio; \ No newline at end of file diff --git a/ghost/admin/assets/sass/layouts/about.scss b/ghost/admin/assets/sass/layouts/about.scss deleted file mode 100644 index 21af270173..0000000000 --- a/ghost/admin/assets/sass/layouts/about.scss +++ /dev/null @@ -1,166 +0,0 @@ -/* - * About Ghost page - * - * Table of Contents - * - * Ghost Logo - * Version, environment & support - * Contributors - * Credits & Copyright - */ - - -/* ========================================================================== - Ghost Logo - ========================================================================== */ - -.settings-about { - - .ghost_logo { - @include icon($i-ghost, 1.28rem, $midgrey) { - position: relative; - top: -6px; - }; - @include icon-after($i-ghost-logo, 2.5rem, $darkgrey); - } - - p { - color: $midgrey; - } - -} // .settings-about - - -/* ========================================================================== - Version, environment & support - ========================================================================== */ - -.about-ghost-intro { - h1 { - margin-top: -6px; - margin-bottom: -21px; - .version { - font-weight: 300; - font-size: 1.3rem; - position: relative; - top: -3px; - } - } // h1 - - @media (max-width: 550px) { - padding-top: 40px; - } - -} // .about-ghost-intro - -.about-environment-help { - margin-top: 35px; -} -.about-environment { - p { - margin: 0; - line-height: 1.7; - } -} -.about-help { - padding-top: 6px; - @media (max-width: 500px) { - padding-top: 16px; - } - .button-dark { - width: 100%; - display: block; - font-size: 0.85rem; - padding-top: 8px; - padding-bottom: 8px; - min-height: 32px; - &:nth-child(1) { - margin-bottom: 11px; - } - } // .button-dark -} // .about-help - -@media (min-width: 501px) { - .about-environment-help { - max-width: 430px; - } - .about-environment { - float: left; - width: calc(100% - 196px); - } - .about-help { - float: right; - width: 176px; - } -} // @media (min-width: 501px) - - -/* ========================================================================== - Contributors - ========================================================================== */ - -.top-contributors { - padding-left: 0; - max-width: 650px; - li { - float: left; - list-style: none; - width: 10%; - a { - display: block; - @media (min-width: 601px) { - margin-right: 9px; - margin-bottom: 9px; - } - @media (max-width: 600px) { - margin-right: 6px; - margin-bottom: 6px; - } - img { - width: 100%; - display: block; - border-radius: 100%; - } - } // a - } // li -} // .top-contributors - - -/* ========================================================================== - Credits & Copyright - ========================================================================== */ - -.about-credits { - margin-top: 48px; - h1 { - font-size: 1.85rem; - margin-bottom: 2rem; - } -} - -.about-contributors-info { - margin-right: -0.9rem; - font-size: 1.2rem; - max-width: 620px; -} - -.button-save.large.about-get-involved { - margin-top: -0.1rem; - font-size: 0.9rem; -} - -.about-copyright { - margin-top: 4.9rem; - a { - &:link, - &:visited { - color: inherit; - } - &:hover, - &:focus, - &:active { - text-decoration: none; - color: $blue; - } - } -} // .about-copyright \ No newline at end of file diff --git a/ghost/admin/assets/sass/layouts/auth.scss b/ghost/admin/assets/sass/layouts/auth.scss deleted file mode 100644 index a10fc5734d..0000000000 --- a/ghost/admin/assets/sass/layouts/auth.scss +++ /dev/null @@ -1,333 +0,0 @@ -/* - * Auth layout for login, signup & reset password - * - * Table of Contents - * - * Globals - * Login - * Signup and Reset - * Forgotten Password - */ - - -/* ========================================================================== - Globals - ========================================================================== */ - -.ghost-login, -.ghost-signup, -.ghost-forgotten, -.ghost-reset { - color: $midgrey; - background: $darkgrey; - - @media (max-width: 400px) { - background: $darkgrey; - } - - main { - top: 15px; - } - - input { - line-height: 1.4em; - font-size: 1.1em; - font-weight: 200; - border: none; - color: #fff; - background: transparent; - box-shadow: none; - margin: 0; - position: relative; - } - - input:-webkit-autofill { - -webkit-box-shadow: 0 0 0px 1000px $lightgrey inset !important; - } - -} - -.login-box, -.signup-box, -.forgotten-box, -.reset-box { - max-width: 530px; - height: 90%; - margin: 0 auto; - padding: 0; - display: table; - - @media (max-width: 630px) { - max-width: 264px; - text-align: center; - } -} - - -/* ============================================================================= - Login - ============================================================================= */ - -.login-form { - max-width: 530px; - color: lighten($midgrey, 15%); - display: table-cell; - vertical-align: middle; - - @media (max-width: 630px) { - max-width: 264px; - } - - div { // Yes. Really. - // TODO: This ^ can be improved 1000% - position: relative; - margin: 0 0 5px 0; - background: lighten($darkgrey, 10%); - float: left; - - @media (max-width: 630px) { - margin-bottom: 1em; - } - } - - // TODO: make more specific - input { - display: inline-block; - clear: both; - padding: 8px 0 8px 8px; - width: 216px; - @include transition(background ease 0.25s); - - @media (max-width: 630px) { - width: 264px; - @include transition(none); - } - - &:focus { - border: none; - background: lighten($darkgrey, 15%); - } - - } - - .email-wrap { - position: relative; - @include icon($i-mail, 12px) { - position: absolute; - bottom: 11px; - left: 8px; - z-index: 100; - } - margin-right: 3px; - @media (max-width: 630px) { - margin-right: 0; - - } - .email { - padding-left: 28px; - border-radius: 2px 0 0 2px; - } - } - - .password-wrap { - position:relative; - @include icon($i-lock, 10px) { - position: absolute; - bottom: 12px; - left: 11px; - z-index: 100; - } - .password { - padding-left: 28px; - border-radius: 0 2px 2px 0; - } - } - - @media (min-width: 631px) { - .email-wrap, - .email-wrap .email { - border-radius: 2px 0 0 2px; - } - .password-wrap, - .password-wrap .password { - border-radius: 0 2px 2px 0; - } - } - - @media (max-width: 630px) { - .email-wrap, - .email-wrap .email, - .password-wrap, - .password-wrap .password { - border-radius: 2px; - } - } - - - - button { - width: 85px; - height: 36px; - margin:0 0 0 10px; - padding: 0.5em 1.37em; - min-height: 30px; - min-width: 80px; - box-shadow: rgba(255,255,255,0.15) 0 1px 0 inset; - - @media (max-width: 630px) { - margin: 0; - width: 100%; - margin-bottom: 1em; - } - } - - .meta { - clear: both; - color: $midgrey; - } - - a { - color: darken($midgrey, 10%); - font-size: 0.9em; - - &:hover { - color: lighten($midgrey, 5%); - text-decoration: none; - } - } - -} // .login-form - - -/* ============================================================================= - Signup and Reset - ============================================================================= */ - -.signup-form, -.reset-form { - max-width: 280px; - color: lighten($midgrey, 15%); - display: table-cell; - vertical-align: middle; - - @media (max-width: 630px) { - width: 264px; - } - - div { // Yes. Really. - // TODO: Same here as above - position: relative; - margin: 0 0 1em 0; - background: lighten($darkgrey, 10%); - float: left; - display: table; - } - - input { - width: 280px; - padding: 8px 10px; - @media (min-width: 631px) { - @include transition(background ease 0.25s); - } - - @media (max-width: 630px) { - width: 264px; - } - - &:focus { - border: none; - background: lighten($darkgrey, 15%); - } - - } - - .name-wrap { - position: relative; - border-radius: 2px; - - .name { - border-radius: 2px; - } - } - - .email-wrap { - position: relative; - border-radius: 2px; - - .email { - border-radius: 2px; - } - } - - .password-wrap { - position: relative; - border-radius: 2px; - - .password { - border-radius: 2px; - } - } - - button { - width: 100%; - height: 36px; - margin: 0 0 1em 0; - padding: 0.5em 1.37em; - min-height: 30px; - min-width: 80px; - box-shadow: rgba(255,255,255,0.15) 0 1px 0 inset; - } - -} // .signup-form, .reset-form - - -/* ============================================================================= - Forgotten Password - ============================================================================= */ - -.forgotten-form { - max-width: 280px; - color: lighten($midgrey, 15%); - display: table-cell; - vertical-align: middle; - - div { // Yes. Really. - // TODO: Again, can make this better. - position: relative; - margin: 0 0 1em 0; - background: lighten($darkgrey, 10%); - float: left; - } - - input { - padding: 8px 10px; - @include transition(background ease 0.25s); - - &:focus { - border: none; - background: lighten($darkgrey, 15%); - } - - } - - .email-wrap { - width: 100%; - position:relative; - border-radius: 2px; - - .email { - border-radius: 2px; - } - } - - button { - width: 100%; - height: 36px; - margin: 0 0 1em 0; - padding: 0.5em 1.37em; - min-height: 30px; - min-width: 80px; - box-shadow: rgba(255,255,255,0.15) 0 1px 0 inset; - } - -} // .forgotten-form \ No newline at end of file diff --git a/ghost/admin/assets/sass/layouts/content.scss b/ghost/admin/assets/sass/layouts/content.scss deleted file mode 100644 index 0048e6fab5..0000000000 --- a/ghost/admin/assets/sass/layouts/content.scss +++ /dev/null @@ -1,308 +0,0 @@ -/* - * Content screen styles - * - * Table of Contents - * - * Content Management - * Preview - */ - - -/* ========================================================================== - Content Management - ========================================================================== */ - -.manage { - .content-view-container { - position: relative; - height: 100%; - width: 100%; - - @media (max-width: 800px) { - overflow-x: hidden; - } - } // .content-view-container - .content-list { - width: 35%; - padding: 15px; - position: absolute; - bottom: 0; - top: 0; - left: 0; - border-right: $lightbrown 2px solid; - background: #fff; - box-shadow: $shadow; - - @media (max-width: 800px) { - width: auto; - right: 0; - z-index: 500; - border: none; - } - - - .content-filter { - position: relative; - z-index: 300; - > a { - padding: 5px; - margin-left: -5px; - } - - .menu-drop { - display: block; - } - } // .content-filter - - .button-add { - @include icon($i-add); - position: absolute; - top: 10px; - right: 15px; - z-index: 700; - color: #fff; - padding: 3px 4px 3px 5px; - min-height: 0; - } // .button-add - - - .content-list-content { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - overflow: auto; - padding-top: 40px; - } // .content-list-content - - .entry-title { - font-size: 1.4em; - line-height: 1.1em; - margin-bottom: 0.5em; - font-weight: normal; - } - - .views { - @include icon($i-stats, 10px, $brown); - float: right; - text-align: right; - margin-left: 15px; - @media (max-width: 800px) { - float: none; - } - } - - .featured .status { - @include icon($i-featured, 11px) { - margin-right: 10px; - vertical-align: 7%; - }; - } - - .status .draft { - color: $red; - } - .status .scheduled { - color: $orange; - } - - - ol { - list-style: none; - padding: 0; - margin: 0; - border-top: $lightbrown 1px solid; - - li { - margin: 0; - padding: 0; - border-bottom: $lightbrown 1px solid; - position: relative; - - a { - - display: block; - padding: 20px 15px; - color: $brown; - @media (max-width: 400px) { - padding: 15px; - } - @media (max-width: 800px) { - padding-right: 40px; - } - - @include icon-after($i-chevron) { - position: absolute; - top: 50%; - margin-top: -6px; - right: 15px; - } - @media (min-width: 801px) { - &:after { - display: none; - } - } - - &:hover { - text-decoration: none; - } - - } // a - - } // li - - li.active { - @media (min-width: 801px) { - // only apply active styles on larger devices - - border-bottom: lighten($midgrey, 40%) 1px solid; - background: lighten($midgrey, 45%); - box-shadow: - lighten($midgrey, 40%) 0 -1px 0, // top border - rgba(0,0,0,0.06) 7px 0 0 inset, // big left border - lighten($midgrey, 40%) 1px 0 0 inset; // small left border - - a:hover { - box-shadow: rgba(0,0,0,0.1) 7px 0 0 inset; - @include transition(all 0.4s ease); - } - - .entry-title { - font-weight: bold; - } - .entry-meta { - color: $darkgrey; - } - - .views { - @include icon($i-stats, 10px, $darkgrey); - color: $darkgrey; - font-weight: normal; - } - - } - } // li.active - } // ol - - } // .content-list -} // .manage - - -/* ============================================================================= - Preview - ============================================================================= */ - -.manage { - - .content-preview { - width: 65%; - padding: 15px; - position: absolute; - bottom:0; - top:0; - right:0; - border-left:$lightbrown 2px solid; - background: #fff; - box-shadow: $shadow; - @media (max-width: 800px) { - width: auto; - left: 100%; - right: -100%; - margin-left: 15px; - border:none; - } - - .unfeatured { - @include icon($i-unfeatured, 14px); - vertical-align: -6%; - margin: 0 7px 0 -5px; - padding: 5px; - } - .featured { - @include icon($i-featured, 14px); - vertical-align: -6%; - margin: 0 7px 0 -5px; - padding: 5px; - } - - .normal { - text-transform: none; - margin:0 3px; - } - - .content-preview-content { - position: absolute; - top:0; - right:0; - bottom:0; - left:0; - overflow: auto; - padding: 80px 40px; - word-break: break-word; - hyphens: auto; - - .wrapper { - max-width: 700px; - margin:0 auto; - } - } // .content-preview-content - - .post-controls { - float:right; - position: relative; - top: 3px; - } - - .post-settings-menu { - position: absolute; - top: 35px; - right: -3px; - } - - .post-edit { - @include icon($i-edit, 14px); - margin-right: 2px; - padding: 0 10px; - } - - img { - width:100%; - height:auto; - } - - } // .preview-post - - .no-posts-box { - position: relative; - height: 90%; - margin: 0px auto; - padding: 0px; - display: table; - z-index: 600; - @media (max-width: 800px) { - position: fixed; - top: 45%; - left: 50%; - } - - .no-posts { - vertical-align: middle; - display: table-cell; - text-align: center; - @media (max-width: 800px) { - display: block; - position: relative; - left: -50%; - } - - h3 { - color: $brown; - font-weight: 200; - font-size: 2em; - } - } // ,no-posts - - } // .no-posts-box - -} // .manage \ No newline at end of file diff --git a/ghost/admin/assets/sass/layouts/editor.scss b/ghost/admin/assets/sass/layouts/editor.scss deleted file mode 100644 index 90ba75cd61..0000000000 --- a/ghost/admin/assets/sass/layouts/editor.scss +++ /dev/null @@ -1,928 +0,0 @@ -/* - * Editor screen styles - * - * Table of Contents - * - * Editor - * Post Preview Content - * Full Screen Mode - * Publish Bar - * Markdown Help Modal - * CodeMirror - */ - - -/* ========================================================================== - Editor - ========================================================================== */ - - // The main post title -.entry-container .entry-title { - @extend .box; - height: 57px; - padding: 2px 15px; - margin-bottom: 5px; - position: relative; - - @media (max-width: 400px) { - box-shadow: none; - } - - input { - border: 0; - margin: 0; - padding: 0; - font-size: 3em; - font-weight: bold; - letter-spacing: -1px; - width: 100%; - background: transparent; - &:focus { - outline: 0; - } - } -} // .entry-title - -.editor { - - .notifications { - @media (min-width: 401px) { - bottom: 40px; - } - } - - .entry-container { - position: relative; - height: 100%; - } - - // The two content panel wrappers, positioned left/right - .entry-markdown { left: 0; border-right: $lightbrown 2px solid; } - .entry-preview { right: 0; border-left: $lightbrown 2px solid; } - - // The visual styles for both panels - .entry-markdown, - .entry-preview { - width: 50%; - padding: 15px; - position: absolute; - bottom: 40px; // height of the publish bar - top: 61px; // height of the post title + margin - background: #fff; - box-shadow: $shadow; - - @media (max-width: 400px) { - box-shadow: none; - } - - // Convert all content areas to small boxes - @media (max-width: 1000px) { - top: 109px; - left: 0; - right: 0; - width: 100%; - border: none; - z-index: 100; - min-height: 380px; - .markdown, .entry-preview-content { - height: 50px; - overflow: hidden; - } - } - - .floatingheader { - - // Turn headers into tabs which act as links - // both headers set to grey/inactive colour - @media (max-width: 1000px) { - cursor: pointer; - width: 50%; - border-right: $lightbrown 2px solid; - color: #fff; - font-weight: normal; - background: $brown; - position: absolute; - top: -40px; - left: 0; - box-shadow: rgba(0,0,0,0.1) 0 -2px 3px inset; - - a { - color: #fff; - } - } - - a { - color: $brown; - } - - .entry-word-count { - float: right; - } - - } - - @media (max-width: 1000px) { - &:not(.active) { - .markdown-help { - &:hover:before { - color: #fff; - } - } - } - } - - // Give the tab with the .active class the highest z-index - &.active { - z-index: 200; - } - - // Restore the normal height of the .active tab (inactive tab stays small, hidden behind) - &.active .markdown, - &.active .entry-preview-content { - height: auto; - overflow: auto; - } - - // Restore the white bg of the currently .active tab, remove hand cursor from currently active tab - &.active header { - @media (max-width: 1000px) { - cursor: auto; - color: $brown; - background: #fff; - box-shadow: none; - a { - color: $brown; - } - } - } - - // Hide markdown icon + wordcount when we hit mobile - @media (max-width: 400px) { - .markdown-help, - .entry-word-count { - display: none; - } - } - - } // .entry-markdown, .entry-preview - - .entry-markdown-content { - - textarea { - border: 0; - width: 100%; - min-height: auto; - height: 100%; - max-width: 100%; - margin: 0; - padding: 10px 20px 50px 20px; - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - -webkit-overflow-scrolling: touch; - - @media (max-width: 600px) { - padding: 10px; - } - @media (min-width: 601px) and (max-width: 1000px) { - padding: 15px; - } - @media (min-width: 1001px) { - top: 40px; - } - @media (max-height: 560px) { - height: calc(100% - 40px); - } - - &:focus { - outline: 0; - } - } - - .CodeMirror { - height: auto; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - font-family: $font-family-mono; - font-size: 1.4em; - line-height: 1.3em; - color: lighten($darkgrey, 10%); - - .CodeMirror-focused, - .CodeMirror-selected { - color: $darkgrey; - background: lighten($blue, 20%); - text-shadow: none; - } - - ::selection { - color: $darkgrey; - background: lighten($blue, 20%); - text-shadow: none; - } - } - - .CodeMirror-lines { - padding: 65px 0 40px 0; /* Vertical padding around content */ - @media (max-width: 1000px) {padding-top: 25px;} - @media (max-width: 400px) {padding: 15px 0;} - } - .CodeMirror pre { - padding: 0 40px; /* Horizontal padding of content */ - @media (max-width: 400px) {padding: 0 15px;} - } - - .cm-header { - color: #000; - font-size: 1.4em; - line-height: 1.4em; - font-weight: bold; - } - - .cm-variable-2, - .cm-variable-3, - .cm-keyword { - color: lighten($darkgrey, 10%); - } - - .cm-string, - .cm-strong, - .cm-link, - .cm-comment, - .cm-quote, - .cm-number, - .cm-atom, - .cm-tag { - color: #000; - font-weight: bold; - } - - } // .entry-markdown-content - - .entry-preview { - // Align the tab of entry-preview on the right - .floatingheader { - @media (max-width: 1000px) { - right: 0; - left: auto; - border-right: none; - border-left: $lightbrown 2px solid; - } - } - - .entry-preview-content { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - padding: 60px 40px 40px 40px; - overflow: auto; - word-break: break-word; - hyphens: auto; - @include user-select(none); - cursor: default; - - // Tweak padding for smaller screens - @media (max-width: 1000px) { - padding-top: 20px; - } - @media (max-width: 400px) { - padding: 15px; - } - } - } // .entry-preview - - // Special case, when scrolling, add shadows to content headers. - .scrolling { - - .floatingheader { - @media (max-width: 1000px) { - box-shadow: none; - } - - &::before, - &::after { - @media (max-width: 1000px) { - display: none; - } - } - } - .CodeMirror-scroll, - .entry-preview-content { - @media (max-width: 1000px) { - box-shadow: 0 5px 5px rgba(0,0,0,0.05) inset; - } - } - } // .scrolling - -} // .editor - -.markdown-help { - position: relative; - top: -5px; - right: -5px; - @include icon($i-question, '', lighten($brown, 15%)); - float: right; - padding: 5px; - - &:hover { - @include icon($i-question, '', $brown); - } -} - - -/* ============================================================================= - Post Preview Content - ============================================================================= */ - -// The styles for the actual content inside the preview -// TODO: These should just be defaults, overridden by editor.hbs in theme dir -.entry-preview-content, -.content-preview-content { - font-size: 1.4em; - line-height: 1.5em; - - a { - color: $blue; - text-decoration: underline; - } - p { - margin: 1.2em 0 1.6em; - &:first-of-type { - margin-top: 0; - } - } - h1 { - font-size: 3em; - } - h2 { - font-size: 2.2em; - } - h3 { - font-size: 1.8em; - } - .btn { - text-decoration: none; - color: $grey; - } - .img-placeholder { - border: 5px dashed $grey; - height: 100px; - position: relative; - span { - display: block; - height: 30px; - position: absolute; - margin-top: -15px; - top: 50%; - width: 100%; - text-align: center; - } - } - a { - &.image-edit { - width: 16px; - height: 16px; - } - } - img { - max-width: 100%; - height: auto; - margin: 0 auto; - } - -} - - -/* ============================================================================= - Full Screen Mode - ============================================================================= */ - -body.zen { - background: lighten($lightbrown, 3%); - .usermenu { - display: none; - } - #global-header, - #publish-bar { - opacity: 0; - height: 0; - overflow: hidden; - @include transition(all 0.5s ease-out); - } - - main { - top: 15px; - @include transition(all 0.5s ease-out); - } - .entry-markdown, - .entry-preview { - bottom: 0; - @include transition(all 0.5s ease-out); - } - -} - - -/* ============================================================================= - Publish Bar - ============================================================================= */ - -#publish-bar { - height: 40px; - padding: 0; - color: $midgrey; - background: darken($darkgrey, 4%); - position: fixed; - bottom: 0; - left: 0; - right: 0; - z-index: 900; - box-shadow: 0 -2px 8px rgba(0,0,0,0.2); - @include transform(translateZ(0)); - - @media (max-width: 1000px) { - font-weight: normal; - } - - .post-settings { - &:hover, - &.active { - color: $lightgrey; - } - } - - .post-settings-menu { - position: absolute; - bottom: 44px; - right: -3px; - } - - .button-save, - .button-delete { - min-height: 30px; - height: 30px; - line-height: 12px; - padding: 0 10px; - margin-top: 5px; - border-top: rgba(255,255,255,0.4) 1px solid; - } - - .options { - width: 30px; - min-height: 30px; - height: 30px; - margin-top: 5px; - border-top: rgba(255,255,255,0.4) 1px solid; - } - - .splitbutton-save, - .splitbutton-delete{ - .button-save, - .button-delete{ - @include transition(width 0.25s ease, background-color 0.3s linear); - } - - .editor-options{ - @extend .menu; - @extend .menu-right; - bottom: 140%; - right: -3%; - - a { - font-size: 14px; - } - } - } -} - -.extended-tags { // When the tag bar is exapanded - position: static; - min-height: 100%; - - #entry-tags { - &:after { - right: 10px; - } - } - .tags { - width: 281px; - } - - .tag-label, - .tag-label.touch { - color: #fff; - } - - .tag-input { - width: 100%; - margin-top: 5px; - padding-top: 5px; - padding-left: 10px; - border-top: 1px solid $darkgrey; - - } - .right { - display: none; - } -} - -#entry-tags { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - text-transform: none; - padding: 10px 0 0 0; - - &:after { - content: ""; - position: fixed; - top: 10px; - right: 220px; - width: 20px; - height: 26px; - @include linear-gradient(left, rgba(26, 28, 29, 0.00), rgba(26, 28, 29, 1.00)); - z-index: 9999; - pointer-events: none; - - @media (max-width: 400px) { - right: 200px; - } - } - - .tags { - position: relative; - display: inline-block; - vertical-align: middle; - width: auto; - max-width: 80%; - max-width: calc(100% - 250px); - height: 22px; - padding-left: 5px; - padding-bottom: 20px; - overflow-x: auto; - overflow-y: hidden; - -webkit-overflow-scrolling: touch; - white-space: nowrap; - @include transition(width 0.2s linear); - - @media (max-width: 400px) { - display: block; - max-width: calc(100% - 230px); - padding-bottom: 0; - } - } - - .tag-label { - display: block; - float: left; - @include icon($i-tag); - padding: 1px 8px 0 8px; - @include transition; - - &:hover { - cursor: pointer; - color: $lightgrey; - } - - &.touch { - color: inherit; - } - } - - input[type="text"].tag-input { - display: inline-block; - vertical-align: top; - color: $lightgrey; - font-weight: 300; - background: transparent; - border: none; - - width: 150px; - margin-top: -8px; - line-height: 1; - padding: 9px; - - @media (max-width: 400px) { - position: absolute; - top: 11px; - right: 170px; - width: 20px; - } - - &:focus { - outline: none; - } - } - - .tag { - @include icon-after($i-x, 8px, $darkgrey) { - margin-left: 4px; - vertical-align: 10%; - text-shadow: rgba(255,255,255,0.15) 0 1px 0; - @include transition; - } - display: inline; - margin-right: 2px; - padding: 0 5px; - color: $lightgrey; - white-space: nowrap; - background: lighten($grey, 15%); - border-radius: $rounded; - box-shadow: rgba(255,255,255,0.2) 0 1px 0 inset, #000 0 1px 3px; - - @include user-select(none); - - &:hover { - cursor: pointer; - @include icon-after($i-x, 8px, $lightgrey) { - margin-left: 4px; - vertical-align: 10%; - text-shadow: none; - } - - } - } -} - -.suggestions { - @extend .menu; - bottom: 100%; - - li.selected{ - background: $blue; - box-shadow: rgba(255,255,255,0.2) 0 1px 0 inset, rgba(0,0,0,0.5) 0 1px 5px; - } - - li a { - padding-left: 25px; - } - - mark{ - background: none; - color: white; - font-weight: bold; - } - -} - -#entry-controls { - display: inline-block; - position: relative; - padding: 0; - z-index: 9000; - - &.unsaved { - .post-settings-menu { - padding-bottom: 0; - - .post-setting:nth-child(3) td { - border-bottom: none; - } - - .delete { - display: none; - } - } - } -} - -#entry-actions { - margin-right: 6px; - position: relative; -} - -#entry-actions-menu { - position: absolute; - bottom: 50px; - right: -5px; -} - -/* ============================================================================= - Markdown Help Modal - ============================================================================= */ - -.markdown-help-container{ - padding-bottom: 20px; -} - -.modal-markdown-help-table { - margin-top: 0; -} - - -/* ============================================================================= - CodeMirror - ============================================================================= */ - -.CodeMirror { - /* Set height, width, borders, and global font properties here */ - font-family: monospace; - height: 300px; -} - -.CodeMirror-scroll { - /* Set scrolling behaviour here */ - overflow: auto; -} - -/* PADDING */ - -.CodeMirror-lines { - padding: 4px 0; /* Vertical padding around content */ -} - -.CodeMirror pre { - padding: 0 4px; /* Horizontal padding of content */ -} - -.CodeMirror-scrollbar-filler { - background-color: white; /* The little square between H and V scrollbars */ -} - -/* GUTTER */ - -.CodeMirror-gutters { - border-right: 1px solid #ddd; - background-color: #f7f7f7; -} - -/* CURSOR */ - -.CodeMirror div.CodeMirror-cursor { - border-left: 1px solid black; - z-index: 3; -} -/* Shown when moving in bi-directional text */ -.CodeMirror div.CodeMirror-secondarycursor { - border-left: 1px solid silver; -} - - -.cm-tab { display: inline-block; } - -/* DEFAULT THEME */ - -.cm-s-default .cm-keyword {color: #708;} -.cm-s-default .cm-atom {color: #219;} -.cm-s-default .cm-number {color: #164;} -.cm-s-default .cm-def {color: #00f;} -.cm-s-default .cm-variable {color: black;} -.cm-s-default .cm-variable-2 {color: #05a;} -.cm-s-default .cm-variable-3 {color: #085;} -.cm-s-default .cm-property {color: black;} -.cm-s-default .cm-operator {color: black;} -.cm-s-default .cm-comment {color: #a50;} -.cm-s-default .cm-string {color: #a11;} -.cm-s-default .cm-string-2 {color: #f50;} -.cm-s-default .cm-meta {color: #555;} -.cm-s-default .cm-error {color: #f00;} -.cm-s-default .cm-qualifier {color: #555;} -.cm-s-default .cm-builtin {color: #30a;} -.cm-s-default .cm-bracket {color: #997;} -.cm-s-default .cm-tag {color: #170;} -.cm-s-default .cm-attribute {color: #00c;} -.cm-s-default .cm-header {color: blue;} -.cm-s-default .cm-quote {color: #090;} -.cm-s-default .cm-hr {color: #999;} -.cm-s-default .cm-link {color: #00c;} - -.cm-negative {color: #d44;} -.cm-positive {color: #292;} -.cm-header, .cm-strong {font-weight: bold;} -.cm-em {font-style: italic;} -.cm-link {text-decoration: underline;} - -.cm-invalidchar {color: #f00;} - -/* STOP */ - -/* The rest of this file contains styles related to the mechanics of - the editor. You probably shouldn't touch them. */ - -.CodeMirror { - line-height: 1; - position: relative; - overflow: hidden; - background: white; - color: black; -} - -.CodeMirror-scroll { - /* 30px is the magic margin used to hide the element's real scrollbars */ - /* See overflow: hidden in .CodeMirror */ - margin-bottom: -30px; margin-right: -30px; - padding-bottom: 30px; padding-right: 30px; - height: 100%; - outline: none; /* Prevent dragging from highlighting the element */ - position: relative; -} -.CodeMirror-sizer { - position: relative; -} - -/* The fake, visible scrollbars. Used to force redraw during scrolling - before actuall scrolling happens, thus preventing shaking and - flickering artifacts. */ -.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler { - position: absolute; - z-index: 6; - display: none; -} - -.CodeMirror-vscrollbar { - right: 0; top: 0; - overflow-x: hidden; - overflow-y: scroll; -} - -.CodeMirror-hscrollbar { - bottom: 0; left: 0; - overflow-y: hidden; - overflow-x: scroll; -} - -.CodeMirror-scrollbar-filler { - right: 0; bottom: 0; - z-index: 6; -} - -.CodeMirror-gutters { - position: absolute; left: 0; top: 0; - height: 100%; - padding-bottom: 30px; - z-index: 3; -} - -.CodeMirror-lines { - cursor: text; -} - -.CodeMirror pre { - /* Reset some styles that the rest of the page might have set */ - -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; - border-width: 0; - background: transparent; - font-family: inherit; - font-size: inherit; - margin: 0; - white-space: pre; - word-wrap: normal; - line-height: inherit; - color: inherit; - z-index: 2; - position: relative; - overflow: visible; -} - -.CodeMirror-wrap pre { - word-wrap: break-word; - white-space: pre-wrap; - word-break: normal; -} - -.CodeMirror-wrap .CodeMirror-scroll { - overflow-x: hidden; -} - -.CodeMirror-measure { - position: absolute; - width: 100%; height: 0px; - overflow: hidden; - visibility: hidden; -} - -.CodeMirror-measure pre { position: static; } - -.CodeMirror:not(.CodeMirror-focused) { - div.CodeMirror-cursor { - visibility: hidden; - } -} - -.CodeMirror div.CodeMirror-cursor { - position: absolute; - border-right: none; - width: 0; -} - -.CodeMirror-selected { background: #d9d9d9; } -.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; } - -/* IE7 hack to prevent it from returning funny offsetTops on the spans */ -.CodeMirror span { *vertical-align: text-bottom; } - -@media print { -/* Hide the cursor when printing */ - .CodeMirror div.CodeMirror-cursor { - visibility: hidden; - } -} diff --git a/ghost/admin/assets/sass/layouts/errors.scss b/ghost/admin/assets/sass/layouts/errors.scss deleted file mode 100644 index 684bb6d5e1..0000000000 --- a/ghost/admin/assets/sass/layouts/errors.scss +++ /dev/null @@ -1,108 +0,0 @@ -/* - * Error page styles - * - * Table of Contents - * - * Error pages - */ - - -/* ========================================================================== - Error pages - ========================================================================== */ - -.error-content { - max-width: 530px; - margin: 0 auto; - padding: 0; - display: table; - height: 100%; - - @media (max-width: 630px) { - max-width: 264px; - text-align: center; - } -} - -.error-details { - display: table-cell; - vertical-align: middle; -} - -.error-image { - display: inline-block; - vertical-align: middle; - width: 96px; - height: 150px; - - @media (max-width: 630px) { - width: 72px; - height: 112px; - } - - img { - width: 100%; - height: 100%; - } -} - -.error-message { - position: relative; - top: -5px; - display: inline-block; - vertical-align: middle; - margin-left: 10px; -} - -.error-code { - margin: 0; - font-size: 7.8em; - line-height: 0.9em; - color: #979797; - - @media (max-width: 630px) { - font-size: 5.8em; - } -} - -.error-description { - margin: 0; - padding: 0; - font-weight: 300; - font-size: 1.9em; - color: #979797; - border: none; - - @media (max-width: 630px) { - font-size: 1.4em; - } -} - -.error-stack { - margin: 1em auto; - padding: 2em; - max-width: 800px; - background-color: rgba(255,255,255,0.3); -} - -.error-stack-list { - list-style-type: none; - padding: 0; - margin: 0; -} - -.error-stack-list li { - display: block; - - &::before { - color: #BBB; - content: "\21AA"; - display: inline-block; - font-size: 1.2em; - margin-right: 0.5em; - } -} - -.error-stack-function { - font-weight: bold; -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/layouts/modals.scss b/ghost/admin/assets/sass/layouts/modals.scss deleted file mode 100644 index 8620b94659..0000000000 --- a/ghost/admin/assets/sass/layouts/modals.scss +++ /dev/null @@ -1,42 +0,0 @@ -.invite-new-user { - .modal-body { - @include clearfix; - fieldset { - margin: 1em 0 0 0; - } - } - .form-group { - - margin-bottom: 0; - padding: 0; - - label { - position: static; - display: block; - text-align: left; - } - - &:nth-of-type(1) { - float: left; - width: 60%; - } - &:nth-of-type(2) { - float: left; - width: 35%; - margin-left: 5%; - } - - input { - width: 100%; - } - - } // .form-group - - .button-add { - width: 100%; - padding: 0.85rem 1.9rem; - font-size: 14px; - line-height: 16px; - } - -} // .invite-new-user \ No newline at end of file diff --git a/ghost/admin/assets/sass/layouts/post-settings-menu.scss b/ghost/admin/assets/sass/layouts/post-settings-menu.scss deleted file mode 100644 index 9fdd819876..0000000000 --- a/ghost/admin/assets/sass/layouts/post-settings-menu.scss +++ /dev/null @@ -1,152 +0,0 @@ -/* - * Post Settings Menu - * - * Table of Contents - * - * Post Settings Menu - */ - - /* ========================================================================== - Post Settings Menu - ========================================================================== */ - -.post-settings { - @include icon($i-settings, 14px); - display: inline-block; - padding: 0 10px; - color: $midgrey; - @include transition; - position: relative; - top: 1px; - - &:hover, - &.active { - color: $darkgrey; - } -} // .post-settings - -.post-settings-menu { - padding-top: 0; - text-transform: none; - - table { - margin: 0; - } - - td { - padding: 0; - border-top: none; - border-bottom: lighten($grey, 5%) 1px solid; - } - - .post-setting-label { - padding: 8px 10px 8px 15px; - border-right: lighten($grey, 5%) 1px solid; - text-align: right; - } - - label { - position: static; - width: auto; - font-weight: normal; - color: $midgrey; - white-space: nowrap; - } - - input { - width: 200px; - margin: 0; - - @media (max-width: 550px) { - width: 200px; - } - - &[type="text"] { - border: none; - padding: 8px 0 8px 10px; - color: $lightgrey; - border-radius: 0; - background: transparent; - - &:focus { - background: $grey; - border: none; - } - } - } // input - - .post-setting-item { - padding: 5px 0 0 10px; - &.no-padding { - padding: 0; - } - } - - .gh-select { - height: 36px; - &:after { - color: $lightgrey; - margin-top: -(0.85em / 2); - } - select { - border: 0; - background: transparent; - border-radius: 0; - color: $lightgrey; - height: 36px; - &:focus { - background: $grey; - } - } - @media (max-width: 550px) { - &, - select { - height: 41px; - } - } - } - - .checkbox { - position: relative; - margin-top: 0; - top: 0; // Resets a global `form label` style - border: 0; - &:after { - border-color: lighten($grey, 10%); - background: $grey; - } - } // .checkbox - - // Colour the checkbox border correctly for a dark background - input[type='checkbox'] { - &:focus { - & + .checkbox { - &:after { - border-color: lighten($grey, 10%); - } - } - } - } // input[type='checkbox'] - - // .select-wrapper { - // width: calc(100% - 10px); - // } - - .delete { - display: block; - padding: 10px 15px; - width: 100%; - text-align: left; - @include icon($i-trash) { - position: relative; - top: -1px; - margin-right: 10px - }; - - &:hover { - background: $red; - color: #fff; - } - } // .delete - -} // .post-settings-menu \ No newline at end of file diff --git a/ghost/admin/assets/sass/layouts/settings.scss b/ghost/admin/assets/sass/layouts/settings.scss deleted file mode 100644 index d2175cd820..0000000000 --- a/ghost/admin/assets/sass/layouts/settings.scss +++ /dev/null @@ -1,418 +0,0 @@ -/* - * Setting pages styles - * - * Table of Contents - * - * Settings - * Sidebar - * Content - * Code Injection - */ - - -/* ========================================================================== - Settings - ========================================================================== */ - -.settings { - - // The main white bg for the page - .wrapper { - background: #fff; - box-shadow: $shadow; - position: relative; - width: 100%; - height: 100%; - margin: 0; - padding: 0; - - @media (max-width: 800px) { - top: -55px; - margin-top: 55px; - overflow-x: hidden; - } - } // .wrapper - - .title { - text-transform: uppercase; - font-weight: normal; - font-size: 1.6em; - line-height: 0.8em; - margin: 0 0 18px 0; - padding: 0; - border: none; - } // .title -} // .settings - - -/* ============================================================================= - Sidebar - ============================================================================= */ - -// The whole left column sidebar, duh. -.settings-sidebar { - width: 20%; - position: absolute; - top: 0; - left: 0; - bottom: 0; - z-index: 700; - background: #fff; - box-shadow: $lightbrown 1px 0 0; - @media (max-width: 800px) { - width: 100%; - box-shadow: none; - } - - > header { - position: relative; - z-index: 400; - height: 17px; - padding: 30px 15px 47px 40px; - margin-bottom: 0; - border-bottom: none; - box-shadow: #edece4 0 -1px 0 inset, #edece4 1px 0 0; - - // Transparent gradient to make bg fade out as it goes out the top. - // TODO: Much improve - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(25%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0.90))); - background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 25%,rgba(255,255,255,0.90) 100%); - background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 25%,rgba(255,255,255,0.90) 100%); - - @media (max-width: 1000px) { - padding-left: 15px; - }; - - } // > header -} // .settings-sidebar - -// Main settings-menu styles, apply to every item -.settings-menu { - position: absolute; - top: 0; - left: 0; - bottom: 0; - right: -1px; - overflow: auto; - @media (max-width: 800px) { - right: 0; - }; - - // Create placeholder the same height as the floating header - // to push content down by the same amount - &:before { - display: block; - content: ""; - height: 77px; // 30px + 17px title + 30px - } - - ul { - border-top: none; - @media (max-width: 800px) { border-bottom: #edece4 1px solid; } - } - - li { - margin-right: 1px; - border-top: #fff 1px solid; - @media (max-width: 800px) { - margin-right: 0; - border-top: #edece4 1px solid; - } - - a { - padding: 15px 15px 15px 40px; - border-bottom: none; - @media (max-width: 1000px) { padding-left: 15px; } - @media (max-width: 800px) { - @include icon-after($i-chevron) { - float: right; - margin-top: 5px; - }; - } - } - - &:first-child { - border-top: none; - } - &:first-child.active { - border-top: none; - } - - &.active { - @media (min-width: 801px) { - // only apply active styles on larger devices - - margin-right: 0; - position: relative; - z-index: 300; - border-top: #edece4 1px solid; - box-shadow: #fff 1px 0 0, #edece4 0 1px 0; - @include transition; - - a { - color: $darkgrey; - font-weight: bold; - background: #fff; - &:focus { - background: $lightbrown; - } - } - - } - } // .active - - } // li - - // Give all icons some space - li a:before { - margin-right: 20px; - @media (max-width: 1000px) { - margin-right: 15px; - } - } - - // Add the icons for specific menu items - .about a { - @include icon($i-ghost); - } - .general a { - @include icon($i-settings); - } - .publishing a { - @include icon($i-content); - } - .services a { - @include icon($i-services); - } - .users a { - @include icon($i-users); - } - .appearance a { - @include icon($i-appearance); - } - .apps a { - @include icon($i-app); - } - .code a { - @include icon($i-code); - } - -} // .settings-menu - - -/* ============================================================================= - Content - ============================================================================= */ - -// The main content panel on the right -.settings-content { - padding: 0; - position: absolute; - top: 0; - right: 0; - left: 20%; - bottom: 0; - background: #fff; - - @media (max-width: 800px) { - width: 100%; - left: 100%; - right: -100%; - margin-left: 15px; - } - - .settings-general img { - max-width: 100%; - max-height: 400px; - } - - // TODO: Header could really be more specific (class) - > header { - position: relative; - z-index: 200; - height: 17px; - padding: 30px 220px 46px 40px; - border-bottom: $lightbrown 1px solid; - margin-bottom: 40px; - text-transform: none; - font-weight: normal; - line-height: inherit; - color: inherit; - - // Transparent gradient to make bg fade out as it goes out the top. - // TODO: Significantly improve - background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 25%, rgba(255,255,255,0.90) 100%); - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(25%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0.90))); - background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 25%,rgba(255,255,255,0.90) 100%); - background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 25%,rgba(255,255,255,0.90) 100%); - background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 25%,rgba(255,255,255,0.90) 100%); - background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 25%,rgba(255,255,255,0.90) 100%); - - @media (max-width: 1000px) { - padding-left: 15px; - } - // @media (max-width: 800px) { - // padding-left: 115px; - // } - @media (max-height: 600px) { - height: auto; - padding: 5px; - position: absolute; - top: 0; - right: 0; - border: none; - background: transparent; - - .title { - display: none; - } - } - @media (max-width: 650px) { - padding-left: 15px; - - .button-back { - position: fixed; - top: 5px; - left: 14px; - min-height: 0; - padding-top: 8px; - padding-bottom: 8px; - display: block; - - &:before { - left: -9px; - border-width: 15px 9px 15px 0; - } - } - } - - .header-inner { - position: absolute; - top: 0; - left: 0; - right: 0; - height: 100px; - outline: 1px solid red; - } - - } // header - - - .page-actions { - position: absolute; - top: 20px; - right: 40px; - z-index: 700; - font-size: 1em; - - @media (max-width: 1000px) { - right: 15px; - } - @media (max-width: 650px) { - position: fixed; - top: 5px; - right: 4px; - - .button-save { - min-height: 0; - height: 30px; - padding: 0.5em 1.37em; - } - } - &.page-actions-alt { - left: 40px; - @media (max-width: 1000px) { - left: 15px; - } - } - - .button-add { - position: relative; - padding-left: 50px; - border: rgba(0,0,0,0.07) 1px solid; - @include icon($i-add, 1.4em, rgba(255,255,255,0.6)) { - position: absolute; - top: 0; - padding: 9px 8px 0 0; - left: 9px; - bottom: 0; - width: 26px; - border-right: rgba(0,0,0,0.07) 1px solid; - }; - @media (max-width: 650px) { - height: 30px; - min-height: 30px; - padding: 6px 10px 8px 40px; - &:before { - padding-top: 7px; - left: 8px; - width: 22px; - } - } - } - } // > header - - .content { - position: absolute; - top: 0; - right: 0; - left: 0; - bottom: 0; - padding: 40px; - overflow: auto; - -webkit-overflow-scrolling: touch; - - // Create placeholder the same height as the floating header - // to push content down by the same amount - &:before { - display: block; - content: ""; - height: 87px; - } - - &.no-padding { - padding: 0; - } - - @media (max-width: 1000px) { - padding-left: 15px; - padding-right: 15px; - } - @media (max-width: 550px) { - padding: 0 15px 40px; - } - } // .content - - .description-container, - .bio-container { - textarea { - min-height: 115px; - } - } - - .word-count { - float: right; - font-weight: bold; - color: darken($brown, 5%); - } - - @media (max-width: 550px) { - textarea { - max-width: 100%; - + p { - max-width: 100%; - } - } - } - -} // .settings-content - - -/* ============================================================================= - Code Injection - ============================================================================= */ - -.header-injection, -.footer-injection { - margin-top: 3.2em; -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/layouts/setup.scss b/ghost/admin/assets/sass/layouts/setup.scss deleted file mode 100644 index d69452d414..0000000000 --- a/ghost/admin/assets/sass/layouts/setup.scss +++ /dev/null @@ -1,134 +0,0 @@ -/* - * Ghost Setup Screen - * - * These styles cover /ghost/setup/ which is the first screen that appears - * when a new instance of Ghost is setup and run. - * - */ - - -/* ========================================================================== - Main Styles - ========================================================================== */ - -.ghost-setup { - color: $midgrey; - background: $darkgrey; - @media (max-width: 550px) { - background: darken($darkgrey, 5%); - } - - main { - top: 15px; - @media (max-width: 550px) { - top: 0; - } - } -} - -// The wrapper to center the form in all ways -.setup-box { - display: table; - max-width: 500px; - height: 90%; - margin: 0 auto; - padding: 0; -} - -// The form itself with the dark background -.setup-form { - max-width: 530px; - padding: 40px; - color: lighten($midgrey, 15%); - background: darken($darkgrey, 5%); - border-radius: 2px; - - @media (max-width: 400px) { - padding: 15px; - } - - header { - margin-bottom: 30px; - } - - label { - // width: 90px; - color: $lightgrey; - font-weight: 300; - - @media (max-width: 550px) { - width: 100%; - } - } - - // .form-group { - // padding-left: 110px; - - // @media (max-width: 550px) { - // padding-left: 0; - // } - // } - - input { - // width: 300px; - padding: 7px; - border: none; - color: #fff; - background: lighten($darkgrey, 10%); - @include transition(background ease 0.25s); - - // @media (max-width: 550px) { - // width: 100%; - // } - - &:focus { - border:none; - background: lighten($darkgrey, 15%); - } - } - - // Chrome auto-fill style - input:-webkit-autofill { - -webkit-box-shadow: 0 0 0px 1000px $lightgrey inset !important; - } - - h1 { - margin: 0; - font-weight: 200; - font-size: 26px; - color: $lightgrey; - - @media (max-width: 550px) { - font-size: 20px; - } - } - - h2 { - margin: 6px 0 0 0; - padding: 0; - border: none; - font-weight: 200; - font-size: 16px; - color: $midgrey; - - @media (max-width: 550px) { - font-size: 14px; - } - } - - p { - font-size: 12px; - line-height: 1.4em; - color: $midgrey; - } - - footer { - margin: 30px 0 5px 0; - } - - .button-add { - width: 100%; - padding: 0.9em 1.8em; - font-size: 13px; - } -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/layouts/users.scss b/ghost/admin/assets/sass/layouts/users.scss deleted file mode 100644 index 5c0b998a21..0000000000 --- a/ghost/admin/assets/sass/layouts/users.scss +++ /dev/null @@ -1,365 +0,0 @@ -/* - * Users screen styles - * - * Table of Contents - * - * Users - * User Profile - */ - - -/* ========================================================================== - Users - ========================================================================== */ - -.settings { - - .user-group-header { - margin-bottom: 0px; - padding-bottom: 20px; - border: 0 none; - border-bottom: 1px solid darken($lightbrown, 10%); - - h3 { - display: inline-block; - margin: 0; - color: $midbrown; - font-weight: normal; - font-size: 1.1em; - line-height: 1em; - } - - } - - .user-search { - display: inline-block; - float: right; - - label { - margin: 0; - } - - &:hover .user-search-input, - .user-search-input:focus { - width: 260px; - padding: 0 10px; - } - - .user-search-input { - width: 0px; - padding: 0; - border: none; - border-bottom: lighten($lightbrown, 2%) 1px solid; - @include transition(width 0.2s ease-in-out); - box-shadow: none; - } - - .search-icon { - @include icon($i-search, 1em, $midbrown); - } - } - - .users { - padding: 0px; - margin-top: 0px; - list-style: none; - } - - .user { - display: block; - width: 100%; - padding: 20px; - border: 0 none; - border-top: 1px solid $lightgrey; - - &:first-child { - border: none; - } - - .user-image { - display: inline-block; - width: 40px; - height: 40px; - margin-right: 17px; - vertical-align: middle; - background-color: $lightbrown; - border-radius: 20px; - - &.invite { - padding-top: 8px; - text-align: center; - @include icon($i-mail, 1em, $brown); - } - - img { - width: 40px; - height: 40px; - border-radius: 20px; - } - } - - .user-meta { - display: inline-block; - vertical-align: middle; - } - - .user-name { - margin: 0; - margin-top: 0.4em; - font-weight: 400; - font-size: 1.2em; - line-height: 1em; - } - - .user-last-seen { - line-height: 1em; - } - - } - - .user-actions-cog { - margin-right: 6px; - } - - .user-actions-menu { - top: 49px; - right: 69px; - width: 145px; - .delete { - &:hover { - background: $red; - } - } - } - - .user-role { - padding: 2px 8px; - float: right; - font-size: 0.8em; - color: #fff; - text-transform: uppercase; - - &.admin { - background-color: #DE523A; - } - &.editor { - background-color: #4A8CBD; - } - } - -/* ============================================================================= - User Profile - ============================================================================= */ - - .user-profile-header { - position: relative; - max-height: 400px; - overflow: hidden; - - // Gradient overlay - &:after { - content: ""; - position: absolute; - left: 0; - right: 0; - bottom: 0; - height: 110px; - @include linear-gradient( rgba(0,0,0,0), rgba(0,0,0,0.3) ); - } - } - - .cover-image { - display: block; - line-height: 0; - width: 100%; - height: auto; - min-height: 180px; - } - - .edit-cover-image { - position: absolute; - right: 35px; - bottom: 34px; - min-height: 34px; - height: 34px; - background: rgba(0,0,0,0.3); - border-radius: 0; - color: rgba(255,255,255,0.8); - z-index: 2; - border-radius: $rounded; - @include transition( - color 0.3s ease, - background 0.3s ease - ); - @media (max-width: 1000px) { - right: 15px; - } - - &:hover { - color: #fff; - background: rgba(0,0,0,0.5); - } - } - - .user-image + .form-group { - margin-top: 155px; - max-width: 500px; - @media (min-width: 651px) and (max-width: 1000px) { - width: calc(100% - 201px); - } - @media (min-width: 651px) { - min-width: 285px; - margin-top: 0; - top: -110px; - left: 40px; - } - @media (min-width: 1001px) { - width: calc(100% - 221px); - } - } - - .user-profile { - position: relative; - top: -110px; - z-index: 1; - @media (min-width: 651px) { - padding-left: 143px; - } - - fieldset { - padding: 0 40px; - } - - textarea { - min-width: 240px; - } - } - - fieldset.user-details-top { - - @media (max-width: 650px) { - margin-bottom: 10px; - } - - @media (min-width: 651px) { - margin-bottom: 0; - padding: 0; - p { - color: #fff; - } - } - - } - - @media (max-width: 550px) { - fieldset.user-details-top, - fieldset.user-details-bottom { - padding-left: 15px; - padding-right: 15px; - } - } - - .user-image { - display: block; - position: relative; - width: 126px; - height: 126px; - float: left; - margin-left: 34px; - margin-right: 20px; - text-align: center; - border-radius: 100%; - overflow: hidden; - padding: 3px; - background: #fff; - z-index: 2; - - margin-left: -104px; - - @media (max-width: 550px) { - margin-left: 0px; - } - - @media (min-width: 551px) and (max-width: 650px) { - margin-left: 20px; - } - - .img { - display: block; - width: 120px; - height: 120px; - background-size: cover; - background-position: center center; - border-radius: 100%; - } - - &:hover { - .edit-user-image { - opacity: 1; - } - } - } - - .edit-user-image { - @include position(absolute, 3px 3px 3px 3px); - border-radius: 100%; - width: calc(100% - 6px); - background: rgba(0,0,0,0.5); - opacity: 0; - color: #fff; - line-height: 120px; - text-transform: uppercase; - text-decoration: none; - @include transition(opacity 0.3s ease); - } - - @media (min-width: 651px) { - label[for='user-name'] { - visibility: hidden; - } - #user-name { - border-color: #fff; - font-size: 1.5rem; - padding: 3px 12px; - } - } - - .user-details-bottom { - padding: 0 40px; - @media (min-width: 651px) { - margin: -104px 0 0 0; - } - } - -} // .settings - -@media (max-width: 650px) { - .users-back { - display: none; - } -} - -@media (max-width: 650px) { - .page-actions .user-actions-cog { - padding: 7px 0; - min-height: 30px; - .icon-settings { - margin-left: 8px; - margin-right: 8px; - } - } - .settings .user-actions-menu { - top: 43px; - right: 66px; - } - .settings-content .user-settings-header { - height: 0; - padding: 0; - margin: 0; - border-bottom: 0; - } - .user-settings-header .title, - .settings-content .settings-user:before { - display: none; - } -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/animations.scss b/ghost/admin/assets/sass/modules/animations.scss deleted file mode 100644 index 061f874734..0000000000 --- a/ghost/admin/assets/sass/modules/animations.scss +++ /dev/null @@ -1,70 +0,0 @@ -/* - * Reusable keyframe animations - * - * Table of Contents - * - * Off-Canvas - * Fade In - * Fade Out - */ - - -/* ========================================================================== - Off-Canvas - ========================================================================== */ - -@include keyframes(off-canvas) { - from { - opacity: 0; - } - to { - opacity: 1; - } -} - - -/* ========================================================================== - Fade In - TODO: Make the fadeIn keyframe name hyphenated, not camelCase - ========================================================================== */ - -@include keyframes(fade-in) { - from { - opacity: 0; - } - to { - opacity: 1; - } -} -.fade-in { - -o-animation: fade-in 1s; - -moz-animation: fade-in 1s; - -webkit-animation: fade-in 1s; - animation: fade-in 1s; -} - -@include keyframes(fade-in-snap) { - to { - opacity: 1; - } -} - -/* ========================================================================== - Fade Out - TODO: Make the fadeIn keyframe name hyphenated, not camelCase - ========================================================================== */ - -@include keyframes(fade-out) { - from { - opacity: 1; - } - to { - opacity: 0; - } -} -.fade-out { - -o-animation: fade-out 0.5s; - -moz-animation: fade-out 0.5s; - -webkit-animation: fade-out 0.5s; - animation: fade-out 0.5s; -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/base.scss b/ghost/admin/assets/sass/modules/base.scss deleted file mode 100644 index a1f5a9ea67..0000000000 --- a/ghost/admin/assets/sass/modules/base.scss +++ /dev/null @@ -1,73 +0,0 @@ -/* - * Global styles for Ghost which are used throughout the admin interface - * Utility classes defined here to keep other libraries (Normalize) from - * being modified, preventing upgrade later. - * - * Table of Contents - * - * Box Sizing - * Text Selection - * Colour Classes - * Focus Styles - */ - -/* ========================================================================== - Box Sizing - --- - Apple `border-box` globally - ========================================================================== */ - -*, -*:before, -*:after { - @include box-sizing(border-box); -} - - -/* ========================================================================== - Text Selection - --- - These colours do not differ much from browser defaults, but - this makes it consistent & predicable. - ========================================================================== */ - -::-moz-selection { - color: $darkgrey; - background: lighten($blue, 20%); - text-shadow: none; -} - -::selection { - color: $darkgrey; - background: lighten($blue, 20%); - text-shadow: none; -} - - -/* ========================================================================== - Color Classes - --- - Pragmatically generate classes for background & text colour, based on - `$list-colours` in `variables.scss` - ========================================================================== */ - -@each $colour in $list-colours { - .#{nth($colour, 1)}-bg { - background: nth($colour, 2); - } - .#{nth($colour, 1)} { - color: nth($colour, 2); - } -} - - -/* ========================================================================== - Focus Styles - --- - These are applied globally, to everything except images - ========================================================================== */ - -*:not(img):focus { - outline: 0; - outline-width: 0; -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/buttons.scss b/ghost/admin/assets/sass/modules/buttons.scss deleted file mode 100644 index b945b38646..0000000000 --- a/ghost/admin/assets/sass/modules/buttons.scss +++ /dev/null @@ -1,415 +0,0 @@ -/* - * Button classes, including - * - * Table of Contents - * - * Button Reset - * Buttons - * Split Buttons - */ - - - /* ========================================================================== - Button Reset - ========================================================================== */ - -button { - border: 0; - padding: 0; - background: transparent; - @include transition(all 0.15s ease-in-out); -} - - - /* ========================================================================== - Buttons - ========================================================================== */ - -%btn { - min-height: 35px; - width: auto; - display: inline-block; - padding: 0.9em 1.37em; - - text-decoration: none; - color: #fff; - font-size: 11px; // Hack because Firefox sucks. - line-height: 13px; // Hack because Firefox sucks. - font-weight: 300; - text-align: center; - letter-spacing: 1px; - text-transform: uppercase; - - text-shadow: none; - border-radius: 0.2em; - border: rgba(0,0,0,0.05) 0.1em solid; - - @include transition(background 0.3s ease, border-color 0.3s ease); - - &:hover, - &.hover, - &:focus { - will-change: border-color, background; - border-color: transparent; - background: #f8f8f8; - text-decoration: none; - } - - &:active { - box-shadow: rgba(0,0,0,0.3) 0 1px 3px inset; - } - - &:disabled { - opacity: 0.5; - } - - &.large { - padding: 1em 1.8em; - font-size: 14px; - line-height: 16px; - } - - // Styling for buttons with icons in them - &[class*='icon-'] { - position: relative; - padding-left: calc(1.37em + 36px); - &:before { - position: absolute; - top: 0; - left: 0; - bottom: 0; - width: 35px; - font-size: 13px; - line-height: 35px; - border-right: 1px solid rgba($darkgrey, 0.1); - opacity: 0.95; - } - - &.large { - padding-left: calc(1.8em + 46px); - &:before { - width: 46px; - line-height: 46px; - font-size: 17px; - } - } - - } - -} - -// Buttons that has an icon -[class*='button'] { - &[class*='has-icon'] { - padding-left: 0; - [class*='icon-'] { - margin-left: 11px; - margin-right: 4px; - &:before { - font-size: 0.9rem; - } - } - } - &.only-has-icon { - padding-right: 0; - [class*='icon-'] { - margin-right: 11px; - } - } -} - - -// This is the default button style -.button { -// button, -// input[type="button"] { - @extend %btn; - color:#777; - font-weight: normal; - background: #eee; - box-shadow: none; - &:hover, - &:focus { - border-color: rgba(0,0,0,0.1); - } -} - -.button-dark { - @extend %btn; - color: #fff; - font-weight: normal; - background: #A1ADB3; - box-shadow: none; - border-color: #A1ADB3; - &:hover, - &:focus { - border-color: darken(#A1ADB3, 10%); - background: darken(#A1ADB3, 10%); - } -} - -// Button for save/next/continue/confirm actions -.button-save { -// button[type="submit"], -// input[type="submit"] { - @extend %btn; - background: $blue; - box-shadow: none; - &:hover, - &:focus { - background: darken($blue, 10%); - } -} - -// Button for actions which add stuff -.button-add { -// button[type="submit"].button-add, -// input[type="submit"].button-add { - @extend %btn; - background: $green; - &:hover, - &:focus { - background: darken($green, 8%); - } -} - -// Button for deleting/removing stuff -.button-delete { -// button[type="reset"], -// input[type="reset"] { - @extend %btn; - background: $red; - box-shadow: none; - &:hover, - &:focus { - background: darken($red, 10%); - } -} - -// Alternative button with more visual attention, but no extra semantic meaning -.button-alt { - @extend %btn; - background: lighten($darkgrey, 10%); - &:hover, - &:focus { - background: $darkgrey; - } - &[class*='icon-']:before { - border-right-color: lighten($darkgrey, 10%); - } -} - -// Alternative button with more visual attention, but no extra semantic meaning -.button-info { - @extend %btn; - background: #A1ADB3; - &:hover, - &:focus { - background: lighten(#A1ADB3, 10%); - } -} - -// This applies normal link styles to de-emphasise a button -.button-link { - @extend %btn; - color: $blue; - background: transparent; - border: none; - &:hover, - &:focus { - background: transparent; - text-decoration: underline; - } -} - -// Back button for pane animations -.button-back { - @extend %btn; - position: absolute; - top: 20px; - left: 20px; - margin-right: 30px; - padding: 0.5em 1.37em 0.5em 1.10em; - display: none; - color: #fff; - background: $blue; - border: none; - border-top-left-radius: 0; - border-bottom-left-radius: 0; - - &:before { - content: ' '; - position: absolute; - top: 0; - left: -10px; - width: 0; - height: 0; - border-width: 18px 10px 18px 0; - border-color: transparent $blue transparent transparent; - border-style: solid solid solid none; - @include transform(scale(0.9999)); - @include transition(border-color 0.3s ease); - } - - &:hover, - &:focus { - color: #fff; - background: darken($blue, 10%); - border-color: darken($blue, 10%); - &:before { - border-right-color: darken($blue, 10%); - } - } - -} - - -/* ============================================================================= - Split Buttons - ============================================================================= */ - -%splitbtn { - display: inline-block; - position: relative; - font-size: 0; // hack to stop space after button - white-space: nowrap; - - button { - font-size: 11px; // hack to restore font size - @include border-right-radius(0); - } - - // This is the additional dropdown arrow, to the right of the button. - .options { - display: inline-block; - position:relative; - width: 35px; - height: 35px; - margin-left: -1px; - vertical-align: top; - text-align: center; - color: #fff; - background: #e5e5e5; - border-radius: 0 2px 2px 0; - border-left: 0; - box-shadow: - rgba(0,0,0,0.02) 0 1px 0 inset, - rgba(0,0,0,0.02) -1px 0 0 inset, - rgba(0,0,0,0.02) 0 -1px 0 inset; - - @include icon($i-chevron-down, 9px) { - position: absolute; - top: 50%; - right: 50%; - margin-top: -3px; - margin-right: -5px; - @include transition(margin-top 0.3s ease); - /* Transition of transform properties are split out due to a - defect in the vendor prefixing of transform transitions. - See: http://github.com/thoughtbot/bourbon/pull/86 */ - @include transition-property(transform); - @include transition-duration(0.3); - @include transition-timing-function(ease); - }; - - @include transition(background-color 0.3s linear); - - // Keep the arrow spun when the associated menu is open - &.active:before { - @include transform(rotate(360deg)); - } - - &.up.active:before { - margin-top:-4px; - @include transform(rotate(540deg)); - } - - // Spin the arrow on hover and while menu is open - &:hover, - &:focus { - will-change: box-shadow, background; - box-shadow: none; - background: #f8f8f8; - @include icon($i-chevron-down) { - will-change: transform; - @include transform(rotate(360deg)); - }; - } - - // If it has a class of "up" spin it an extra 180degress to point up - &.up:hover, - &.up:focus { - @include icon($i-chevron-down) { - margin-top:-4px; - @include transform(rotate(540deg)); - @include transition-property(transform); - @include transition-duration(0.6); - @include transition-timing-function(ease); - }; - } - } -} - -// The default splitbutton -.splitbutton { - @extend %splitbtn; - .options { - color:#777; - &:hover, - &:focus { - box-shadow: - rgba(0,0,0,0.07) 0 1px 0 inset, - rgba(0,0,0,0.07) -1px 0 0 inset, - rgba(0,0,0,0.07) 0 -1px 0 inset; - } - } -} - -// For save/next/continue/confirm actions -.splitbutton-save { - @extend %splitbtn; - .options { - background: darken($blue, 5%); - &:hover, - &.active, - &:focus { - background: darken($blue, 10%); - } - } -} - -// For actions which add something -.splitbutton-add { - @extend %splitbtn; - .options { - background: darken($green, 6%); - &:hover, - &:focus { - background: darken($green, 8%); - } - } -} - -// For actions which delete something -.splitbutton-delete { - @extend %splitbtn; - .options { - background: darken($red, 6%); - &:hover, - &:focus { - background: darken($red, 10%); - } - } -} - -// Alternative style with more visual attention, but no extra semantic meaning -.splitbutton-alt { - @extend %splitbtn; - .options { - background: lighten($darkgrey, 4%); - &:hover, - &:focus { - background: $darkgrey; - } - } -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/dropdowns.scss b/ghost/admin/assets/sass/modules/dropdowns.scss deleted file mode 100644 index 96fe55e564..0000000000 --- a/ghost/admin/assets/sass/modules/dropdowns.scss +++ /dev/null @@ -1,160 +0,0 @@ -/* - * Dropdown classes, including default styles and section-specific styles - * - * Table of Contents - * - * Dropdowns - * Dropdown Show & Hide - * Menu - * Menu Positioning Options - */ - - - /* ========================================================================== - Dropdowns - ========================================================================== */ - -.dropdown { - @include icon-after($i-chevron-down, 8px) { - padding-left: 6px; - vertical-align: 0; - }; - - &.active { - color: $darkgrey; - @include icon-after($i-chevron-down, 8px); - } - -} // .dropdown - - - /* ========================================================================== - Dropdown Show & Hide - --- - Sadly !important is needed, to counteract the stringer selectors applying - a display property. - ========================================================================== */ - -.ghost-popover { - display: none !important; -} - -.ghost-popover.open { - display: block !important; -} - - - /* ========================================================================== - Menu - --- - This is the base menu extend used for styles on interaction menus - Default: Pop menu, chiclet bottom center. - ========================================================================== */ - -.menu { - display: inline-block; - position: absolute; - z-index: 960; - padding:6px 0; - border: none; - list-style: none; - color: $lightgrey; - background: $darkgrey; - border-radius: 3px; - box-shadow: rgba(0,0,0,0.5) 0 1px 15px; - - // The triangle chiclet that points to where the menu came from - // By default, this is bottom center. - &:before { - content: ""; - position: absolute; - bottom: -10px; - left: 50%; - margin-left: -10px; - border-width: 10px 10px 0 10px; - border-style: solid; - border-color: $darkgrey transparent; - display: block; - width: 0; - } // &:before - - // Stop :hover shadow from overflowing - li { - overflow: hidden; - } - - a, p { - display: block; - position: relative; - padding: 10px 25px 10px 35px; - border: none; - color: $lightgrey !important; // It's dirty, but it's needed. - text-transform: none; - text-decoration: none; - - &:hover { - background: $blue; - box-shadow: rgba(255,255,255,0.2) 0 1px 0 inset; - } - } // a, p - - // Add a check mark to the currently active menu item - .active a { - @include icon($i-check) { - position: absolute; - top: 14px; - left: 11px; - } - } - -} // .menu - - -/* ========================================================================== - Menu Positioning Options - --- - Combine above classes into one usable class - ========================================================================== */ - -// This extend moves the chiclet to the top, for menus which drop down. -.menu-drop { - @extend .menu; - &:before { - top: -10px; - bottom: auto; - border-width:0 10px 10px 10px; - } -} - -// Chiclet to the left, for menus appearing close to left edge of the screen. -.menu-left { - @extend .menu; - &:before { - left:10px; - margin-left:0; - } -} - -// Chiclet to the right, for menus appearing close to right edge of the screen. -.menu-right { - @extend .menu; - &:before { - left: auto; - right:10px; - margin-left:0; - } -} - -// Drop left, chiclet top left. -.menu-drop-left { - @extend .menu; - @extend .menu-drop; - @extend .menu-left; -} - -// Drop right, chiclet top right. -.menu-drop-right { - @extend .menu; - @extend .menu-drop; - @extend .menu-right; -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/floatingheaders.scss b/ghost/admin/assets/sass/modules/floatingheaders.scss deleted file mode 100644 index 7020878cb1..0000000000 --- a/ghost/admin/assets/sass/modules/floatingheaders.scss +++ /dev/null @@ -1,109 +0,0 @@ -/* - * Floating header styles - * - * Table of Contents - * - * Floating Headers - * Scroll Shadows - */ - - /* ========================================================================== - Floating Headers - ========================================================================== */ - -// Semi-opaque fixed-position headers - used on content/editor -.floatingheader { - position: absolute; - top: 0; - left: 0; - right: 0; - z-index: 400; - height: 40px; - padding: 6px 15px 14px; - text-transform: uppercase; - color: $brown; - //Transparent gradient to make bg fade out as it goes out the top. - @include linear-gradient(top, white 0%, white 25%, rgba(255,255,255,0.9) 100%, $fallback: transparent); - - // button, - .button { - display: inline-block; - font-size: 10px; - min-height: 20px; - height: 20px; - padding: 3px 4px; - vertical-align: top; - - &.button-back { - position: relative; - top: -2px; - left: 3px; - display: none; - padding: 0 6px 0 3px; - - &:active { - box-shadow: none; - } - - &:before { - left: -8px; - border-width: 10px 8px 10px 0; - } - - @media (max-width: 800px) { - display: inline-block; - } - } - } - - small { - font-size: 0.85em; - } - - a, - button { - color: $brown; - &:hover { - color: $darkgrey; - } - } - -} // .floatingheader - - - /* ========================================================================== - Scroll Shadows - --- - Special case, when scrolling, add shadows to content headers. - ========================================================================== */ - -.scrolling { - - .floatingheader { - box-shadow: - rgba(0,0,0,0.02) 0 1px 2px, - rgba(255, 255, 255, 0.5) 0 -1px 0 inset; - - &:before { - content: ""; - height: 40px; - width: 80%; - position: absolute; - bottom: 0; - left: 50%; - margin-left: -40%; - box-shadow: rgba(0,0,0,0.02) 0 2px 2px; - } - &:after { - content: ""; - height: 40px; - width: 30%; - position: absolute; - bottom: 0; - left: 50%; - margin-left: -15%; - box-shadow: rgba(0,0,0,0.02) 0 3px 3px; - } - } // .floatingheader - -} // .scrolling \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/forms.scss b/ghost/admin/assets/sass/modules/forms.scss deleted file mode 100644 index 4399b9e008..0000000000 --- a/ghost/admin/assets/sass/modules/forms.scss +++ /dev/null @@ -1,427 +0,0 @@ -/* - * Form styling, for inputs, selects, checkboxes, labels etc etc. - * - * Table of Contents - * - * Labels - * Form Wrapper - * Form Groups - * Fieldsets - * Legends - * Input, textarea & select - * Checkboxes - * Radio Buttons - * Select - */ - - -/* ========================================================================== - Labels - ========================================================================== */ - -%label { - display: block; - color: $darkgrey; - font-size: 1em; - font-weight: bold; -} - - -/* ========================================================================== - Form Wrapper - ========================================================================== */ - -form { - - label { - @extend %label; - } - -} // form - - -/* ========================================================================== - Form Groups - ========================================================================== */ - -.form-group { - position: relative; - margin-bottom: 1.6em; - width: 100%; - max-width: 500px; - p { - margin: 4px 0 0 0; - color: #B3B2A8; - } - - label { - margin-bottom: 4px; - } - - @media (max-width: 550px) { - max-width: 100%; - } - -} // .form-group - -// If the from group has an icon... -.form-group[class*='icon-'] { - #{$all-text-inputs} { - padding-left: 32px; - } - &:before { - position: absolute; - top: 50%; - left: 11px; - font-size: 0.9em; - margin-top: calc(-0.45em - 1px); - } -} // .thing[class*='icon-'] - -// Wrapper for - -

Include the date in your post URLs

- - ============================================================================= */ - -// Hide the default checkbox -input[type="checkbox"] { - @include position(absolute, 0 0 0 -9999px); -} - -// Turn the label element into a fake checkbox -.checkbox { - position: relative; - width: auto; - - // Create a tick, hidden by default - &:before { - content: ''; - position: absolute; - width: 10px; - height: 6px; - top: 6px; - left: 5px; - border: 2px solid #fff; - border-top: none; - border-right: none; - @include transform(rotate(-45deg)); - opacity: 0; - } - - // The background for the faux checkbox - &:after { - content: ''; - display: inline-block; - width: 20px; - height: 20px; - margin-right: 5px; - background: lighten($lightbrown, 5%); - border-radius: $rounded; - border: darken($lightbrown, 5%) 1px solid; - @include transition(all 0.2s ease); - } -} // .checkbox - -// Colour the checkbox correctly when checked -input[type='checkbox'] { - &:checked + .checkbox { - &:after { - background: $green; - border-color: lighten($green, 10%); - } - } -} - -input[type='checkbox'] { - - // When checkbox is checked, show the tick - &:checked + .checkbox:before { - opacity: 1; - } - - &:focus { - & + .checkbox { - &:after { - border: $brown 1px solid; - } - } - } // &:focus - - &:active { - & + .checkbox { - &:after { - background: $lightbrown; - } - } - } // &:active - -} // input[type='checkbox'] - - -/* ============================================================================= - Radio Buttons - --- -
- - - -

What does this thing mean?

-
- ============================================================================= */ - -// Hide the default checkbox -input[type="radio"] { - @include position(absolute, 0 0 0 -9999px); -} - -// Turn the label element into a fake checkbox -.gh-radio { - position: relative; - width: auto; - - // Create a circle, hidden by default - &:before { - content: ''; - position: absolute; - width: 10px; - height: 10px; - top: 5px; - left: 5px; - opacity: 0; - border-radius: 100%; - background: $green; - } - - // The background for the faux radio - &:after { - content: ''; - display: inline-block; - width: 20px; - height: 20px; - margin-right: 5px; - background: lighten($lightbrown, 5%); - border-radius: 100%; - border: $lightbrown 1px solid; - @include transition(all 0.2s ease); - } -} // .gh-radio - -input[type='radio'] { - - // When radio is checked, show the tick - &:checked + .gh-radio:before { - opacity: 1; - } - - &:focus { - & + .gh-radio { - &:after { - border: $brown 1px solid; - } - } - } // &:focus - -} // input[type='radio'] - - -/* ============================================================================= - Select Component - --- - - {{view Ember.Select - id="activeTheme" - name="general[activeTheme]" - content=themes - optionValuePath="content.name" - optionLabelPath="content.label" - value=activeTheme - selection=selectedTheme}} - - ============================================================================= */ - -.gh-select { - position: relative; - display: block; - overflow: hidden; - width: 100%; - max-width: 100%; - padding: 0; - border-width: 0; - - @include icon-after($i-chevron-down, 0.85em, $midbrown) { - @include position(absolute, 50% 0.8em null null); - margin-top: -0.5em; - pointer-events: none; - }; - - select { - appearance: none; - -webkit-appearance: none; - -moz-appearance: window; - text-indent: 0.01px; - text-overflow: ""; - background: #fff; - outline: none; - padding: 8px 10px; - line-height: normal; - - // This hides native gh-select button arrow in IE - &::-ms-expand { - display: none; - } - - // Hover style - Not used, but works - &:hover {} - - // Focus style - &:focus { - outline: none; - } - - // This hides focus around selected option in FF - &:-moz-focusring { - color: transparent; - text-shadow: 0 0 0 #000; - } - } // select -} // .gh-select - -// Firefox-specific size fixes -@-moz-document url-prefix() { - .gh-select { - border-width: 1px; - select { - padding: 7px 10px 7px 8px; - } - } -} // @-moz-document \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/icons.scss b/ghost/admin/assets/sass/modules/icons.scss deleted file mode 100644 index 8538a484a0..0000000000 --- a/ghost/admin/assets/sass/modules/icons.scss +++ /dev/null @@ -1,398 +0,0 @@ -/* - * Icon classes and utility mixins - * The icons are Pictos, by Drew Wilson - http://pictos.cc/ - * Icon-font is generated by http://icomoon.co - * - * Table of Contents - * - * @font-face rule - * The Icon (before) Mixin - * The Icon (after) Mixin - * Icon Variables - * Icon Class Styles - * Icon Classes - */ - - -/* ========================================================================== - @font-face rule - ========================================================================== */ - -@font-face { - font-family: 'GhostIcons'; - src:url('../fonts/icons.eot'); - src:url('../fonts/icons.eot?#iefix') format('embedded-opentype'), - url('../fonts/icons.woff') format('woff'), - url('../fonts/icons.ttf') format('truetype'), - url('../fonts/icons.svg#icons') format('svg'); - font-weight: normal; - font-style: normal; -} - - -/* ========================================================================== - The Icon (before) Mixin - ========================================================================== */ - -@mixin icon($char, $size: '', $color: '') { - &:before { - // Base - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform:none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - - //Function - content: '#{$char}'; - @if $size != '' { - font-size: $size; - } - @if $color != '' { - color: $color; - } - @content; - } - - &:hover { - text-decoration:none; - } -} - -/* ========================================================================== - The Icon (after) Mixin - ========================================================================== */ - -@mixin icon-after($char, $size: '', $color: '') { - &:after { - // Base - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform:none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - - // Function - content: '#{$char}'; - @if $size != '' { - font-size: $size; - } - @if $color != '' { - color: $color; - } - @content; - } - - &:hover { - text-decoration:none; - } -} - - - - -/* ========================================================================== - Icon Variables - --- - For accessibility, icon characters in the icon font are stored in Unicode's - Private Use Area characters. This means that screen readers won't attempt to - read them out loud. For code maintainability, we then store these Unicode - references inside Sass variables. - ========================================================================== */ - -// Placeholder -$i: \e018; - -// Icons -$i-ghost: \e000; -$i-ghost-logo: \e600; -$i-chevron-down: \e001; -$i-users: \e002; -$i-tag: \e003; -$i-tablet: \e004; -$i-menu: \e005; -$i-settings: \e006; -$i-search: \e007; -$i-search-left: \e008; -$i-rss: \e009; -$i-preview: \e00a; -$i-app: \e00b; -$i-pin: \e00c; -$i-pc: \e00d; -$i-pacman: \e00e; -$i-edit: \e00f; -$i-mobile: \e010; -$i-image: \e011; -$i-mail: \e012; -$i-list: \e013; -$i-info: \e014; -$i-home: \e015; -$i-grid: \e016; -$i-fullscreen: \e017; -$i-question: \e018; -$i-external: \e019; -$i-error: \e01a; -$i-comments: \e01b; -$i-close: \e01c; -$i-chevron: \e01d; -$i-chevron-left: \e11d; -$i-calendar: \e01e; -$i-archive: \e01f; -$i-services: \e020; -$i-appearance: \e021; -$i-video: \e022; -$i-trash: \e023; -$i-reply: \e024; -$i-stats: \e025; -$i-featured: \e026; -$i-unfeatured: \e027; -$i-clock: \e028; -$i-settings2: \e029; -$i-camera: \e02a; -$i-power: \e02b; -$i-lock: \e02c; -$i-content: \e02d; -$i-user: \e02e; -$i-support: \e02f; -$i-success: \e030; -$i-notification: \e031; -$i-add: \e032; -$i-check: \e033; -$i-x: \e034; -$i-link: \e035; -$i-camera: \e036; -$i-repost: \e037; -$i-weather-rain: \e038; -$i-weather-sun: \e039; -$i-weather-partial: \e03a; -$i-weather-snow: \e03b; -$i-weather-cloudy: \e03c; -$i-lightning: \e03d; -$i-code: \e03e; - - -/* ========================================================================== - Icon Class Styles - ========================================================================== */ - -[class*=icon-] { - &:before { - // Base - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform:none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - } - - &:hover { - text-decoration: none; - } -} - - -/* ========================================================================== - Icon Classes - ========================================================================== */ - -.icon-ghost:before { - content: '#{$i-ghost}'; -} -.icon-ghost-logo:before { - content: '#{$i-ghost-logo}'; -} -.icon-chevron-down:before { - content: '#{$i-chevron-down}'; -} -.icon-users:before { - content: '#{$i-users}'; -} -.icon-tag:before { - content: '#{$i-tag}'; -} -.icon-tablet:before { - content: '#{$i-tablet}'; -} -.icon-menu:before { - content: '#{$i-menu}'; -} -.icon-settings:before { - content: '#{$i-settings}'; -} -.icon-search:before { - content: '#{$i-search}'; -} -.icon-search-left:before { - content: '#{$i-search-left}'; -} -.icon-rss:before { - content: '#{$i-rss}'; -} -.icon-preview:before { - content: '#{$i-preview}'; -} -.icon-app:before { - content: '#{$i-app}'; -} -.icon-pin:before { - content: '#{$i-pin}'; -} -.icon-pc:before { - content: '#{$i-pc}'; -} -.icon-pacman:before { - content: '#{$i-pacman}'; -} -.icon-edit:before { - content: '#{$i-edit}'; -} -.icon-mobile:before { - content: '#{$i-mobile}'; -} -.icon-image:before { - content: '#{$i-image}'; -} -.icon-mail:before { - content: '#{$i-mail}'; -} -.icon-list:before { - content: '#{$i-list}'; -} -.icon-info:before { - content: '#{$i-info}'; -} -.icon-home:before { - content: '#{$i-home}'; -} -.icon-grid:before { - content: '#{$i-grid}'; -} -.icon-fullscreen:before { - content: '#{$i-fullscreen}'; -} -.icon-question:before { - content: '#{$i-question}'; -} -.icon-external:before { - content: '#{$i-external}'; -} -.icon-error:before { - content: '#{$i-error}'; -} -.icon-comments:before { - content: '#{$i-comments}'; -} -.icon-close:before { - content: '#{$i-close}'; -} -.icon-chevron:before { - content: '#{$i-chevron}'; -} -.icon-chevron-left:before { - content: '#{$i-chevron-left}'; -} -.icon-calendar:before { - content: '#{$i-calendar}'; -} -.icon-archive:before { - content: '#{$i-archive}'; -} -.icon-services:before { - content: '#{$i-services}'; -} -.icon-appearance:before { - content: '#{$i-appearance}'; -} -.icon-video:before { - content: '#{$i-video}'; -} -.icon-trash:before { - content: '#{$i-trash}'; -} -.icon-reply:before { - content: '#{$i-reply}'; -} -.icon-stats:before { - content: '#{$i-stats}'; -} -.icon-featured:before { - content: '#{$i-featured}'; -} -.icon-unfeatured:before { - content: '#{$i-unfeatured}'; -} -.icon-clock:before { - content: '#{$i-clock}'; -} -.icon-settings2:before { - content: '#{$i-settings2}'; -} -.icon-camera:before { - content: '#{$i-camera}'; -} -.icon-power:before { - content: '#{$i-power}'; -} -.icon-lock:before { - content: '#{$i-lock}'; -} -.icon-content:before { - content: '#{$i-content}'; -} -.icon-user:before { - content: '#{$i-user}'; -} -.icon-support:before { - content: '#{$i-support}'; -} -.icon-success:before { - content: '#{$i-success}'; -} -.icon-notification:before { - content: '#{$i-notification}'; -} -.icon-add:before { - content: '#{$i-add}'; -} -.icon-check:before { - content: '#{$i-check}'; -} -.icon-x:before { - content: '#{$i-x}'; -} -.icon-link:before { - content: '#{$i-link}'; -} -.icon-camera:before { - content: '#{$i-camera}'; -} -.icon-repost:before { - content: '#{$i-repost}'; -} -.icon-weather-rain:before { - content: '#{$i-weather-rain}'; -} -.icon-weather-sun:before { - content: '#{$i-weather-sun}'; -} -.icon-weather-partial:before { - content: '#{$i-weather-partial}'; -} -.icon-weather-snow:before { - content: '#{$i-weather-snow}'; -} -.icon-weather-cloudy:before { - content: '#{$i-weather-cloudy}'; -} -.icon-lightning:before { - content: '#{$i-lightning}'; -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/layout.scss b/ghost/admin/assets/sass/modules/layout.scss deleted file mode 100644 index cfc8044627..0000000000 --- a/ghost/admin/assets/sass/modules/layout.scss +++ /dev/null @@ -1,122 +0,0 @@ -/* - * Generic layout classes, applying both structure and visual design - * - * Table of Contents - * - * Globals - * Helpers - * Floats - * Table Layout - * Box - * Main - */ - - -/* ========================================================================== - Globals - ========================================================================== */ - -body { - width: 100%; - background: $lightbrown; -} - - -/* ========================================================================== - Helpers - ========================================================================== */ - -.clearfix { - @include clearfix; -} - -.wrapper { - position: relative; -} - - -/* ========================================================================== - Floats - ========================================================================== */ - -.right { - float: right; -} -.left { - float: left; -} - - -/* ========================================================================== - Table Layout - ========================================================================== */ - -.vertical { - display: table-cell; - vertical-align: middle; -} - - -/* ========================================================================== - Box - ========================================================================== */ - -.box { - padding: 15px; - margin-bottom: 15px; - background: #fff; - position: relative; - box-shadow: $shadow; - - header { - height:14px; - border-bottom: 1px solid $lightbrown; - padding-bottom: 15px; - margin-bottom: 15px; - text-transform: uppercase; - font-size:0.85em; - color: $brown; - } - - footer { - height:14px; - border-top: 1px solid $lightbrown; - padding-top: 10px; - margin-top:15px; - text-transform: uppercase; - font-size:0.85em; - color: $brown; - } - - header a, - footer a { - color:$brown; - &:hover { - color:$darkgrey; - text-decoration: none; - } - } -} - - -/* ========================================================================== - Main - --- - Make t/r/b/l values variables where needed - ========================================================================== */ - -main { - position: absolute; - top: 55px; - right: 15px; - bottom: 0; - left: 15px; - padding: 0; - - @media (max-width: 400px) { - top: 40px; - left: 0; - right: 0; - } - -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/modals.scss b/ghost/admin/assets/sass/modules/modals.scss deleted file mode 100644 index 7cc512e120..0000000000 --- a/ghost/admin/assets/sass/modules/modals.scss +++ /dev/null @@ -1,149 +0,0 @@ -/* - * Modals styles - * - * Table of Contents - * - * Modal Container - */ - - -/* ========================================================================== - Modal Container - ========================================================================== */ - -#modal-container { // TODO: This should probably not be an ID - display: none; - position: fixed; - top: 0; - bottom: 0; - left: 0; - right: 0; - overflow-x: auto; - overflow-y: scroll; - z-index: 1040; - @include transition(all 0.15s linear 0s); - @include transform(translateZ(0)); -} - -.fade { - opacity: 0; - @include transition(opacity 0.2s linear 0s); - @include transform(translateZ(0)); - - &.in { - opacity: 1; - } -} - -.modal-background { - display: none; - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0; - background: rgba(0,0,0,0.6); - z-index: 1030; -} - -.modal { - left: 50%; - right: auto; - width: 450px; - margin-left: auto; - margin-right: auto; - padding-top: 30px; - padding-bottom: 30px; - z-index: 1050; - pointer-events: auto; - - @media (max-width: 800px) { - width: auto; - padding: 10px; - }; - - button { - min-width: 100px; - } - - @media (max-width: 800px) { - width: 100%; - margin-left: 0; - } - - // Uploaders - .image-uploader, - .pre-image-uploader { - margin: 0; - } -} - -.modal-action { - @extend .modal; - padding: 60px 0 30px; - - @media (max-width: 800px) { - padding: 30px 0; - } -} - -.modal-content { - position: relative; - padding: 18px; - background-clip: padding-box; - background-color: #FFFFFF; - border-radius: $rounded; - box-shadow: rgba(0,0,0,0.2) 0 0 0 6px; - - .close { - position: absolute; - top: 19px; - right: 19px; - width: 16px; - padding: 0; - margin: 0; - border: none; - z-index: 9999; - - @include icon($i-close, 1.4rem, $midgrey) { - @include transition(color 0.3s linear); - }; - &:hover:before { - color: $grey; - } - } -} -.modal-header { - position: relative; - - h1 { - display: inline-block; - margin: 0; - font-size: 1.85em; - font-weight: 100; - } -} - -.modal-body { - position: relative; - overflow-y: auto; -} - -.modal-footer { - margin-top: 20px; - .reject-button-class { - @extend .button; - } -} - -.modal-style-wide { - width: 550px; - - @media (max-width: 800px) { - width: 100%; - } -} - -.modal-style-centered { - text-align: center; -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/navbar.scss b/ghost/admin/assets/sass/modules/navbar.scss deleted file mode 100644 index 2b9c9f55dd..0000000000 --- a/ghost/admin/assets/sass/modules/navbar.scss +++ /dev/null @@ -1,380 +0,0 @@ -/* - * Navbar styling - * - * Table of Contents - * - * Ghost Logo - * Nav Bar - * Mobile Navigation - */ - - -/* ========================================================================== - Ghost Logo - ========================================================================== */ - -.ghost-logo { - @include icon($i-ghost) { - line-height: 0; - } - display: block; - float: left; - height: 40px; - padding: 12px 15px; - color: lighten($grey, 10%); - @include box-sizing(border-box); - - &:hover, - &:focus { - text-decoration: none; - } -} - -.ghost-logo:hover, -.ghost-logo:focus { - color: $lightgrey; - background: darken($darkgrey, 2%); -} - - -/* ========================================================================== - Nav Bar - ========================================================================== */ - -.navbar { - height: 40px; - font-size: 0.85em; - background: $darkgrey; - @media (max-width: 1000px) { - font-weight: normal; - } - - // The main navbar styles, apply to to everything. - nav { - - ul { - float: left; - border-left: $grey 1px solid; - border-top: none; - margin: 0; - padding: 0; - } - - li { - float: left; - font-size: 1em; - position: relative; - border-right: $grey 1px solid; - - a { - display: block; - height: 40px; - padding: 11px 15px; - border-bottom: none; - color: $midgrey; - text-transform: uppercase; - @include box-sizing(border-box); - } - - a:hover, - a:focus, - &.active a { - color: $lightgrey; - text-decoration: none; - position: relative; - background: darken($grey, 2%); - box-shadow: 0 -2px 2px rgba(0,0,0,0.2) inset; - } - - // Make a little arrow pointing up at the currently active menu item - &.active a:after { - content: ""; - position: absolute; - bottom: 0; - left: 50%; - margin-left: -5px; - border-width: 0 5px 5px 5px; - border-style: solid; - border-color: $lightbrown transparent; - display: block; - width: 0; - - @media (max-width: 400px) { - border-color: #fff transparent; - } - - } - - ul { - position: absolute; - top: 40px; - right: 0; - min-width: 200px; - background: $darkgrey; - } - - li { - width: 100%; - border-right: none; - } - - } - - // Add some icons to specific nav items - a:before { - margin-right: 5px; - } - .dashboard a { - @include icon($i-stats) { - vertical-align: -10%; - } - } - .content a { - @include icon($i-content); - } - .editor a { - @include icon($i-add); - } - .settings a { - @include icon($i-settings2); - } - - } //nav ul - - // Style any nav items which have dropdowns - .subnav { - position: relative; - - // The anchor which toggles the menu open/closed - > a { - @include icon-after($i-chevron-down, 8px) { - margin-left: 8px; - }; - - &.active { - color: $lightgrey; - background: darken($grey, 3%); - @include transition(none); - box-shadow: none; - } - } - - // The dropdown menu - ul { - display: none; - padding: 7px 0; - border-left: none; - position: absolute; - top: 40px; - left: -1px; - z-index: 800; - background: darken($grey, 3%); - box-shadow: rgba(0,0,0,0.2) 0 4px 6px; - } - - li { - list-style: none; - a { - color: $lightgrey; - - &:hover, - &:focus { - background: darken($darkgrey, 10%); - @include transition(none); - box-shadow: none; - } - - &:before { - margin-right: 1em; - } // space for icons - } - } - - .divider { - height: 1px; - margin: 7px 0; - overflow: hidden; - background: $grey; - } - - }//.subnav - -}//.navbar - -// The user menu in the top right corner of the screen -.usermenu.subnav { - position: absolute; - top: 0; - right: 0; - border-right: none; - border-left: $grey 1px solid; - - > a { - padding-left: 43px; //15px + 18px avatar + 10px - } - - .avatar { - height: 18px; - width: 18px; - border-radius: 50px; - position: absolute; - top: 11px; - left: 15px; - } - - > ul { - right: 0; - left: auto; - } - - //Add some icons to specific items - .usermenu-profile a { - @include icon($i-user); - } - .usermenu-help a { - @include icon($i-support, 1.1em); - } - .usermenu-shortcuts a { - @include icon($i-pc); - } - .usermenu-signout a { - @include icon($i-power); - } -} - - -/* ========================================================================== - Mobile Navigation - ========================================================================== */ - -// Yo dawg, I heard you like nav menus so I put nav menus in your nav menus -#global-header { - @media (max-width: 650px) { - - .ghost-logo { - @include icon($i-menu, 14px); - height: 40px; - width: 40px; - text-align: center; - padding:12px 0; - @include transition(margin-left 0.3s ease 0s); - .off-canvas & { - margin-left: 280px; - @include transition(margin-left 0.3s ease 0.1s); - } - } - - ul { - position: fixed; - overflow: auto; - top: 0; - right: auto; - bottom: 0; - left: -280px; - z-index: 980; - width: 280px; - padding-top: 40px; - font-weight:normal; - background: $darkgrey; - border-left: none; - @include transition(left 0.3s ease 0.2s); - .off-canvas & { - left: 0; - @include transition(left 0.3s ease 0s); - } - } - - li { - float: none; - border-right: none; - border-bottom: $grey 1px solid; - - a:hover, - a:focus, - &.active a { - box-shadow: none; - } - - &.active a:after { - display: none; - } - - a:before { - margin-right: 1em; - } - - ul { - position: static; - min-width: 0; - background: $darkgrey; - } - - li { - width: auto; - } - - } - - .usermenu { - position: fixed; - top: 0; - right: auto; - bottom: auto; - left: -280px; - height: 40px; - z-index: 990; - width: 279px; - border-left: none; - border-right: darken($grey, 7%) 1px solid; - border-bottom: darken($grey, 5%) 1px solid; - @include gradient(darken($darkgrey, 8%), darken($darkgrey, 3%)); - @include transition(left 0.3s ease 0.2s); - .off-canvas & { - left: 0; - @include transition(left 0.3s ease 0s); - } - > a { - &:hover, - &:focus { - background: inherit; - } - &.active { - background: darken($grey, 3%); - } - } - - > ul { - padding: 0; - box-shadow: none; - width: 100%; - font-weight: 300; - } - - .open { - box-shadow: rgba(0,0,0,0.4) 0 10px 20px; - } - - li { - border-bottom: darken($grey, 3%) 1px solid; - - a { - background: darken($grey, 3%); - - &:hover, - &:focus { - background: darken($grey, 8%); - } - &:before { - margin-right: 1em; - } // space for icons - } - - } - - .divider { - display: none; - } - - } - } -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/navs.scss b/ghost/admin/assets/sass/modules/navs.scss deleted file mode 100644 index 693065789f..0000000000 --- a/ghost/admin/assets/sass/modules/navs.scss +++ /dev/null @@ -1,42 +0,0 @@ -/* - * Navigation Menus - * - * Table of Contents - * - * Nav - */ - - -/* ========================================================================== - Nav - ========================================================================== */ - -nav { - ul { - list-style: none; - margin: 0; - padding: 0; - border-top: $lightbrown 1px solid; - } - - li { - a { - display: block; - padding: 10px 15px; - color: $brown; - border-bottom: $lightbrown 1px solid; - - &:hover, - &:focus { - color: $darkgrey; - background: $lightbrown; - text-decoration: none; - } - - &:before { - margin-right: 1em; - } // Make space for icons - - } - } -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/notifications.scss b/ghost/admin/assets/sass/modules/notifications.scss deleted file mode 100644 index 8a44ff8725..0000000000 --- a/ghost/admin/assets/sass/modules/notifications.scss +++ /dev/null @@ -1,130 +0,0 @@ -/* - * Button classes, including - * - * Table of Contents - * - * Buttons - * Split Buttons - */ - - - /* ========================================================================== - Notifications - ========================================================================== */ - -.notifications { - - @media (min-width: 401px) { - position: absolute; - bottom: 0; - left: 0; - z-index: 980; - width: 300px; - } - - @media (max-width: 400px) { - position: fixed; - top: 0; - left: 0; - right: 0; - z-index: 9999; - } -} - -.js-bb-notification { - @include transform(translateZ(0)); -} - -.notification { - @include icon($i-notification) { - position: absolute; - top: 0; - left: 0; - height: 100%; - width: 44px; - padding: 14px 15px; - text-align: center; - color: rgba(255,255,255,0.8); - background: rgba(0,0,0,0.1); - }; - width: 100%; - min-height: 40px; - max-height: 253px; - margin: 0 0 15px 0; - color: rgba(255,255,255,0.9); - background: $blue; - position: relative; - box-shadow: $shadow; - @include transform(translateZ(0)); - - @media (max-width: 400px) { - margin-bottom: 1px; - } - - .notification-message { - display: block; - padding: 10px 43px 10px 57px; - max-height: 253px; - overflow: auto; - } - - .close { - @include icon-after($i-close) { - padding: 6px; - position: absolute; - top: 8px; - right: 9px; - }; - color: rgba(255,255,255,0.6); - &:hover { - color: #fff; - } - - } - - a { - color: inherit; - text-decoration: underline; - } -} - -.notification-success { - @extend .notification; - @include icon($i-success); - background: $green; - - &.notification-passive { - @include animation(fade-out 1s linear); - @include animation-delay(3s); - @include animation-iteration-count(1); - @include animation-fill-mode(forwards); - } - - &.notification-passive:hover { - @include animation(fade-in-snap 0.2s linear); - } -} - -.notification-error { - @extend .notification; - @include icon($i-error); - background: $red; -} - - -.notification-warn { - @extend .notification; - @include icon($i-info); - background: $orange; -} - -.notification-info { - @extend .notification; - @include icon($i-info); - background: $blue; -} - -// Hide extra space taken up by update notification -.update-available main { - bottom: 56px; -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/nprogress.scss b/ghost/admin/assets/sass/modules/nprogress.scss deleted file mode 100644 index 6c2e7cae92..0000000000 --- a/ghost/admin/assets/sass/modules/nprogress.scss +++ /dev/null @@ -1,98 +0,0 @@ -/* - * NProgress styles - * - * Table of Contents - * - * NProgress - * Keyframes - */ - - /* ========================================================================== - NProgress - ========================================================================== */ - -/* Make clicks pass-through */ -#nprogress { - pointer-events: none; - -webkit-pointer-events: none; -} - -#nprogress .bar { - background: $blue; - - position: fixed; - z-index: 100; - top: 0; - left: 0; - - width: 100%; - height: 2px; -} - -/* Fancy blur effect */ -#nprogress .peg { - display: block; - position: absolute; - right: 0px; - width: 100px; - height: 100%; - box-shadow: 0 0 10px $blue, 0 0 5px $blue; - opacity: 1.0; - - -webkit-transform: rotate(3deg) translate(0px, -4px); - -moz-transform: rotate(3deg) translate(0px, -4px); - -ms-transform: rotate(3deg) translate(0px, -4px); - -o-transform: rotate(3deg) translate(0px, -4px); - transform: rotate(3deg) translate(0px, -4px); -} - -/* Remove these to get rid of the spinner */ -#nprogress .spinner { - display: block; - position: fixed; - z-index: 100; - top: 15px; - right: 15px; -} - -#nprogress .spinner-icon { - width: 14px; - height: 14px; - - border: solid 2px transparent; - border-top-color: $blue; - border-left-color: $blue; - border-radius: 10px; - - -webkit-animation: nprogress-spinner 400ms linear infinite; - -moz-animation: nprogress-spinner 400ms linear infinite; - -ms-animation: nprogress-spinner 400ms linear infinite; - -o-animation: nprogress-spinner 400ms linear infinite; - animation: nprogress-spinner 400ms linear infinite; -} - - -/* ========================================================================== - Keyframes - ========================================================================== */ - -@-webkit-keyframes nprogress-spinner { - 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } - 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } -} -@-moz-keyframes nprogress-spinner { - 0% { -moz-transform: rotate(0deg); transform: rotate(0deg); } - 100% { -moz-transform: rotate(360deg); transform: rotate(360deg); } -} -@-o-keyframes nprogress-spinner { - 0% { -o-transform: rotate(0deg); transform: rotate(0deg); } - 100% { -o-transform: rotate(360deg); transform: rotate(360deg); } -} -@-ms-keyframes nprogress-spinner { - 0% { -ms-transform: rotate(0deg); transform: rotate(0deg); } - 100% { -ms-transform: rotate(360deg); transform: rotate(360deg); } -} -@keyframes nprogress-spinner { - 0% { transform: rotate(0deg); transform: rotate(0deg); } - 100% { transform: rotate(360deg); transform: rotate(360deg); } -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/objectlist.scss b/ghost/admin/assets/sass/modules/objectlist.scss deleted file mode 100644 index d054671637..0000000000 --- a/ghost/admin/assets/sass/modules/objectlist.scss +++ /dev/null @@ -1,147 +0,0 @@ -/* - * Object list styles - * - * Table of Contents - * - * Object List - */ - - - /* ========================================================================== - Object List - ========================================================================== */ - -.invited-users { - margin-bottom: 34px; -} - -.object-list-title { - font-size: 13px; - font-weight: normal; - color: $midbrown; - margin-bottom: 14px; -} // .object-list-title - -.object-list-item { - - @media (max-width: 500px) { - display: block; - padding: 15px 0; - @include clearfix; - } - - @media (min-width: 501px) { - @include display(flex); - @include justify-content(start); - @include align-items(center); - padding: 0 15px; - } - - border-top: 1px solid $lightbrown; - min-height: 68px; - -} // .object-list-item - -a.object-list-item { - text-decoration: none; - &:hover { - background: lighten($lightbrown, 5%); - } - &:last-of-type:hover { - box-shadow: inset 0px -1px 0px $lightbrown; - } -} - -.object-list-item-icon { - width: 35px; - height: 35px; - display: block; - border-radius: 100%; - background: $lightbrown; - font-size: 0px; - color: transparent; - overflow: hidden; - position: relative; - &:before { - position: absolute; - top: 50%; - left: 0; - right: 0; - margin-top: -7px; - text-align: center; - color: $brown; - font-size: 14px; - } -} // .object-list-item-icon - -.object-list-item-figure { - width: 35px; - border-radius: 100%; - display: block; - border: 1px solid #979797; -} // .object-list-item-figure - -.object-list-item-icon, -.object-list-item-figure { - @media (max-width: 500px) { - float: left; - margin-right: 15px; - } -} - -.object-list-item-body { - - @include flex(1); - @include align-items(stretch); - - padding-left: 15px; - line-height: 1; - - @media (max-width: 500px) { - margin-top: 3px; - } - - .name { - display: inline-block; - font-size: 15px; - font-weight: 400; - color: $darkgrey; - } - .description { - display: inline-block; - font-size: 12px; - color: $midbrown; - margin-top: 3px; - } - -} // .object-list-item-body - -.object-list-item-aside { - @media (max-width: 500px) { - float: left; - width: 100%; - margin-top: 15px; - } - .object-list-action:not(:first-of-type) { - margin-left: 20px; - @media (min-width: 501px) { - margin-left: 50px; - } - } - .role-label { - float: left; - margin-top: -1px; - } - .role-label + .role-label { - margin-left: 5px; - } -} // .object-list-item-aside - -.object-list-action { - font-size: 11px; - text-transform: uppercase; - text-decoration: underline; - &:hover { - - } -} // .object-list-action \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/rolelables.scss b/ghost/admin/assets/sass/modules/rolelables.scss deleted file mode 100644 index e8d9b7960f..0000000000 --- a/ghost/admin/assets/sass/modules/rolelables.scss +++ /dev/null @@ -1,44 +0,0 @@ -/* - * Role Lable styles - * - * Table of Contents - * - * Role Labels - */ - - - /* ========================================================================== - Role Labels - ========================================================================== */ - -.role-label { - - background: #eee; - - display: inline-block; - padding: 6px 8px; - - color: rgba(0,0,0,0.5); - font-size: 9px; - line-height: 1; - text-transform: uppercase; - letter-spacing: 0.1em; - font-weight: 400; - - &.owner, &.admin, &.editor { - color: rgba(255,255,255,0.8); - } - - &.owner { - background: $darkgrey; - } - - &.admin { - background: $red; - } - - &.editor { - background: $blue; - } - -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/tables.scss b/ghost/admin/assets/sass/modules/tables.scss deleted file mode 100644 index a08c44c37e..0000000000 --- a/ghost/admin/assets/sass/modules/tables.scss +++ /dev/null @@ -1,87 +0,0 @@ -/* - * Table classes - * - * Table of Contents - * - * Base Styles - * Styles Tables - * Raw Tables - */ - - -/* ========================================================================== - Base Styles - ========================================================================== */ - -%table { - @include baseline; - width: 100%; - max-width: 100%; - background-color: transparent; - - th, - td { - padding: 8px; - line-height: 20px; - text-align: left; - vertical-align: middle; - } - -} - - -/* ========================================================================== - Styles Tables - ========================================================================== */ - -.table { - - @extend %table; - - th, - td { - border-top: 1px solid $lightbrown; - } - - th { - color: $brown; - } - - caption + thead tr:first-child th, - caption + thead tr:first-child td, - colgroup + thead tr:first-child th, - colgroup + thead tr:first-child td, - thead:first-child tr:first-child th, - thead:first-child tr:first-child td { - border-top: 0; - } - - tbody + tbody { - border-top: 2px solid $lightbrown; - } - - table table { - background-color: #fff; - } - - tbody > tr:nth-child(odd) > td, - tbody > tr:nth-child(odd) > th { - background-color: lighten($lightbrown, 5%); - } - - &.plain { - tbody > tr:nth-child(odd) > td, - tbody > tr:nth-child(odd) > th { - background: transparent; - } - } -} - - -/* ========================================================================== - Raw Tables - ========================================================================== */ - -table { - @extend %table; -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/typography.scss b/ghost/admin/assets/sass/modules/typography.scss deleted file mode 100644 index d45b2ea703..0000000000 --- a/ghost/admin/assets/sass/modules/typography.scss +++ /dev/null @@ -1,280 +0,0 @@ -/* - * Type styles, including headers, elements, links, and everything else. - * - * Table of Contents - * - * Global font sizing & colour - * Headings - * Heading Groups - * Generic Text Elements - * Code - * Keyboard - * Links - * Horizontal Rules - * Blockquotes - * Definition Lists - */ - - -/* ========================================================================== - Global font sizing & colour - ========================================================================== */ - -html { - font: normal 81.2%/1.65 "Open Sans", sans-serif; -} - -body { - color: $darkgrey; - font-weight: 300; -} - - -/* ========================================================================== - Headings - ========================================================================== */ - -h1, h2, h3, h4, h5, h6 { - color: $darkgrey; - text-rendering: optimizeLegibility; - line-height: 1; - margin-top: 0; -} - -h2 { - padding-top: 0.8em; - margin-top: 0.8em; - border-top: $lightbrown 1px solid; -} - -h1 a:hover { - text-decoration: none; - box-shadow: $blue 0 -5px 0 inset; -} - -h2 a:hover { - text-decoration: none; - box-shadow: $blue 0 -4px 0 inset; -} - -h3 a:hover { - text-decoration: none; - box-shadow: $blue 0 -3px 0 inset; -} - -h4, h5, h6 { - a:hover { - text-decoration: none; - box-shadow: $blue 0 -1px 0 inset; - } -} - - -/* ========================================================================== - Heading Groups - ========================================================================== */ - -hgroup { - @include baseline; - - h1, h2, h3, h4, h5, h6 { - padding:0; - margin:0; - border:none; - margin-bottom: 5px; - - a { - color: $darkgrey; - - &:hover { - box-shadow: $darkgrey 0 -1px 0 inset; - } - - } - - // Make everything except the first heading appear smaller/thinner. - &:nth-child(n+2) { - font-size: 1.8em; - font-weight: 300; - color: $brown; - } - - } - -} - - -/* ========================================================================== - Generic Text Elements - ========================================================================== */ - -p, ul, ol { - @include baseline; -} - -ol ol, -ul ul, -ul ol, -ol ul { - margin: 0.4em 0; -} - -mark { - background-color: #ffc336; -} - - -/* ========================================================================== - Code - ========================================================================== */ - -.markdown, -pre, -code, -tt { - font-family: $font-family-mono; -} - -code, tt { - font-size: 0.85em; - white-space: pre-wrap; - background: lighten($lightbrown, 2%); - border: 1px solid darken($lightbrown, 8%); - border-radius: 2px; - padding: 1px 3px; -} - -pre { - @include baseline; - background: lighten($lightbrown, 2%); - border: 1px solid darken($lightbrown, 8%); - width: 100%; - padding: 10px; - font-family: $font-family-mono; - font-size: 0.9em; - white-space: pre; - overflow: auto; - border-radius: 3px; - - code, tt { - font-size: inherit; - white-space: -moz-pre-wrap; - white-space: pre-wrap; - background: transparent; - border: none; - padding: 0; - } -} - - -/* ========================================================================== - Keyboard - ========================================================================== */ - -kbd { - display: inline-block; - margin-bottom: 0.4em; - padding: 1px 8px; - border: #ccc 1px solid; - color: $darkgrey; - text-shadow: #fff 0 1px 0; - font-size: 0.9em; - font-weight: bold; - background: #f4f4f4; - border-radius: 4px; - box-shadow: - 0 1px 0 rgba(0, 0, 0, 0.2), - 0 1px 0 0 #fff inset; -} - - -/* ========================================================================== - Links - ========================================================================== */ - -a { - color: $blue; - text-decoration: none; - @include transition(all 0.15s ease-in-out); - - &:hover { - text-decoration: underline; - } - - &.highlight { - color: $orange; - font-weight: bold; - } -} - - -/* ========================================================================== - Horizontal Rules - ========================================================================== */ - -hr { - display: block; - height: 1px; - border: 0; - border-top: 1px solid $lightbrown; - margin: 3.2em 0; - padding: 0; -} - - -/* ========================================================================== - Blockquotes - ========================================================================== */ - -blockquote { - @include baseline; - padding: 0 1.6em 0 1.6em; - border-left: $lightbrown 0.6em solid; - - p { - margin:0.8em 0; - font-size:1.2em; - font-weight: 300; - } - - small { - display: inline-block; - margin: 0.8em 0 0.8em 1.5em; - font-size:0.9em; - color: $brown; - &:before { - content: '\2014 \00A0'; - } - } - - cite { - font-weight:bold; - a { font-weight: normal; } - } -} - - -/* ========================================================================== - Definition Lists - ========================================================================== */ - -dl { - @include baseline; - - dt { - float: left; - width: 180px; - overflow: hidden; - clear: left; - text-align: right; - text-overflow: ellipsis; - white-space: nowrap; - font-weight: bold; - margin-bottom: 1em - } - - dd { - margin-left: 200px; - margin-bottom: 1em - } -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/uploader.scss b/ghost/admin/assets/sass/modules/uploader.scss deleted file mode 100644 index c197402a6a..0000000000 --- a/ghost/admin/assets/sass/modules/uploader.scss +++ /dev/null @@ -1,217 +0,0 @@ -/* - * Image Uploader styles - * - * Table of Contents - * - * Image Uploader - * Pre Image Uploader - */ - - -/* ========================================================================== - Image Uploader - ========================================================================== */ - -.image-uploader { - @include box-sizing(border-box); - @include baseline; - position: relative; - overflow:hidden; - padding: 55px 60px; - border: $lightbrown 3px dashed; - width: 100%; - height: auto; - text-align: center; - color: $brown; - background: #F9F8F5; - - a { - color: $brown; - text-decoration: none; - - &:hover { - color: $darkgrey; - } - } - .description { - margin-top: 10px; - } - .media { - @include icon($i-image, 60px, darken($lightbrown, 3%)) { - display: inline-block; - vertical-align: initial; - @include transition(transform 1s ease); - } - } - - .image-url, - .image-upload { - line-height: 12px; - padding: 10px; - display: block; - position: absolute; - bottom: 0; - left: 0; - color: $brown; - text-decoration: none; - @include user-select(none); - - &:hover { - cursor: pointer; - } - } - - .image-webcam { - @include icon($i-camera, 12px); - } - - .image-url { - @include icon($i-link, 12px); - } - - .image-upload { - @include icon($i-image, 12px); - } - - .button-add { - display: inline-block; - position:relative; - z-index: 700; - color: #fff; - padding-left:5px; - } - .button-save { - margin: 0 0 0 10px; - } - - input { - &.main{ - position: absolute; - right: 0; - margin: 0; - opacity: 0; - @include transform-origin(right); - @include transform( scale(14)); - font-size: 23px; - direction: ltr; - cursor: pointer; - &.right { - right: 9999px; - height: 0; - } - } - - &.url{ - font: -webkit-small-control; - box-sizing: border-box; - width: 276px; - vertical-align: middle; - padding: 9px 7px; - margin: 10px 0; - outline: 0; - font-size: 1.1em; - background: #fff; - border: #e3e1d5 1px solid; - border-radius: 4px; - -webkit-transition: all 0.15s ease-in-out; - -moz-transition: all 0.15s ease-in-out; - } - } - - .progress { - position: relative; - margin: -19px 0 44px 0; - display: block; - overflow: hidden; - @include linear-gradient(to bottom, #f5f5f5, #f9f9f9); - border-radius: 12px; - box-shadow: (rgba(0,0,0,0.1) 0 1px 2px inset); - } - - .fileupload-loading { - display: block; - top: 50%; - width: 35px; - height: 28px; - margin: -28px auto 0; - background-size: contain; - } - - .failed { - position: relative; - top: -40px; - font-size: 16px; - } - - .bar { - height: 12px; - background: $blue; - - &.fail { - background: $red; - } - } - -} // .image-uploader - - -/* ========================================================================== - Pre Image Uploader - ========================================================================== */ - -.pre-image-uploader { - @include box-sizing(border-box); - @include baseline; - position: relative; - overflow: hidden; - height: auto; - color: $brown; - background: rgba(0,0,0,0.1); - border-radius: 2px; - min-height: 46px; - - input { - position: absolute; - left: 9999px; - opacity: 0; - } - - a { - z-index: 10000; - color: $brown; - text-decoration: none; - - &:hover { - color: $darkgrey; - } - } - - img { - display: block; - max-width: 100%; - margin: 0 auto; - line-height: 0; - } - - .image-cancel { - @include icon($i-trash, 11px); - position: absolute; - top: 10px; - right: 10px; - padding: 8px; - z-index: 300; - color: #fff; - text-decoration: none; - line-height: 0; - border-radius: $rounded; - background: rgba(0,0,0,0.6); - box-shadow: rgba(255,255,255,0.2) 0 0 0 1px; - - &:hover { - color: #fff; - cursor: pointer; - background: $red; - } - } - -} // .pre-image-uploader \ No newline at end of file diff --git a/ghost/admin/assets/sass/modules/utility.scss b/ghost/admin/assets/sass/modules/utility.scss deleted file mode 100644 index 4509a6710c..0000000000 --- a/ghost/admin/assets/sass/modules/utility.scss +++ /dev/null @@ -1,45 +0,0 @@ -/* - * Utility classes that impose no visual design, only structural and semantic help - * - * Table of Contents - * - * Global font sizing & colour - * Headings - * Heading Groups - * Generic Text Elements - * Links - * Horizontal Rules - * Blockquotes - * Definition Lists - */ - - /* ========================================================================== - Utility Classes - ========================================================================== */ - -.invisible { - visibility: hidden; -} - -.hidden, -.visuallyhidden, -.screen-reader-text { - border: 0; - clip: rect(0 0 0 0); - height: 1px; - margin: -1px; - overflow: hidden; - padding: 0; - position: absolute; - width: 1px; -} - -.visuallyhidden.focusable:active, -.visuallyhidden.focusable:focus { - clip: auto; - height: auto; - margin: 0; - overflow: visible; - position: static; - width: auto; -} \ No newline at end of file diff --git a/ghost/admin/assets/sass/screen.scss b/ghost/admin/assets/sass/screen.scss index 4bb6c92666..fb809744fe 100644 --- a/ghost/admin/assets/sass/screen.scss +++ b/ghost/admin/assets/sass/screen.scss @@ -1,68 +1,32 @@ -/* - * Ground Zero - This is where it begins. - * Every Sass file is imported here - * - * Table of Contents - * - * Variables & Mixin Libraries - * Libraries - * Modules - * Layouts - */ - - -/* ========================================================================== - Variables & Mixins - ========================================================================== */ +// +// Helpers - Variables and mixins +// -------------------------------------------------- @import "_bourbon"; // via Bower http://bourbon.io/ @import "helpers/variables"; @import "helpers/mixins"; -/* ========================================================================== - Libraries - ========================================================================== */ +// +// Libraries - 3rd party dependencies +// -------------------------------------------------- @import "normalize"; // via Bower -/* ========================================================================== - Modules - ========================================================================== */ - -@import "modules/base"; -@import "modules/layout"; -@import "modules/utility"; -@import "modules/animations"; -@import "modules/icons"; -@import "modules/buttons"; -@import "modules/typography"; -@import "modules/tables"; -@import "modules/forms"; -@import "modules/floatingheaders"; -@import "modules/modals"; -@import "modules/dropdowns"; -@import "modules/notifications"; -@import "modules/objectlist"; -@import "modules/rolelables"; -@import "modules/uploader"; -@import "modules/navbar"; -@import "modules/navs"; -@import "modules/nprogress"; +// +// Patterns - Re-usable styles +// -------------------------------------------------- -/* ========================================================================== - Layouts - ========================================================================== */ -@import "layouts/auth"; -@import "layouts/about"; -@import "layouts/content"; -@import "layouts/editor"; -@import "layouts/errors"; -@import "layouts/modals"; -@import "layouts/post-settings-menu"; -@import "layouts/settings"; -@import "layouts/setup"; -@import "layouts/users"; +// +// Components - User interface objects +// -------------------------------------------------- + + + +// +// Layouts - Individual application screens +// -------------------------------------------------- + diff --git a/ghost/admin/docs/_includes/foot.html b/ghost/admin/docs/_includes/foot.html new file mode 100644 index 0000000000..7a9373e474 --- /dev/null +++ b/ghost/admin/docs/_includes/foot.html @@ -0,0 +1,13 @@ + +{% if site.github %} + +{% else %} + +{% endif %} +{% if site.github %} + +{% else %} + + + +{% endif %} \ No newline at end of file diff --git a/ghost/admin/docs/_includes/head.html b/ghost/admin/docs/_includes/head.html new file mode 100644 index 0000000000..6ebadb9e62 --- /dev/null +++ b/ghost/admin/docs/_includes/head.html @@ -0,0 +1,34 @@ + + + + + + {% if page.url == site.baseurl %} + {{ page.title }} + {% else %} + {{ page.title }} · Ghost + {% endif %} + + + +{% if site.github %} + +{% else %} + +{% endif %} + + +{% if site.github %} + +{% else %} + + +{% endif %} + + + + + + + + diff --git a/ghost/admin/docs/_includes/nav/global.html b/ghost/admin/docs/_includes/nav/global.html new file mode 100644 index 0000000000..e69de29bb2 diff --git a/ghost/admin/docs/_layouts/default.html b/ghost/admin/docs/_layouts/default.html index 12875aa55d..a053056d5a 100644 --- a/ghost/admin/docs/_layouts/default.html +++ b/ghost/admin/docs/_layouts/default.html @@ -1,30 +1,20 @@ - + - - {{ page.title }} - - - - - - + + {% include head.html %} +Skip to main content - + +{% include nav/global.html %} + +
{{content}} - +
+ +{% include foot.html %} \ No newline at end of file diff --git a/ghost/admin/docs/dist/css/ghost-ui.css b/ghost/admin/docs/dist/css/ghost-ui.css index bf6141698e..804a590730 100644 --- a/ghost/admin/docs/dist/css/ghost-ui.css +++ b/ghost/admin/docs/dist/css/ghost-ui.css @@ -1,56 +1,3 @@ -/* - * Ground Zero - This is where it begins. - * Every Sass file is imported here - * - * Table of Contents - * - * Variables & Mixin Libraries - * Libraries - * Modules - * Layouts - */ -/* ========================================================================== - Variables & Mixins - ========================================================================== */ -/* - * Variables used in Ghost-UI - * - * Table of Contents - * - * Misc Default Values - * Pixel Densities - * Colours - * Typography - */ -/* ========================================================================== - Misc Default Values - ========================================================================== */ -/* ========================================================================== - Pixel Densities - ========================================================================== */ -/* ========================================================================== - Colours - ========================================================================== */ -/* ========================================================================== - Typography - ========================================================================== */ -/* - * Mixins - * - * Table of Contents - * - * Baseline - * Gradients - */ -/* ========================================================================== - Baseline - ========================================================================== */ -/* ========================================================================== - Gradients - ========================================================================== */ -/* ========================================================================== - Libraries - ========================================================================== */ /* ========================================================================== Normalize.scss settings ========================================================================== */ @@ -421,5630 +368,3 @@ table { td, th { padding: 0; } - -/* ========================================================================== - Modules - ========================================================================== */ -/* - * Global styles for Ghost which are used throughout the admin interface - * Utility classes defined here to keep other libraries (Normalize) from - * being modified, preventing upgrade later. - * - * Table of Contents - * - * Box Sizing - * Text Selection - * Colour Classes - * Focus Styles - */ -/* ========================================================================== - Box Sizing - --- - Apple `border-box` globally - ========================================================================== */ -*, -*:before, -*:after { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; } - -/* ========================================================================== - Text Selection - --- - These colours do not differ much from browser defaults, but - this makes it consistent & predicable. - ========================================================================== */ -::-moz-selection { - color: #242628; - background: #b3d5f3; - text-shadow: none; } - -::selection { - color: #242628; - background: #b3d5f3; - text-shadow: none; } - -/* ========================================================================== - Color Classes - --- - Pragmatically generate classes for background & text colour, based on - `$list-colours` in `variables.scss` - ========================================================================== */ -.darkgrey-bg { - background: #242628; } - -.darkgrey { - color: #242628; } - -.grey-bg { - background: #35393b; } - -.grey { - color: #35393b; } - -.midgrey-bg { - background: #7d878a; } - -.midgrey { - color: #7d878a; } - -.lightgrey-bg { - background: #e2edf2; } - -.lightgrey { - color: #e2edf2; } - -.brown-bg { - background: #aaa9a2; } - -.brown { - color: #aaa9a2; } - -.midbrown-bg { - background: #c0bfb6; } - -.midbrown { - color: #c0bfb6; } - -.lightbrown-bg { - background: #edece4; } - -.lightbrown { - color: #edece4; } - -.blue-bg { - background: #5ba4e5; } - -.blue { - color: #5ba4e5; } - -.red-bg { - background: #e25440; } - -.red { - color: #e25440; } - -.orange-bg { - background: #f2a925; } - -.orange { - color: #f2a925; } - -.green-bg { - background: #9fbb58; } - -.green { - color: #9fbb58; } - -/* ========================================================================== - Focus Styles - --- - These are applied globally, to everything except images - ========================================================================== */ -*:not(img):focus { - outline: 0; - outline-width: 0; } - -/* - * Generic layout classes, applying both structure and visual design - * - * Table of Contents - * - * Globals - * Helpers - * Floats - * Table Layout - * Box - * Main - */ -/* ========================================================================== - Globals - ========================================================================== */ -body { - width: 100%; - background: #edece4; } - -/* ========================================================================== - Helpers - ========================================================================== */ -.clearfix:after { - content: ""; - display: table; - clear: both; } - -.wrapper { - position: relative; } - -/* ========================================================================== - Floats - ========================================================================== */ -.right { - float: right; } - -.left { - float: left; } - -/* ========================================================================== - Table Layout - ========================================================================== */ -.vertical { - display: table-cell; - vertical-align: middle; } - -/* ========================================================================== - Box - ========================================================================== */ -.box, .entry-container .entry-title { - padding: 15px; - margin-bottom: 15px; - background: #fff; - position: relative; - box-shadow: rgba(0, 0, 0, 0.05) 0 1px 5px; } - .box header, .entry-container .entry-title header { - height: 14px; - border-bottom: 1px solid #edece4; - padding-bottom: 15px; - margin-bottom: 15px; - text-transform: uppercase; - font-size: 0.85em; - color: #aaa9a2; } - .box footer, .entry-container .entry-title footer { - height: 14px; - border-top: 1px solid #edece4; - padding-top: 10px; - margin-top: 15px; - text-transform: uppercase; - font-size: 0.85em; - color: #aaa9a2; } - .box header a, .entry-container .entry-title header a, - .box footer a, - .entry-container .entry-title footer a { - color: #aaa9a2; } - .box header a:hover, .entry-container .entry-title header a:hover, - .box footer a:hover, - .entry-container .entry-title footer a:hover { - color: #242628; - text-decoration: none; } - -/* ========================================================================== - Main - --- - Make t/r/b/l values variables where needed - ========================================================================== */ -main { - position: absolute; - top: 55px; - right: 15px; - bottom: 0; - left: 15px; - padding: 0; } - @media (max-width: 400px) { - main { - top: 40px; - left: 0; - right: 0; } } - -/* - * Utility classes that impose no visual design, only structural and semantic help - * - * Table of Contents - * - * Global font sizing & colour - * Headings - * Heading Groups - * Generic Text Elements - * Links - * Horizontal Rules - * Blockquotes - * Definition Lists - */ -/* ========================================================================== - Utility Classes - ========================================================================== */ -.invisible { - visibility: hidden; } - -.hidden, -.visuallyhidden, -.screen-reader-text { - border: 0; - clip: rect(0 0 0 0); - height: 1px; - margin: -1px; - overflow: hidden; - padding: 0; - position: absolute; - width: 1px; } - -.visuallyhidden.focusable:active, -.visuallyhidden.focusable:focus { - clip: auto; - height: auto; - margin: 0; - overflow: visible; - position: static; - width: auto; } - -/* - * Reusable keyframe animations - * - * Table of Contents - * - * Off-Canvas - * Fade In - * Fade Out - */ -/* ========================================================================== - Off-Canvas - ========================================================================== */ -@-webkit-keyframes off-canvas { - from { - opacity: 0; } - - to { - opacity: 1; } } -@-moz-keyframes off-canvas { - from { - opacity: 0; } - - to { - opacity: 1; } } -@keyframes off-canvas { - from { - opacity: 0; } - - to { - opacity: 1; } } -/* ========================================================================== - Fade In - TODO: Make the fadeIn keyframe name hyphenated, not camelCase - ========================================================================== */ -@-webkit-keyframes fade-in { - from { - opacity: 0; } - - to { - opacity: 1; } } -@-moz-keyframes fade-in { - from { - opacity: 0; } - - to { - opacity: 1; } } -@keyframes fade-in { - from { - opacity: 0; } - - to { - opacity: 1; } } -.fade-in { - -o-animation: fade-in 0.5s; - -moz-animation: fade-in 0.5s; - -webkit-animation: fade-in 0.5s; - animation: fade-in 0.5s; } - -@-webkit-keyframes fade-in-snap { - to { - opacity: 1; } } -@-moz-keyframes fade-in-snap { - to { - opacity: 1; } } -@keyframes fade-in-snap { - to { - opacity: 1; } } -/* ========================================================================== - Fade Out - TODO: Make the fadeIn keyframe name hyphenated, not camelCase - ========================================================================== */ -@-webkit-keyframes fade-out { - from { - opacity: 1; } - - to { - opacity: 0; } } -@-moz-keyframes fade-out { - from { - opacity: 1; } - - to { - opacity: 0; } } -@keyframes fade-out { - from { - opacity: 1; } - - to { - opacity: 0; } } -.fade-out { - -o-animation: fade-out 0.5s; - -moz-animation: fade-out 0.5s; - -webkit-animation: fade-out 0.5s; - animation: fade-out 0.5s; } - -/* - * Icon classes and utility mixins - * The icons are Pictos, by Drew Wilson - http://pictos.cc/ - * Icon-font is generated by http://icomoon.co - * - * Table of Contents - * - * @font-face rule - * The Icon (before) Mixin - * The Icon (after) Mixin - * Icon Variables - * Icon Class Styles - * Icon Classes - */ -/* ========================================================================== - @font-face rule - ========================================================================== */ -@font-face { - font-family: 'GhostIcons'; - src: url("../fonts/icons.eot"); - src: url("../fonts/icons.eot?#iefix") format("embedded-opentype"), url("../fonts/icons.woff") format("woff"), url("../fonts/icons.ttf") format("truetype"), url("../fonts/icons.svg#icons") format("svg"); - font-weight: normal; - font-style: normal; } -/* ========================================================================== - The Icon (before) Mixin - ========================================================================== */ -/* ========================================================================== - The Icon (after) Mixin - ========================================================================== */ -/* ========================================================================== - Icon Variables - --- - For accessibility, icon characters in the icon font are stored in Unicode's - Private Use Area characters. This means that screen readers won't attempt to - read them out loud. For code maintainability, we then store these Unicode - references inside Sass variables. - ========================================================================== */ -/* ========================================================================== - Icon Class Styles - ========================================================================== */ -[class*=icon-]:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; } -[class*=icon-]:hover { - text-decoration: none; } - -/* ========================================================================== - Icon Classes - ========================================================================== */ -.icon-ghost:before { - content: "\e000"; } - -.icon-ghost-logo:before { - content: "\e600"; } - -.icon-chevron-down:before { - content: "\e001"; } - -.icon-users:before { - content: "\e002"; } - -.icon-tag:before { - content: "\e003"; } - -.icon-tablet:before { - content: "\e004"; } - -.icon-menu:before { - content: "\e005"; } - -.icon-settings:before { - content: "\e006"; } - -.icon-search:before { - content: "\e007"; } - -.icon-search-left:before { - content: "\e008"; } - -.icon-rss:before { - content: "\e009"; } - -.icon-preview:before { - content: "\e00a"; } - -.icon-app:before { - content: "\e00b"; } - -.icon-pin:before { - content: "\e00c"; } - -.icon-pc:before { - content: "\e00d"; } - -.icon-pacman:before { - content: "\e00e"; } - -.icon-edit:before { - content: "\e00f"; } - -.icon-mobile:before { - content: "\e010"; } - -.icon-image:before { - content: "\e011"; } - -.icon-mail:before { - content: "\e012"; } - -.icon-list:before { - content: "\e013"; } - -.icon-info:before { - content: "\e014"; } - -.icon-home:before { - content: "\e015"; } - -.icon-grid:before { - content: "\e016"; } - -.icon-fullscreen:before { - content: "\e017"; } - -.icon-question:before { - content: "\e018"; } - -.icon-external:before { - content: "\e019"; } - -.icon-error:before { - content: "\e01a"; } - -.icon-comments:before { - content: "\e01b"; } - -.icon-close:before { - content: "\e01c"; } - -.icon-chevron:before { - content: "\e01d"; } - -.icon-chevron-left:before { - content: "\e11d"; } - -.icon-calendar:before { - content: "\e01e"; } - -.icon-archive:before { - content: "\e01f"; } - -.icon-services:before { - content: "\e020"; } - -.icon-appearance:before { - content: "\e021"; } - -.icon-video:before { - content: "\e022"; } - -.icon-trash:before { - content: "\e023"; } - -.icon-reply:before { - content: "\e024"; } - -.icon-stats:before { - content: "\e025"; } - -.icon-featured:before { - content: "\e026"; } - -.icon-unfeatured:before { - content: "\e027"; } - -.icon-clock:before { - content: "\e028"; } - -.icon-settings2:before { - content: "\e029"; } - -.icon-camera:before { - content: "\e036"; } - -.icon-power:before { - content: "\e02b"; } - -.icon-lock:before { - content: "\e02c"; } - -.icon-content:before { - content: "\e02d"; } - -.icon-user:before { - content: "\e02e"; } - -.icon-support:before { - content: "\e02f"; } - -.icon-success:before { - content: "\e030"; } - -.icon-notification:before { - content: "\e031"; } - -.icon-add:before { - content: "\e032"; } - -.icon-check:before { - content: "\e033"; } - -.icon-x:before { - content: "\e034"; } - -.icon-link:before { - content: "\e035"; } - -.icon-camera:before { - content: "\e036"; } - -.icon-repost:before { - content: "\e037"; } - -.icon-weather-rain:before { - content: "\e038"; } - -.icon-weather-sun:before { - content: "\e039"; } - -.icon-weather-partial:before { - content: "\e03a"; } - -.icon-weather-snow:before { - content: "\e03b"; } - -.icon-weather-cloudy:before { - content: "\e03c"; } - -.icon-lightning:before { - content: "\e03d"; } - -/* - * Button classes, including - * - * Table of Contents - * - * Button Reset - * Buttons - * Split Buttons - */ -/* ========================================================================== - Button Reset - ========================================================================== */ -button { - border: 0; - padding: 0; - background: transparent; - -webkit-transition: all 0.15s ease-in-out; - -moz-transition: all 0.15s ease-in-out; - transition: all 0.15s ease-in-out; } - -/* ========================================================================== - Buttons - ========================================================================== */ -.button, .modal-footer .reject-button-class, .button-dark, .button-save, .button-add, .button-delete, .button-alt, .button-info, .button-link, .button-back { - min-height: 35px; - width: auto; - display: inline-block; - padding: 0.9em 1.37em; - text-decoration: none; - color: #fff; - font-size: 11px; - line-height: 13px; - font-weight: 300; - text-align: center; - letter-spacing: 1px; - text-transform: uppercase; - text-shadow: none; - border-radius: 0.2em; - border: rgba(0, 0, 0, 0.05) 0.1em solid; - -webkit-transition: background 0.3s ease, border-color 0.3s ease; - -moz-transition: background 0.3s ease, border-color 0.3s ease; - transition: background 0.3s ease, border-color 0.3s ease; } - .button:hover, .modal-footer .reject-button-class:hover, .button-dark:hover, .button-save:hover, .button-add:hover, .button-delete:hover, .button-alt:hover, .button-info:hover, .button-link:hover, .button-back:hover, .hover.button, .modal-footer .hover.reject-button-class, .hover.button-dark, .hover.button-save, .hover.button-add, .hover.button-delete, .hover.button-alt, .hover.button-info, .hover.button-link, .hover.button-back, .button:focus, .modal-footer .reject-button-class:focus, .button-dark:focus, .button-save:focus, .button-add:focus, .button-delete:focus, .button-alt:focus, .button-info:focus, .button-link:focus, .button-back:focus { - will-change: border-color, background; - border-color: transparent; - background: #f8f8f8; - text-decoration: none; } - .button:active, .modal-footer .reject-button-class:active, .button-dark:active, .button-save:active, .button-add:active, .button-delete:active, .button-alt:active, .button-info:active, .button-link:active, .button-back:active { - box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset; } - .button:disabled, .modal-footer .reject-button-class:disabled, .button-dark:disabled, .button-save:disabled, .button-add:disabled, .button-delete:disabled, .button-alt:disabled, .button-info:disabled, .button-link:disabled, .button-back:disabled { - opacity: 0.5; } - .large.button, .modal-footer .large.reject-button-class, .large.button-dark, .large.button-save, .large.button-add, .large.button-delete, .large.button-alt, .large.button-info, .large.button-link, .large.button-back { - padding: 1em 1.8em; - font-size: 14px; - line-height: 16px; } - [class*='icon-'].button, .modal-footer [class*='icon-'].reject-button-class, [class*='icon-'].button-dark, [class*='icon-'].button-save, [class*='icon-'].button-add, [class*='icon-'].button-delete, [class*='icon-'].button-alt, [class*='icon-'].button-info, [class*='icon-'].button-link, [class*='icon-'].button-back { - position: relative; - padding-left: calc(1.37em + 36px); } - [class*='icon-'].button:before, .modal-footer [class*='icon-'].reject-button-class:before, [class*='icon-'].button-dark:before, [class*='icon-'].button-save:before, [class*='icon-'].button-add:before, [class*='icon-'].button-delete:before, [class*='icon-'].button-alt:before, [class*='icon-'].button-info:before, [class*='icon-'].button-link:before, [class*='icon-'].button-back:before { - position: absolute; - top: 0; - left: 0; - bottom: 0; - width: 35px; - font-size: 13px; - line-height: 35px; - border-right: 1px solid rgba(36, 38, 40, 0.1); - opacity: 0.95; } - [class*='icon-'].large.button, .modal-footer [class*='icon-'].large.reject-button-class, [class*='icon-'].large.button-dark, [class*='icon-'].large.button-save, [class*='icon-'].large.button-add, [class*='icon-'].large.button-delete, [class*='icon-'].large.button-alt, [class*='icon-'].large.button-info, [class*='icon-'].large.button-link, [class*='icon-'].large.button-back { - padding-left: calc(1.8em + 46px); } - [class*='icon-'].large.button:before, .modal-footer [class*='icon-'].large.reject-button-class:before, [class*='icon-'].large.button-dark:before, [class*='icon-'].large.button-save:before, [class*='icon-'].large.button-add:before, [class*='icon-'].large.button-delete:before, [class*='icon-'].large.button-alt:before, [class*='icon-'].large.button-info:before, [class*='icon-'].large.button-link:before, [class*='icon-'].large.button-back:before { - width: 46px; - line-height: 46px; - font-size: 17px; } - -[class*='button'][class*='has-icon'] { - padding-left: 0; } - [class*='button'][class*='has-icon'] [class*='icon-'] { - margin-left: 11px; - margin-right: 4px; } - [class*='button'][class*='has-icon'] [class*='icon-']:before { - font-size: 0.9rem; } -[class*='button'].only-has-icon { - padding-right: 0; } - [class*='button'].only-has-icon [class*='icon-'] { - margin-right: 11px; } - -.button, .modal-footer .reject-button-class { - color: #777; - font-weight: normal; - background: #eee; - box-shadow: none; } - .button:hover, .modal-footer .reject-button-class:hover, .button:focus, .modal-footer .reject-button-class:focus { - border-color: rgba(0, 0, 0, 0.1); } - -.button-dark { - color: #fff; - font-weight: normal; - background: #A1ADB3; - box-shadow: none; - border-color: #A1ADB3; } - .button-dark:hover, .button-dark:focus { - border-color: #85949c; - background: #85949c; } - -.button-save { - background: #5ba4e5; - box-shadow: none; } - .button-save:hover, .button-save:focus { - background: #2f8cde; } - -.button-add { - background: #9fbb58; } - .button-add:hover, .button-add:focus { - background: #8ba644; } - -.button-delete { - background: #e25440; - box-shadow: none; } - .button-delete:hover, .button-delete:focus { - background: #cf3520; } - -.button-alt { - background: #3c4043; } - .button-alt:hover, .button-alt:focus { - background: #242628; } - .button-alt[class*='icon-']:before { - border-right-color: #3c4043; } - -.button-info { - background: #A1ADB3; } - .button-info:hover, .button-info:focus { - background: #bdc6ca; } - -.button-link { - color: #5ba4e5; - background: transparent; - border: none; } - .button-link:hover, .button-link:focus { - background: transparent; - text-decoration: underline; } - -.button-back { - position: absolute; - top: 20px; - left: 20px; - margin-right: 30px; - padding: 0.5em 1.37em 0.5em 1.10em; - display: none; - color: #fff; - background: #5ba4e5; - border: none; - border-top-left-radius: 0; - border-bottom-left-radius: 0; } - .button-back:before { - content: ' '; - position: absolute; - top: 0; - left: -10px; - width: 0; - height: 0; - border-width: 18px 10px 18px 0; - border-color: transparent #5ba4e5 transparent transparent; - border-style: solid solid solid none; - -webkit-transform: scale(0.9999); - -moz-transform: scale(0.9999); - -ms-transform: scale(0.9999); - -o-transform: scale(0.9999); - transform: scale(0.9999); - -webkit-transition: border-color 0.3s ease; - -moz-transition: border-color 0.3s ease; - transition: border-color 0.3s ease; } - .button-back:hover, .button-back:focus { - color: #fff; - background: #2f8cde; - border-color: #2f8cde; } - .button-back:hover:before, .button-back:focus:before { - border-right-color: #2f8cde; } - -/* ============================================================================= - Split Buttons - ============================================================================= */ -.splitbutton, .splitbutton-save, .splitbutton-add, .splitbutton-delete, .splitbutton-alt { - display: inline-block; - position: relative; - font-size: 0; - white-space: nowrap; } - .splitbutton button, .splitbutton-save button, .splitbutton-add button, .splitbutton-delete button, .splitbutton-alt button { - font-size: 11px; - border-top-right-radius: 0; - border-bottom-right-radius: 0; } - .splitbutton .options, .splitbutton-save .options, .splitbutton-add .options, .splitbutton-delete .options, .splitbutton-alt .options { - display: inline-block; - position: relative; - width: 35px; - height: 35px; - margin-left: -1px; - vertical-align: top; - text-align: center; - color: #fff; - background: #e5e5e5; - border-radius: 0 2px 2px 0; - border-left: 0; - box-shadow: rgba(0, 0, 0, 0.02) 0 1px 0 inset, rgba(0, 0, 0, 0.02) -1px 0 0 inset, rgba(0, 0, 0, 0.02) 0 -1px 0 inset; - -webkit-transition: background-color 0.3s linear; - -moz-transition: background-color 0.3s linear; - transition: background-color 0.3s linear; } - .splitbutton .options:before, .splitbutton-save .options:before, .splitbutton-add .options:before, .splitbutton-delete .options:before, .splitbutton-alt .options:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e001"; - font-size: 9px; - position: absolute; - top: 50%; - right: 50%; - margin-top: -3px; - margin-right: -5px; - -webkit-transition: margin-top 0.3s ease; - -moz-transition: margin-top 0.3s ease; - transition: margin-top 0.3s ease; - /* Transition of transform properties are split out due to a - defect in the vendor prefixing of transform transitions. - See: http://github.com/thoughtbot/bourbon/pull/86 */ - -webkit-transition-property: -webkit-transform; - -moz-transition-property: -moz-transform; - transition-property: transform; - -webkit-transition-duration: 0.3; - -moz-transition-duration: 0.3; - transition-duration: 0.3; - -webkit-transition-timing-function: ease; - -moz-transition-timing-function: ease; - transition-timing-function: ease; } - .splitbutton .options:hover, .splitbutton-save .options:hover, .splitbutton-add .options:hover, .splitbutton-delete .options:hover, .splitbutton-alt .options:hover { - text-decoration: none; } - .splitbutton .options.active:before, .splitbutton-save .options.active:before, .splitbutton-add .options.active:before, .splitbutton-delete .options.active:before, .splitbutton-alt .options.active:before { - -webkit-transform: rotate(360deg); - -moz-transform: rotate(360deg); - -ms-transform: rotate(360deg); - -o-transform: rotate(360deg); - transform: rotate(360deg); } - .splitbutton .options.up.active:before, .splitbutton-save .options.up.active:before, .splitbutton-add .options.up.active:before, .splitbutton-delete .options.up.active:before, .splitbutton-alt .options.up.active:before { - margin-top: -4px; - -webkit-transform: rotate(540deg); - -moz-transform: rotate(540deg); - -ms-transform: rotate(540deg); - -o-transform: rotate(540deg); - transform: rotate(540deg); } - .splitbutton .options:hover, .splitbutton-save .options:hover, .splitbutton-add .options:hover, .splitbutton-delete .options:hover, .splitbutton-alt .options:hover, .splitbutton .options:focus, .splitbutton-save .options:focus, .splitbutton-add .options:focus, .splitbutton-delete .options:focus, .splitbutton-alt .options:focus { - will-change: box-shadow, background; - box-shadow: none; - background: #f8f8f8; } - .splitbutton .options:hover:before, .splitbutton-save .options:hover:before, .splitbutton-add .options:hover:before, .splitbutton-delete .options:hover:before, .splitbutton-alt .options:hover:before, .splitbutton .options:focus:before, .splitbutton-save .options:focus:before, .splitbutton-add .options:focus:before, .splitbutton-delete .options:focus:before, .splitbutton-alt .options:focus:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e001"; - will-change: transform; - -webkit-transform: rotate(360deg); - -moz-transform: rotate(360deg); - -ms-transform: rotate(360deg); - -o-transform: rotate(360deg); - transform: rotate(360deg); } - .splitbutton .options:hover:hover, .splitbutton-save .options:hover:hover, .splitbutton-add .options:hover:hover, .splitbutton-delete .options:hover:hover, .splitbutton-alt .options:hover:hover, .splitbutton .options:focus:hover, .splitbutton-save .options:focus:hover, .splitbutton-add .options:focus:hover, .splitbutton-delete .options:focus:hover, .splitbutton-alt .options:focus:hover { - text-decoration: none; } - .splitbutton .options.up:hover:before, .splitbutton-save .options.up:hover:before, .splitbutton-add .options.up:hover:before, .splitbutton-delete .options.up:hover:before, .splitbutton-alt .options.up:hover:before, .splitbutton .options.up:focus:before, .splitbutton-save .options.up:focus:before, .splitbutton-add .options.up:focus:before, .splitbutton-delete .options.up:focus:before, .splitbutton-alt .options.up:focus:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e001"; - margin-top: -4px; - -webkit-transform: rotate(540deg); - -moz-transform: rotate(540deg); - -ms-transform: rotate(540deg); - -o-transform: rotate(540deg); - transform: rotate(540deg); - -webkit-transition-property: -webkit-transform; - -moz-transition-property: -moz-transform; - transition-property: transform; - -webkit-transition-duration: 0.6; - -moz-transition-duration: 0.6; - transition-duration: 0.6; - -webkit-transition-timing-function: ease; - -moz-transition-timing-function: ease; - transition-timing-function: ease; } - .splitbutton .options.up:hover:hover, .splitbutton-save .options.up:hover:hover, .splitbutton-add .options.up:hover:hover, .splitbutton-delete .options.up:hover:hover, .splitbutton-alt .options.up:hover:hover, .splitbutton .options.up:focus:hover, .splitbutton-save .options.up:focus:hover, .splitbutton-add .options.up:focus:hover, .splitbutton-delete .options.up:focus:hover, .splitbutton-alt .options.up:focus:hover { - text-decoration: none; } - -.splitbutton .options { - color: #777; } - .splitbutton .options:hover, .splitbutton .options:focus { - box-shadow: rgba(0, 0, 0, 0.07) 0 1px 0 inset, rgba(0, 0, 0, 0.07) -1px 0 0 inset, rgba(0, 0, 0, 0.07) 0 -1px 0 inset; } - -.splitbutton-save .options { - background: #4598e2; } - .splitbutton-save .options:hover, .splitbutton-save .options.active, .splitbutton-save .options:focus { - background: #2f8cde; } - -.splitbutton-add .options { - background: #91ae47; } - .splitbutton-add .options:hover, .splitbutton-add .options:focus { - background: #8ba644; } - -.splitbutton-delete .options { - background: #de3c25; } - .splitbutton-delete .options:hover, .splitbutton-delete .options:focus { - background: #cf3520; } - -.splitbutton-alt .options { - background: #2e3033; } - .splitbutton-alt .options:hover, .splitbutton-alt .options:focus { - background: #242628; } - -/* - * Type styles, including headers, elements, links, and everything else. - * - * Table of Contents - * - * Global font sizing & colour - * Headings - * Heading Groups - * Generic Text Elements - * Code - * Keyboard - * Links - * Horizontal Rules - * Blockquotes - * Definition Lists - */ -/* ========================================================================== - Global font sizing & colour - ========================================================================== */ -html { - font: normal 81.2%/1.65 "Open Sans", sans-serif; } - -body { - color: #242628; - font-weight: 300; } - -/* ========================================================================== - Headings - ========================================================================== */ -h1, h2, h3, h4, h5, h6 { - color: #242628; - text-rendering: optimizeLegibility; - line-height: 1; - margin-top: 0; } - -h2 { - padding-top: 0.8em; - margin-top: 0.8em; - border-top: #edece4 1px solid; } - -h1 a:hover { - text-decoration: none; - box-shadow: #5ba4e5 0 -5px 0 inset; } - -h2 a:hover { - text-decoration: none; - box-shadow: #5ba4e5 0 -4px 0 inset; } - -h3 a:hover { - text-decoration: none; - box-shadow: #5ba4e5 0 -3px 0 inset; } - -h4 a:hover, h5 a:hover, h6 a:hover { - text-decoration: none; - box-shadow: #5ba4e5 0 -1px 0 inset; } - -/* ========================================================================== - Heading Groups - ========================================================================== */ -hgroup { - margin: 1.6em 0; } - hgroup h1, hgroup h2, hgroup h3, hgroup h4, hgroup h5, hgroup h6 { - padding: 0; - margin: 0; - border: none; - margin-bottom: 5px; } - hgroup h1 a, hgroup h2 a, hgroup h3 a, hgroup h4 a, hgroup h5 a, hgroup h6 a { - color: #242628; } - hgroup h1 a:hover, hgroup h2 a:hover, hgroup h3 a:hover, hgroup h4 a:hover, hgroup h5 a:hover, hgroup h6 a:hover { - box-shadow: #242628 0 -1px 0 inset; } - hgroup h1:nth-child(n+2), hgroup h2:nth-child(n+2), hgroup h3:nth-child(n+2), hgroup h4:nth-child(n+2), hgroup h5:nth-child(n+2), hgroup h6:nth-child(n+2) { - font-size: 1.8em; - font-weight: 300; - color: #aaa9a2; } - -/* ========================================================================== - Generic Text Elements - ========================================================================== */ -p, ul, ol { - margin: 1.6em 0; } - -ol ol, -ul ul, -ul ol, -ol ul { - margin: 0.4em 0; } - -mark { - background-color: #ffc336; } - -/* ========================================================================== - Code - ========================================================================== */ -.markdown, -pre, -code, -tt { - font-family: Inconsolata, monospace; } - -code, tt { - font-size: 0.85em; - white-space: pre-wrap; - background: #f1f0ea; - border: 1px solid #dddbcc; - border-radius: 2px; - padding: 1px 3px; } - -pre { - margin: 1.6em 0; - background: #f1f0ea; - border: 1px solid #dddbcc; - width: 100%; - padding: 10px; - font-family: Inconsolata, monospace; - font-size: 0.9em; - white-space: pre; - overflow: auto; - border-radius: 3px; } - pre code, pre tt { - font-size: inherit; - white-space: -moz-pre-wrap; - white-space: pre-wrap; - background: transparent; - border: none; - padding: 0; } - -/* ========================================================================== - Keyboard - ========================================================================== */ -kbd { - display: inline-block; - margin-bottom: 0.4em; - padding: 1px 8px; - border: #ccc 1px solid; - color: #242628; - text-shadow: #fff 0 1px 0; - font-size: 0.9em; - font-weight: bold; - background: #f4f4f4; - border-radius: 4px; - box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2), 0 1px 0 0 white inset; } - -/* ========================================================================== - Links - ========================================================================== */ -a { - color: #5ba4e5; - text-decoration: none; - -webkit-transition: all 0.15s ease-in-out; - -moz-transition: all 0.15s ease-in-out; - transition: all 0.15s ease-in-out; } - a:hover { - text-decoration: underline; } - a.highlight { - color: #f2a925; - font-weight: bold; } - -/* ========================================================================== - Horizontal Rules - ========================================================================== */ -hr { - display: block; - height: 1px; - border: 0; - border-top: 1px solid #edece4; - margin: 3.2em 0; - padding: 0; } - -/* ========================================================================== - Blockquotes - ========================================================================== */ -blockquote { - margin: 1.6em 0; - padding: 0 1.6em 0 1.6em; - border-left: #edece4 0.6em solid; } - blockquote p { - margin: 0.8em 0; - font-size: 1.2em; - font-weight: 300; } - blockquote small { - display: inline-block; - margin: 0.8em 0 0.8em 1.5em; - font-size: 0.9em; - color: #aaa9a2; } - blockquote small:before { - content: '\2014 \00A0'; } - blockquote cite { - font-weight: bold; } - blockquote cite a { - font-weight: normal; } - -/* ========================================================================== - Definition Lists - ========================================================================== */ -dl { - margin: 1.6em 0; } - dl dt { - float: left; - width: 180px; - overflow: hidden; - clear: left; - text-align: right; - text-overflow: ellipsis; - white-space: nowrap; - font-weight: bold; - margin-bottom: 1em; } - dl dd { - margin-left: 200px; - margin-bottom: 1em; } - -/* - * Table classes - * - * Table of Contents - * - * Base Styles - * Styles Tables - * Raw Tables - */ -/* ========================================================================== - Base Styles - ========================================================================== */ -.table, table { - margin: 1.6em 0; - width: 100%; - max-width: 100%; - background-color: transparent; } - .table th, table th, - .table td, - table td { - padding: 8px; - line-height: 20px; - text-align: left; - vertical-align: middle; } - -/* ========================================================================== - Styles Tables - ========================================================================== */ -.table th, -.table td { - border-top: 1px solid #edece4; } -.table th { - color: #aaa9a2; } -.table caption + thead tr:first-child th, -.table caption + thead tr:first-child td, -.table colgroup + thead tr:first-child th, -.table colgroup + thead tr:first-child td, -.table thead:first-child tr:first-child th, -.table thead:first-child tr:first-child td { - border-top: 0; } -.table tbody + tbody { - border-top: 2px solid #edece4; } -.table table table { - background-color: #fff; } -.table tbody > tr:nth-child(odd) > td, -.table tbody > tr:nth-child(odd) > th { - background-color: #f7f7f3; } -.table.plain tbody > tr:nth-child(odd) > td, -.table.plain tbody > tr:nth-child(odd) > th { - background: transparent; } - -/* ========================================================================== - Raw Tables - ========================================================================== */ -/* - * Form styling, for inputs, selects, checkboxes, labels etc etc. - * - * Table of Contents - * - * Labels - * Form Wrapper - * Form Groups - * Fieldsets - * Legends - * Input, textarea & select - * Checkboxes - * Radio Buttons - * Select - */ -/* ========================================================================== - Labels - ========================================================================== */ -form label { - display: block; - color: #242628; - font-size: 1em; - font-weight: bold; } - -/* ========================================================================== - Form Wrapper - ========================================================================== */ -/* ========================================================================== - Form Groups - ========================================================================== */ -.form-group { - position: relative; - margin-bottom: 1.6em; - width: 100%; - max-width: 500px; } - .form-group p { - margin: 4px 0 0 0; - color: #B3B2A8; } - .form-group label { - margin-bottom: 4px; } - @media (max-width: 550px) { - .form-group { - max-width: 100%; } } - -.form-group[class*='icon-'] input[type="email"], .form-group[class*='icon-'] input[type="number"], .form-group[class*='icon-'] input[type="password"], .form-group[class*='icon-'] input[type="search"], .form-group[class*='icon-'] input[type="tel"], .form-group[class*='icon-'] input[type="text"], .form-group[class*='icon-'] input[type="url"], .form-group[class*='icon-'] input[type="color"], .form-group[class*='icon-'] input[type="date"], .form-group[class*='icon-'] input[type="datetime"], .form-group[class*='icon-'] input[type="datetime-local"], .form-group[class*='icon-'] input[type="month"], .form-group[class*='icon-'] input[type="time"], .form-group[class*='icon-'] input[type="week"] { - padding-left: 32px; } -.form-group[class*='icon-']:before { - position: absolute; - top: 50%; - left: 11px; - font-size: 0.9em; - margin-top: calc(-0.45em - 1px); } - -.form-group.for-select[class*="icon-"] .gh-select:before { - left: 32px; } - -.form-group.for-checkbox:after { - content: ""; - display: table; - clear: both; } -.form-group.for-checkbox .checkbox, -.form-group.for-checkbox p { - float: left; } -.form-group.for-checkbox p { - margin-top: 0; - margin-left: 4px; } - -.form-group.for-radio:after { - content: ""; - display: table; - clear: both; } -.form-group.for-radio label:first-child { - display: block; - padding-bottom: 4px; } -.form-group.for-radio .gh-radio-wrapper:after { - content: ""; - display: table; - clear: both; } -.form-group.for-radio .gh-radio-wrapper span { - float: left; } -.form-group.for-radio span:not(.gh-radio) { - margin-top: 0; - margin-left: 4px; } - -/* ========================================================================== - Fieldsets - ========================================================================== */ -fieldset { - border: none; - margin: 0 0 3em 0; - padding: 0; } - -/* ========================================================================== - Legends - ========================================================================== */ -legend { - display: block; - width: 100%; - margin: 2em 0; - border-bottom: #edece4 1px solid; - font-size: 1.2em; - line-height: 2.0em; - color: #aaa9a2; } - -/* ========================================================================== - Input, textarea & select - ========================================================================== */ -input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"], -textarea, -.gh-select, -select { - display: block; - padding: 8px 10px; - width: 100%; - border: 1px solid #E0DFD7; - border-radius: 2px; - font-size: 1.1rem; - font-weight: normal; - color: #242628; - -webkit-transition: border-color, 0.15s linear; - -moz-transition: border-color, 0.15s linear; - transition: border-color, 0.15s linear; } - input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="url"]:focus, input[type="color"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, - textarea:focus, - .gh-select:focus, - select:focus { - border-color: #aaa9a2; } - -textarea { - width: 100%; - max-width: 500px; - min-width: 250px; - height: auto; - min-height: 6.5em; } - -input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { - padding-right: 6px; } - -/* ============================================================================= - Checkboxes - --- -
- - - -

Include the date in your post URLs

-
- ============================================================================= */ -input[type="checkbox"] { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: -9999px; } - -.checkbox { - position: relative; - width: auto; } - .checkbox:before { - content: ''; - position: absolute; - width: 10px; - height: 6px; - top: 6px; - left: 5px; - border: 2px solid #fff; - border-top: none; - border-right: none; - -webkit-transform: rotate(-45deg); - -moz-transform: rotate(-45deg); - -ms-transform: rotate(-45deg); - -o-transform: rotate(-45deg); - transform: rotate(-45deg); - opacity: 0; } - .checkbox:after { - content: ''; - display: inline-block; - width: 20px; - height: 20px; - margin-right: 5px; - background: #f7f7f3; - border-radius: 2px; - border: #e3e1d5 1px solid; - -webkit-transition: all 0.2s ease; - -moz-transition: all 0.2s ease; - transition: all 0.2s ease; } - -input[type='checkbox']:checked + .checkbox:after { - background: #9fbb58; - border-color: #b4ca7c; } - -input[type='checkbox']:checked + .checkbox:before { - opacity: 1; } -input[type='checkbox']:focus + .checkbox:after { - border: #aaa9a2 1px solid; } -input[type='checkbox']:active + .checkbox:after { - background: #edece4; } - -/* ============================================================================= - Radio Buttons - --- -
- - - -

What does this thing mean?

-
- ============================================================================= */ -input[type="radio"] { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: -9999px; } - -.gh-radio { - position: relative; - width: auto; } - .gh-radio:before { - content: ''; - position: absolute; - width: 10px; - height: 10px; - top: 5px; - left: 5px; - opacity: 0; - border-radius: 100%; - background: #9fbb58; } - .gh-radio:after { - content: ''; - display: inline-block; - width: 20px; - height: 20px; - margin-right: 5px; - background: #f7f7f3; - border-radius: 100%; - border: #edece4 1px solid; - -webkit-transition: all 0.2s ease; - -moz-transition: all 0.2s ease; - transition: all 0.2s ease; } - -input[type='radio']:checked + .gh-radio:before { - opacity: 1; } -input[type='radio']:focus + .gh-radio:after { - border: #aaa9a2 1px solid; } - -/* ============================================================================= - Select Component - --- - - {{view Ember.Select - id="activeTheme" - name="general[activeTheme]" - content=themes - optionValuePath="content.name" - optionLabelPath="content.label" - value=activeTheme - selection=selectedTheme}} - - ============================================================================= */ -.gh-select { - position: relative; - display: block; - overflow: hidden; - width: 100%; - max-width: 100%; - padding: 0; - border-width: 0; } - .gh-select:after { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e001"; - font-size: 0.85em; - color: #c0bfb6; - position: absolute; - top: 50%; - right: 0.8em; - margin-top: -0.5em; - pointer-events: none; } - .gh-select:hover { - text-decoration: none; } - .gh-select select { - appearance: none; - -webkit-appearance: none; - -moz-appearance: window; - text-indent: 0.01px; - text-overflow: ""; - background: #fff; - outline: none; - padding: 8px 10px; - line-height: normal; } - .gh-select select::-ms-expand { - display: none; } - .gh-select select:focus { - outline: none; } - .gh-select select:-moz-focusring { - color: transparent; - text-shadow: 0 0 0 #000; } - -@-moz-document url-prefix() { - .gh-select { - border-width: 1px; } - .gh-select select { - padding: 7px 10px 7px 8px; } } -/* - * Floating header styles - * - * Table of Contents - * - * Floating Headers - * Scroll Shadows - */ -/* ========================================================================== - Floating Headers - ========================================================================== */ -.floatingheader { - position: absolute; - top: 0; - left: 0; - right: 0; - z-index: 400; - height: 40px; - padding: 10px 15px; - text-transform: uppercase; - color: #aaa9a2; - background-color: transparent; - background-image: -webkit-linear-gradient(top, white 0%, white 25%, rgba(255, 255, 255, 0.9) 100%); - background-image: linear-gradient(to bottom,white 0%, white 25%, rgba(255, 255, 255, 0.9) 100%); } - .floatingheader .button, .floatingheader .modal-footer .reject-button-class, .modal-footer .floatingheader .reject-button-class { - display: inline-block; - font-size: 10px; - min-height: 20px; - height: 20px; - padding: 3px 4px; - vertical-align: top; } - .floatingheader .button.button-back, .floatingheader .modal-footer .button-back.reject-button-class, .modal-footer .floatingheader .button-back.reject-button-class { - position: relative; - top: -2px; - left: 3px; - display: none; - padding: 0 6px 0 3px; } - .floatingheader .button.button-back:active, .floatingheader .modal-footer .button-back.reject-button-class:active, .modal-footer .floatingheader .button-back.reject-button-class:active { - box-shadow: none; } - .floatingheader .button.button-back:before, .floatingheader .modal-footer .button-back.reject-button-class:before, .modal-footer .floatingheader .button-back.reject-button-class:before { - left: -8px; - border-width: 10px 8px 10px 0; } - @media (max-width: 800px) { - .floatingheader .button.button-back, .floatingheader .modal-footer .button-back.reject-button-class, .modal-footer .floatingheader .button-back.reject-button-class { - display: inline-block; } } - .floatingheader small { - font-size: 0.85em; } - .floatingheader a, - .floatingheader button { - color: #aaa9a2; } - .floatingheader a:hover, - .floatingheader button:hover { - color: #242628; } - -/* ========================================================================== - Scroll Shadows - --- - Special case, when scrolling, add shadows to content headers. - ========================================================================== */ -.scrolling .floatingheader { - box-shadow: rgba(0, 0, 0, 0.02) 0 1px 2px, rgba(255, 255, 255, 0.5) 0 -1px 0 inset; } - .scrolling .floatingheader:before { - content: ""; - height: 40px; - width: 80%; - position: absolute; - bottom: 0; - left: 50%; - margin-left: -40%; - box-shadow: rgba(0, 0, 0, 0.02) 0 2px 2px; } - .scrolling .floatingheader:after { - content: ""; - height: 40px; - width: 30%; - position: absolute; - bottom: 0; - left: 50%; - margin-left: -15%; - box-shadow: rgba(0, 0, 0, 0.02) 0 3px 3px; } - -/* - * Modals styles - * - * Table of Contents - * - * Modal Container - */ -/* ========================================================================== - Modal Container - ========================================================================== */ -#modal-container { - display: none; - position: fixed; - top: 0; - bottom: 0; - left: 0; - right: 0; - overflow-x: auto; - overflow-y: scroll; - z-index: 1040; - -webkit-transition: all 0.15s linear 0s; - -moz-transition: all 0.15s linear 0s; - transition: all 0.15s linear 0s; - -webkit-transform: translateZ(0); - -moz-transform: translateZ(0); - -ms-transform: translateZ(0); - -o-transform: translateZ(0); - transform: translateZ(0); } - -.fade { - opacity: 0; - -webkit-transition: opacity 0.2s linear 0s; - -moz-transition: opacity 0.2s linear 0s; - transition: opacity 0.2s linear 0s; - -webkit-transform: translateZ(0); - -moz-transform: translateZ(0); - -ms-transform: translateZ(0); - -o-transform: translateZ(0); - transform: translateZ(0); } - .fade.in { - opacity: 1; } - -.modal-background { - display: none; - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0; - background: rgba(0, 0, 0, 0.6); - z-index: 1030; } - -.modal, .modal-action { - left: 50%; - right: auto; - width: 450px; - margin-left: auto; - margin-right: auto; - padding-top: 30px; - padding-bottom: 30px; - z-index: 1050; - pointer-events: auto; } - @media (max-width: 800px) { - .modal, .modal-action { - width: auto; - padding: 10px; } } - .modal button, .modal-action button { - min-width: 100px; } - @media (max-width: 800px) { - .modal, .modal-action { - width: 100%; - margin-left: 0; } } - .modal .image-uploader, .modal-action .image-uploader, - .modal .pre-image-uploader, - .modal-action .pre-image-uploader { - margin: 0; } - -.modal-action { - padding: 60px 0 30px; } - @media (max-width: 800px) { - .modal-action { - padding: 30px 0; } } - -.modal-content { - position: relative; - padding: 18px; - background-clip: padding-box; - background-color: #FFFFFF; - border-radius: 2px; - box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 6px; } - .modal-content .close { - position: absolute; - top: 19px; - right: 19px; - width: 16px; - padding: 0; - margin: 0; - border: none; - z-index: 9999; } - .modal-content .close:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e01c"; - font-size: 1.4rem; - color: #7d878a; - -webkit-transition: color 0.3s linear; - -moz-transition: color 0.3s linear; - transition: color 0.3s linear; } - .modal-content .close:hover { - text-decoration: none; } - .modal-content .close:hover:before { - color: #35393b; } - -.modal-header { - position: relative; } - .modal-header h1 { - display: inline-block; - margin: 0; - font-size: 1.85em; - font-weight: 100; } - -.modal-body { - position: relative; - overflow-y: auto; } - -.modal-footer { - margin-top: 20px; } - -.modal-style-wide { - width: 550px; } - @media (max-width: 800px) { - .modal-style-wide { - width: 100%; } } - -.modal-style-centered { - text-align: center; } - -/* - * Dropdown classes, including default styles and section-specific styles - * - * Table of Contents - * - * Dropdowns - * Dropdown Show & Hide - * Menu - * Menu Positioning Options - */ -/* ========================================================================== - Dropdowns - ========================================================================== */ -.dropdown:after { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e001"; - font-size: 8px; - padding-left: 6px; - vertical-align: 0; } -.dropdown:hover { - text-decoration: none; } -.dropdown.active { - color: #242628; } - .dropdown.active:after { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e001"; - font-size: 8px; } - .dropdown.active:hover { - text-decoration: none; } - -/* ========================================================================== - Dropdown Show & Hide - --- - Sadly !important is needed, to counteract the stringer selectors applying - a display property. - ========================================================================== */ -.ghost-popover { - display: none !important; } - -.ghost-popover.open { - display: block !important; } - -/* ========================================================================== - Menu - --- - This is the base menu extend used for styles on interaction menus - Default: Pop menu, chiclet bottom center. - ========================================================================== */ -.menu, .menu-drop, .menu-drop-left, .menu-drop-right, .menu-left, .menu-right, #publish-bar .splitbutton-save .editor-options, -#publish-bar .splitbutton-delete .editor-options, .suggestions { - display: inline-block; - position: absolute; - z-index: 960; - padding: 6px 0; - border: none; - list-style: none; - color: #e2edf2; - background: #242628; - border-radius: 3px; - box-shadow: rgba(0, 0, 0, 0.5) 0 1px 15px; } - .menu:before, .menu-drop:before, .menu-drop-left:before, .menu-drop-right:before, .menu-left:before, .menu-right:before, #publish-bar .splitbutton-save .editor-options:before, - #publish-bar .splitbutton-delete .editor-options:before, .suggestions:before { - content: ""; - position: absolute; - bottom: -10px; - left: 50%; - margin-left: -10px; - border-width: 10px 10px 0 10px; - border-style: solid; - border-color: #242628 transparent; - display: block; - width: 0; } - .menu li, .menu-drop li, .menu-drop-left li, .menu-drop-right li, .menu-left li, .menu-right li, #publish-bar .splitbutton-save .editor-options li, - #publish-bar .splitbutton-delete .editor-options li, .suggestions li { - overflow: hidden; } - .menu a, .menu-drop a, .menu-drop-left a, .menu-drop-right a, .menu-left a, .menu-right a, #publish-bar .splitbutton-save .editor-options a, - #publish-bar .splitbutton-delete .editor-options a, .suggestions a, .menu p, .menu-drop p, .menu-drop-left p, .menu-drop-right p, .menu-left p, .menu-right p, #publish-bar .splitbutton-save .editor-options p, - #publish-bar .splitbutton-delete .editor-options p, .suggestions p { - display: block; - position: relative; - padding: 10px 25px 10px 35px; - border: none; - color: #e2edf2 !important; - text-transform: none; - text-decoration: none; } - .menu a:hover, .menu-drop a:hover, .menu-drop-left a:hover, .menu-drop-right a:hover, .menu-left a:hover, .menu-right a:hover, #publish-bar .splitbutton-save .editor-options a:hover, - #publish-bar .splitbutton-delete .editor-options a:hover, .suggestions a:hover, .menu p:hover, .menu-drop p:hover, .menu-drop-left p:hover, .menu-drop-right p:hover, .menu-left p:hover, .menu-right p:hover, #publish-bar .splitbutton-save .editor-options p:hover, - #publish-bar .splitbutton-delete .editor-options p:hover, .suggestions p:hover { - background: #5ba4e5; - box-shadow: rgba(255, 255, 255, 0.2) 0 1px 0 inset; } - .menu .active a:before, .menu-drop .active a:before, .menu-drop-left .active a:before, .menu-drop-right .active a:before, .menu-left .active a:before, .menu-right .active a:before, #publish-bar .splitbutton-save .editor-options .active a:before, - #publish-bar .splitbutton-delete .editor-options .active a:before, .suggestions .active a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e033"; - position: absolute; - top: 14px; - left: 11px; } - .menu .active a:hover, .menu-drop .active a:hover, .menu-drop-left .active a:hover, .menu-drop-right .active a:hover, .menu-left .active a:hover, .menu-right .active a:hover, #publish-bar .splitbutton-save .editor-options .active a:hover, - #publish-bar .splitbutton-delete .editor-options .active a:hover, .suggestions .active a:hover { - text-decoration: none; } - -/* ========================================================================== - Menu Positioning Options - --- - Combine above classes into one usable class - ========================================================================== */ -.menu-drop:before, .menu-drop-left:before, .menu-drop-right:before { - top: -10px; - bottom: auto; - border-width: 0 10px 10px 10px; } - -.menu-left:before, .menu-drop-left:before { - left: 10px; - margin-left: 0; } - -.menu-right:before, .menu-drop-right:before, #publish-bar .splitbutton-save .editor-options:before, -#publish-bar .splitbutton-delete .editor-options:before { - left: auto; - right: 10px; - margin-left: 0; } - -/* - * Button classes, including - * - * Table of Contents - * - * Buttons - * Split Buttons - */ -/* ========================================================================== - Notifications - ========================================================================== */ -@media (min-width: 401px) { - .notifications { - position: absolute; - bottom: 0; - left: 0; - z-index: 980; - width: 300px; } } -@media (max-width: 400px) { - .notifications { - position: fixed; - top: 0; - left: 0; - right: 0; - z-index: 9999; } } - -.js-bb-notification { - -webkit-transform: translateZ(0); - -moz-transform: translateZ(0); - -ms-transform: translateZ(0); - -o-transform: translateZ(0); - transform: translateZ(0); } - -.notification, .notification-success, .notification-error, .notification-warn, .notification-info { - width: 100%; - min-height: 40px; - max-height: 253px; - margin: 0 0 15px 0; - color: rgba(255, 255, 255, 0.9); - background: #5ba4e5; - position: relative; - box-shadow: rgba(0, 0, 0, 0.05) 0 1px 5px; - -webkit-transform: translateZ(0); - -moz-transform: translateZ(0); - -ms-transform: translateZ(0); - -o-transform: translateZ(0); - transform: translateZ(0); } - .notification:before, .notification-success:before, .notification-error:before, .notification-warn:before, .notification-info:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e031"; - position: absolute; - top: 0; - left: 0; - height: 100%; - width: 44px; - padding: 14px 15px; - text-align: center; - color: rgba(255, 255, 255, 0.8); - background: rgba(0, 0, 0, 0.1); } - .notification:hover, .notification-success:hover, .notification-error:hover, .notification-warn:hover, .notification-info:hover { - text-decoration: none; } - @media (max-width: 400px) { - .notification, .notification-success, .notification-error, .notification-warn, .notification-info { - margin-bottom: 1px; } } - .notification .notification-message, .notification-success .notification-message, .notification-error .notification-message, .notification-warn .notification-message, .notification-info .notification-message { - display: block; - padding: 10px 43px 10px 57px; - max-height: 253px; - overflow: auto; } - .notification .close, .notification-success .close, .notification-error .close, .notification-warn .close, .notification-info .close { - color: rgba(255, 255, 255, 0.6); } - .notification .close:after, .notification-success .close:after, .notification-error .close:after, .notification-warn .close:after, .notification-info .close:after { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e01c"; - padding: 6px; - position: absolute; - top: 8px; - right: 9px; } - .notification .close:hover, .notification-success .close:hover, .notification-error .close:hover, .notification-warn .close:hover, .notification-info .close:hover { - text-decoration: none; } - .notification .close:hover, .notification-success .close:hover, .notification-error .close:hover, .notification-warn .close:hover, .notification-info .close:hover { - color: #fff; } - .notification a, .notification-success a, .notification-error a, .notification-warn a, .notification-info a { - color: inherit; - text-decoration: underline; } - -.notification-success { - background: #9fbb58; } - .notification-success:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e030"; } - .notification-success:hover { - text-decoration: none; } - .notification-success.notification-passive { - -webkit-animation: fade-out 1s linear; - -moz-animation: fade-out 1s linear; - animation: fade-out 1s linear; - -webkit-animation-delay: 3s; - -moz-animation-delay: 3s; - animation-delay: 3s; - -webkit-animation-iteration-count: 1; - -moz-animation-iteration-count: 1; - animation-iteration-count: 1; - -webkit-animation-fill-mode: forwards; - -moz-animation-fill-mode: forwards; - animation-fill-mode: forwards; } - .notification-success.notification-passive:hover { - -webkit-animation: fade-in-snap 0.2s linear; - -moz-animation: fade-in-snap 0.2s linear; - animation: fade-in-snap 0.2s linear; } - -.notification-error { - background: #e25440; } - .notification-error:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e01a"; } - .notification-error:hover { - text-decoration: none; } - -.notification-warn { - background: #f2a925; } - .notification-warn:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e014"; } - .notification-warn:hover { - text-decoration: none; } - -.notification-info { - background: #5ba4e5; } - .notification-info:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e014"; } - .notification-info:hover { - text-decoration: none; } - -.update-available main { - bottom: 56px; } - -/* - * Object list styles - * - * Table of Contents - * - * Object List - */ -/* ========================================================================== - Object List - ========================================================================== */ -.object-list + .object-list { - margin-top: 34px; } - -.object-list-title { - font-size: 13px; - font-weight: normal; - color: #c0bfb6; - margin-bottom: 14px; } - -.object-list-item { - display: -webkit-box; - display: -moz-box; - display: box; - display: -webkit-flex; - display: -moz-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: start; - -moz-box-pack: start; - box-pack: start; - -webkit-justify-content: start; - -moz-justify-content: start; - -ms-justify-content: start; - -o-justify-content: start; - justify-content: start; - -ms-flex-pack: start; - -webkit-box-align: center; - -moz-box-align: center; - box-align: center; - -webkit-align-items: center; - -moz-align-items: center; - -ms-align-items: center; - -o-align-items: center; - align-items: center; - -ms-flex-align: center; - padding-left: 15px; - padding-right: 15px; - border-top: 1px solid #edece4; - min-height: 68px; } - -a.object-list-item { - text-decoration: none; } - a.object-list-item:hover { - background: #f7f7f3; } - a.object-list-item:last-of-type:hover { - box-shadow: inset 0px -1px 0px #edece4; } - -.object-list-item-icon { - width: 35px; - height: 35px; - display: block; - border-radius: 100%; - background: #edece4; - font-size: 0px; - color: transparent; - overflow: hidden; - position: relative; } - .object-list-item-icon:before { - position: absolute; - top: 50%; - left: 0; - right: 0; - margin-top: -7px; - text-align: center; - color: #aaa9a2; - font-size: 14px; } - -.object-list-item-figure { - width: 35px; - border-radius: 100%; - display: block; - border: 1px solid #979797; } - -.object-list-item-body { - -webkit-box-flex: 1; - -moz-box-flex: 1; - box-flex: 1; - -webkit-flex: 1; - -moz-flex: 1; - -ms-flex: 1; - flex: 1; - -webkit-box-align: stretch; - -moz-box-align: stretch; - box-align: stretch; - -webkit-align-items: stretch; - -moz-align-items: stretch; - -ms-align-items: stretch; - -o-align-items: stretch; - align-items: stretch; - -ms-flex-align: stretch; - padding-left: 15px; - line-height: 1; } - .object-list-item-body .name { - display: inline-block; - font-size: 15px; - font-weight: 400; - color: #242628; } - .object-list-item-body .description { - display: inline-block; - font-size: 12px; - color: #c0bfb6; - margin-top: 3px; } - -.object-list-item-aside .object-list-action + .object-list-action { - margin-left: 20px; } -.object-list-item-aside .role-label { - float: left; - margin-top: -1px; } -.object-list-item-aside .role-label + .role-label { - margin-left: 5px; } - -.object-list-action { - font-size: 11px; - text-transform: uppercase; - text-decoration: underline; } - -/* - * Role Lable styles - * - * Table of Contents - * - * Role Labels - */ -/* ========================================================================== - Role Labels - ========================================================================== */ -.role-label { - background: #eee; - display: inline-block; - padding: 6px 8px; - color: rgba(0, 0, 0, 0.5); - font-size: 9px; - line-height: 1; - text-transform: uppercase; - letter-spacing: 0.1em; - font-weight: 400; } - .role-label.owner, .role-label.admin, .role-label.editor { - color: rgba(255, 255, 255, 0.8); } - .role-label.owner { - background: #242628; } - .role-label.admin { - background: #e25440; } - .role-label.editor { - background: #5ba4e5; } - -/* - * Image Uploader styles - * - * Table of Contents - * - * Image Uploader - * Pre Image Uploader - */ -/* ========================================================================== - Image Uploader - ========================================================================== */ -.image-uploader { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - margin: 1.6em 0; - position: relative; - overflow: hidden; - padding: 55px 60px; - border: #edece4 3px dashed; - width: 100%; - height: auto; - text-align: center; - color: #aaa9a2; - background: #F9F8F5; } - .image-uploader a { - color: #aaa9a2; - text-decoration: none; } - .image-uploader a:hover { - color: #242628; } - .image-uploader .description { - margin-top: 10px; } - .image-uploader .media:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e011"; - font-size: 60px; - color: #e7e6db; - display: inline-block; - vertical-align: initial; - -webkit-transition: -webkit-transform 1s ease; - -moz-transition: -moz-transform 1s ease; - transition: transform 1s ease; } - .image-uploader .media:hover { - text-decoration: none; } - .image-uploader .image-url, - .image-uploader .image-upload { - line-height: 12px; - padding: 10px; - display: block; - position: absolute; - bottom: 0; - left: 0; - color: #aaa9a2; - text-decoration: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; } - .image-uploader .image-url:hover, - .image-uploader .image-upload:hover { - cursor: pointer; } - .image-uploader .image-webcam:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e036"; - font-size: 12px; } - .image-uploader .image-webcam:hover { - text-decoration: none; } - .image-uploader .image-url:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e035"; - font-size: 12px; } - .image-uploader .image-url:hover { - text-decoration: none; } - .image-uploader .image-upload:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e011"; - font-size: 12px; } - .image-uploader .image-upload:hover { - text-decoration: none; } - .image-uploader .button-add { - display: inline-block; - position: relative; - z-index: 700; - color: #fff; - padding-left: 5px; } - .image-uploader .button-save { - margin: 0 0 0 10px; } - .image-uploader input.main { - position: absolute; - right: 0; - margin: 0; - opacity: 0; - -webkit-transform-origin: right; - -moz-transform-origin: right; - -ms-transform-origin: right; - -o-transform-origin: right; - transform-origin: right; - -webkit-transform: scale(14); - -moz-transform: scale(14); - -ms-transform: scale(14); - -o-transform: scale(14); - transform: scale(14); - font-size: 23px; - direction: ltr; - cursor: pointer; } - .image-uploader input.main.right { - right: 9999px; - height: 0; } - .image-uploader input.url { - font: -webkit-small-control; - box-sizing: border-box; - width: 276px; - vertical-align: middle; - padding: 9px 7px; - margin: 10px 0; - outline: 0; - font-size: 1.1em; - background: #fff; - border: #e3e1d5 1px solid; - border-radius: 4px; - -webkit-transition: all 0.15s ease-in-out; - -moz-transition: all 0.15s ease-in-out; } - .image-uploader .progress { - position: relative; - margin: -19px 0 44px 0; - display: block; - overflow: hidden; - background-color: whitesmoke; - background-image: -webkit-linear-gradient(top, whitesmoke, #f9f9f9); - background-image: linear-gradient(to bottom,whitesmoke, #f9f9f9); - border-radius: 12px; - box-shadow: rgba(0, 0, 0, 0.1) 0 1px 2px inset; } - .image-uploader .fileupload-loading { - display: block; - top: 50%; - width: 35px; - height: 28px; - margin: -28px auto 0; - background-size: contain; } - .image-uploader .failed { - position: relative; - top: -40px; - font-size: 16px; } - .image-uploader .bar { - height: 12px; - background: #5ba4e5; } - .image-uploader .bar.fail { - background: #e25440; } - -/* ========================================================================== - Pre Image Uploader - ========================================================================== */ -.pre-image-uploader { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - margin: 1.6em 0; - position: relative; - overflow: hidden; - height: auto; - color: #aaa9a2; - background: rgba(0, 0, 0, 0.1); - border-radius: 2px; - min-height: 46px; } - .pre-image-uploader input { - position: absolute; - left: 9999px; - opacity: 0; } - .pre-image-uploader a { - z-index: 10000; - color: #aaa9a2; - text-decoration: none; } - .pre-image-uploader a:hover { - color: #242628; } - .pre-image-uploader img { - display: block; - max-width: 100%; - margin: 0 auto; - line-height: 0; } - .pre-image-uploader .image-cancel { - position: absolute; - top: 10px; - right: 10px; - padding: 8px; - z-index: 300; - color: #fff; - text-decoration: none; - line-height: 0; - border-radius: 2px; - background: rgba(0, 0, 0, 0.6); - box-shadow: rgba(255, 255, 255, 0.2) 0 0 0 1px; } - .pre-image-uploader .image-cancel:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e023"; - font-size: 11px; } - .pre-image-uploader .image-cancel:hover { - text-decoration: none; } - .pre-image-uploader .image-cancel:hover { - color: #fff; - cursor: pointer; - background: #e25440; } - -/* - * Navbar styling - * - * Table of Contents - * - * Ghost Logo - * Nav Bar - * Mobile Navigation - */ -/* ========================================================================== - Ghost Logo - ========================================================================== */ -.ghost-logo { - display: block; - float: left; - height: 40px; - padding: 12px 15px; - color: #4d5356; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; } - .ghost-logo:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e000"; - line-height: 0; } - .ghost-logo:hover { - text-decoration: none; } - .ghost-logo:hover, .ghost-logo:focus { - text-decoration: none; } - -.ghost-logo:hover, -.ghost-logo:focus { - color: #e2edf2; - background: #1f2123; } - -/* ========================================================================== - Nav Bar - ========================================================================== */ -.navbar { - height: 40px; - font-size: 0.85em; - background: #242628; } - @media (max-width: 1000px) { - .navbar { - font-weight: normal; } } - .navbar nav ul { - float: left; - border-left: #35393b 1px solid; - border-top: none; - margin: 0; - padding: 0; } - .navbar nav li { - float: left; - font-size: 1em; - position: relative; - border-right: #35393b 1px solid; } - .navbar nav li a { - display: block; - height: 40px; - padding: 11px 15px; - border-bottom: none; - color: #7d878a; - text-transform: uppercase; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; } - .navbar nav li a:hover, - .navbar nav li a:focus, .navbar nav li.active a { - color: #e2edf2; - text-decoration: none; - position: relative; - background: #303436; - box-shadow: 0 -2px 2px rgba(0, 0, 0, 0.2) inset; } - .navbar nav li.active a:after { - content: ""; - position: absolute; - bottom: 0; - left: 50%; - margin-left: -5px; - border-width: 0 5px 5px 5px; - border-style: solid; - border-color: #edece4 transparent; - display: block; - width: 0; } - @media (max-width: 400px) { - .navbar nav li.active a:after { - border-color: #fff transparent; } } - .navbar nav li ul { - position: absolute; - top: 40px; - right: 0; - min-width: 200px; - background: #242628; } - .navbar nav li li { - width: 100%; - border-right: none; } - .navbar nav a:before { - margin-right: 5px; } - .navbar nav .dashboard a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e025"; - vertical-align: -10%; } - .navbar nav .dashboard a:hover { - text-decoration: none; } - .navbar nav .content a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e02d"; } - .navbar nav .content a:hover { - text-decoration: none; } - .navbar nav .editor a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e032"; } - .navbar nav .editor a:hover { - text-decoration: none; } - .navbar nav .settings a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e029"; } - .navbar nav .settings a:hover { - text-decoration: none; } - .navbar .subnav { - position: relative; } - .navbar .subnav > a:after { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e001"; - font-size: 8px; - margin-left: 8px; } - .navbar .subnav > a:hover { - text-decoration: none; } - .navbar .subnav > a.active { - color: #e2edf2; - background: #2e3133; - -webkit-transition: none; - -moz-transition: none; - transition: none; - box-shadow: none; } - .navbar .subnav ul { - display: none; - padding: 7px 0; - border-left: none; - position: absolute; - top: 40px; - left: -1px; - z-index: 800; - background: #2e3133; - box-shadow: rgba(0, 0, 0, 0.2) 0 4px 6px; } - .navbar .subnav li { - list-style: none; } - .navbar .subnav li a { - color: #e2edf2; } - .navbar .subnav li a:hover, .navbar .subnav li a:focus { - background: #0c0d0d; - -webkit-transition: none; - -moz-transition: none; - transition: none; - box-shadow: none; } - .navbar .subnav li a:before { - margin-right: 1em; } - .navbar .subnav .divider { - height: 1px; - margin: 7px 0; - overflow: hidden; - background: #35393b; } - -.usermenu.subnav { - position: absolute; - top: 0; - right: 0; - border-right: none; - border-left: #35393b 1px solid; } - .usermenu.subnav > a { - padding-left: 43px; } - .usermenu.subnav .avatar { - height: 18px; - width: 18px; - border-radius: 50px; - position: absolute; - top: 11px; - left: 15px; } - .usermenu.subnav > ul { - right: 0; - left: auto; } - .usermenu.subnav .usermenu-profile a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e02e"; } - .usermenu.subnav .usermenu-profile a:hover { - text-decoration: none; } - .usermenu.subnav .usermenu-help a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e02f"; - font-size: 1.1em; } - .usermenu.subnav .usermenu-help a:hover { - text-decoration: none; } - .usermenu.subnav .usermenu-shortcuts a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e00d"; } - .usermenu.subnav .usermenu-shortcuts a:hover { - text-decoration: none; } - .usermenu.subnav .usermenu-signout a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e02b"; } - .usermenu.subnav .usermenu-signout a:hover { - text-decoration: none; } - -/* ========================================================================== - Mobile Navigation - ========================================================================== */ -@media (max-width: 650px) { - #global-header .ghost-logo { - height: 40px; - width: 40px; - text-align: center; - padding: 12px 0; - -webkit-transition: margin-left 0.3s ease 0s; - -moz-transition: margin-left 0.3s ease 0s; - transition: margin-left 0.3s ease 0s; } - #global-header .ghost-logo:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e005"; - font-size: 14px; } - #global-header .ghost-logo:hover { - text-decoration: none; } - .off-canvas #global-header .ghost-logo { - margin-left: 280px; - -webkit-transition: margin-left 0.3s ease 0.1s; - -moz-transition: margin-left 0.3s ease 0.1s; - transition: margin-left 0.3s ease 0.1s; } - #global-header ul { - position: fixed; - overflow: auto; - top: 0; - right: auto; - bottom: 0; - left: -280px; - z-index: 980; - width: 280px; - padding-top: 40px; - font-weight: normal; - background: #242628; - border-left: none; - -webkit-transition: left 0.3s ease 0.2s; - -moz-transition: left 0.3s ease 0.2s; - transition: left 0.3s ease 0.2s; } - .off-canvas #global-header ul { - left: 0; - -webkit-transition: left 0.3s ease 0s; - -moz-transition: left 0.3s ease 0s; - transition: left 0.3s ease 0s; } - #global-header li { - float: none; - border-right: none; - border-bottom: #35393b 1px solid; } - #global-header li a:hover, - #global-header li a:focus, #global-header li.active a { - box-shadow: none; } - #global-header li.active a:after { - display: none; } - #global-header li a:before { - margin-right: 1em; } - #global-header li ul { - position: static; - min-width: 0; - background: #242628; } - #global-header li li { - width: auto; } - #global-header .usermenu { - position: fixed; - top: 0; - right: auto; - bottom: auto; - left: -280px; - height: 40px; - z-index: 990; - width: 279px; - border-left: none; - border-right: #242728 1px solid; - border-bottom: #292c2e 1px solid; - background-color: #1d1e20; - background-image: -webkit-linear-gradient(bottom, #111213, #1d1e20); - background-image: -moz-linear-gradient(bottom, #111213, #1d1e20); - background-image: -ms-linear-gradient(bottom, #111213, #1d1e20); - background-image: linear-gradient(to top, #111213, #1d1e20); - -webkit-transition: left 0.3s ease 0.2s; - -moz-transition: left 0.3s ease 0.2s; - transition: left 0.3s ease 0.2s; } - .off-canvas #global-header .usermenu { - left: 0; - -webkit-transition: left 0.3s ease 0s; - -moz-transition: left 0.3s ease 0s; - transition: left 0.3s ease 0s; } - #global-header .usermenu > a:hover, #global-header .usermenu > a:focus { - background: inherit; } - #global-header .usermenu > a.active { - background: #2e3133; } - #global-header .usermenu > ul { - padding: 0; - box-shadow: none; - width: 100%; - font-weight: 300; } - #global-header .usermenu .open { - box-shadow: rgba(0, 0, 0, 0.4) 0 10px 20px; } - #global-header .usermenu li { - border-bottom: #2e3133 1px solid; } - #global-header .usermenu li a { - background: #2e3133; } - #global-header .usermenu li a:hover, #global-header .usermenu li a:focus { - background: #222426; } - #global-header .usermenu li a:before { - margin-right: 1em; } - #global-header .usermenu .divider { - display: none; } } - -/* - * Navigation Menus - * - * Table of Contents - * - * Nav - */ -/* ========================================================================== - Nav - ========================================================================== */ -nav ul { - list-style: none; - margin: 0; - padding: 0; - border-top: #edece4 1px solid; } -nav li a { - display: block; - padding: 10px 15px; - color: #aaa9a2; - border-bottom: #edece4 1px solid; } - nav li a:hover, nav li a:focus { - color: #242628; - background: #edece4; - text-decoration: none; } - nav li a:before { - margin-right: 1em; } - -/* - * NProgress styles - * - * Table of Contents - * - * NProgress - * Keyframes - */ -/* ========================================================================== - NProgress - ========================================================================== */ -/* Make clicks pass-through */ -#nprogress { - pointer-events: none; - -webkit-pointer-events: none; } - -#nprogress .bar { - background: #5ba4e5; - position: fixed; - z-index: 100; - top: 0; - left: 0; - width: 100%; - height: 2px; } - -/* Fancy blur effect */ -#nprogress .peg { - display: block; - position: absolute; - right: 0px; - width: 100px; - height: 100%; - box-shadow: 0 0 10px #5ba4e5, 0 0 5px #5ba4e5; - opacity: 1.0; - -webkit-transform: rotate(3deg) translate(0px, -4px); - -moz-transform: rotate(3deg) translate(0px, -4px); - -ms-transform: rotate(3deg) translate(0px, -4px); - -o-transform: rotate(3deg) translate(0px, -4px); - transform: rotate(3deg) translate(0px, -4px); } - -/* Remove these to get rid of the spinner */ -#nprogress .spinner { - display: block; - position: fixed; - z-index: 100; - top: 15px; - right: 15px; } - -#nprogress .spinner-icon { - width: 14px; - height: 14px; - border: solid 2px transparent; - border-top-color: #5ba4e5; - border-left-color: #5ba4e5; - border-radius: 10px; - -webkit-animation: nprogress-spinner 400ms linear infinite; - -moz-animation: nprogress-spinner 400ms linear infinite; - -ms-animation: nprogress-spinner 400ms linear infinite; - -o-animation: nprogress-spinner 400ms linear infinite; - animation: nprogress-spinner 400ms linear infinite; } - -/* ========================================================================== - Keyframes - ========================================================================== */ -@-webkit-keyframes nprogress-spinner { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); } } -@-moz-keyframes nprogress-spinner { - 0% { - -moz-transform: rotate(0deg); - transform: rotate(0deg); } - - 100% { - -moz-transform: rotate(360deg); - transform: rotate(360deg); } } -@-o-keyframes nprogress-spinner { - 0% { - -o-transform: rotate(0deg); - transform: rotate(0deg); } - - 100% { - -o-transform: rotate(360deg); - transform: rotate(360deg); } } -@-ms-keyframes nprogress-spinner { - 0% { - -ms-transform: rotate(0deg); - transform: rotate(0deg); } - - 100% { - -ms-transform: rotate(360deg); - transform: rotate(360deg); } } -@keyframes nprogress-spinner { - 0% { - transform: rotate(0deg); - transform: rotate(0deg); } - - 100% { - transform: rotate(360deg); - transform: rotate(360deg); } } -/* ========================================================================== - Layouts - ========================================================================== */ -/* - * Auth layout for login, signup & reset password - * - * Table of Contents - * - * Globals - * Login - * Signup and Reset - * Forgotten Password - */ -/* ========================================================================== - Globals - ========================================================================== */ -.ghost-login, -.ghost-signup, -.ghost-forgotten, -.ghost-reset { - color: #7d878a; - background: #242628; } - @media (max-width: 400px) { - .ghost-login, - .ghost-signup, - .ghost-forgotten, - .ghost-reset { - background: #242628; } } - .ghost-login main, - .ghost-signup main, - .ghost-forgotten main, - .ghost-reset main { - top: 15px; } - .ghost-login input:-webkit-autofill, - .ghost-signup input:-webkit-autofill, - .ghost-forgotten input:-webkit-autofill, - .ghost-reset input:-webkit-autofill { - -webkit-box-shadow: 0 0 0px 1000px #e2edf2 inset !important; } - -.login-box, -.signup-box, -.forgotten-box, -.reset-box { - max-width: 530px; - height: 90%; - margin: 0 auto; - padding: 0; - display: table; } - @media (max-width: 630px) { - .login-box, - .signup-box, - .forgotten-box, - .reset-box { - max-width: 264px; - text-align: center; } } - -/* ============================================================================= - Login - ============================================================================= */ -.login-form { - max-width: 530px; - color: #a5acae; - display: table-cell; - vertical-align: middle; } - @media (max-width: 630px) { - .login-form { - max-width: 264px; } } - .login-form div { - position: relative; - margin: 0 0 5px 0; - background: #3c4043; - float: left; } - @media (max-width: 630px) { - .login-form div { - margin-bottom: 1em; } } - .login-form input { - display: inline-block; - clear: both; - margin: 0; - padding: 8px 0 8px 8px; - width: 216px; - position: relative; - border: none; - color: #fff; - font-size: 1.1em; - font-weight: 200; - background: transparent; - box-shadow: none; - -webkit-transition: background ease 0.25s; - -moz-transition: background ease 0.25s; - transition: background ease 0.25s; } - @media (max-width: 630px) { - .login-form input { - width: 264px; - -webkit-transition: none; - -moz-transition: none; - transition: none; } } - .login-form input:focus { - border: none; - background: #484c50; } - .login-form .email-wrap { - position: relative; - margin-right: 3px; - border-radius: 2px 0 0 2px; } - .login-form .email-wrap:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e012"; - font-size: 12px; - position: absolute; - bottom: 11px; - left: 8px; - z-index: 100; } - .login-form .email-wrap:hover { - text-decoration: none; } - @media (max-width: 630px) { - .login-form .email-wrap { - margin-right: 0; - border-radius: 2px; } } - .login-form .email-wrap .email { - padding-left: 28px; - border-radius: 2px 0 0 2px; } - .login-form .password-wrap { - position: relative; - border-radius: 0 2px 2px 0; } - .login-form .password-wrap:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e02c"; - font-size: 10px; - position: absolute; - bottom: 12px; - left: 11px; - z-index: 100; } - .login-form .password-wrap:hover { - text-decoration: none; } - @media (max-width: 630px) { - .login-form .password-wrap { - border-radius: 2px; } } - .login-form .password-wrap .password { - padding-left: 28px; - border-radius: 0 2px 2px 0; } - .login-form button { - width: 85px; - height: 36px; - margin: 0 0 0 10px; - padding: 0.5em 1.37em; - min-height: 30px; - min-width: 80px; - box-shadow: rgba(255, 255, 255, 0.15) 0 1px 0 inset; } - @media (max-width: 630px) { - .login-form button { - margin: 0; - width: 100%; - margin-bottom: 1em; } } - .login-form .meta { - clear: both; - color: #7d878a; } - .login-form a { - color: #646d70; - font-size: 0.9em; } - .login-form a:hover { - color: #8a9396; - text-decoration: none; } - -/* ============================================================================= - Signup and Reset - ============================================================================= */ -.signup-form, -.reset-form { - max-width: 280px; - color: #a5acae; - display: table-cell; - vertical-align: middle; } - @media (max-width: 630px) { - .signup-form, - .reset-form { - width: 264px; } } - .signup-form div, - .reset-form div { - position: relative; - margin: 0 0 1em 0; - background: #3c4043; - float: left; - display: table; } - .signup-form input, - .reset-form input { - margin: 0; - width: 280px; - padding: 8px 10px; - position: relative; - border: none; - color: #fff; - font-size: 1.1em; - font-weight: 200; - background: transparent; - box-shadow: none; } - @media (min-width: 631px) { - .signup-form input, - .reset-form input { - -webkit-transition: background ease 0.25s; - -moz-transition: background ease 0.25s; - transition: background ease 0.25s; } } - @media (max-width: 630px) { - .signup-form input, - .reset-form input { - width: 264px; } } - .signup-form input:focus, - .reset-form input:focus { - border: none; - background: #484c50; } - .signup-form .name-wrap, - .reset-form .name-wrap { - position: relative; - border-radius: 2px; } - .signup-form .name-wrap .name, - .reset-form .name-wrap .name { - border-radius: 2px; } - .signup-form .email-wrap, - .reset-form .email-wrap { - position: relative; - border-radius: 2px; } - .signup-form .email-wrap .email, - .reset-form .email-wrap .email { - border-radius: 2px; } - .signup-form .password-wrap, - .reset-form .password-wrap { - position: relative; - border-radius: 2px; } - .signup-form .password-wrap .password, - .reset-form .password-wrap .password { - border-radius: 2px; } - .signup-form button, - .reset-form button { - width: 100%; - height: 36px; - margin: 0 0 1em 0; - padding: 0.5em 1.37em; - min-height: 30px; - min-width: 80px; - box-shadow: rgba(255, 255, 255, 0.15) 0 1px 0 inset; } - -/* ============================================================================= - Forgotten Password - ============================================================================= */ -.forgotten-form { - max-width: 280px; - color: #a5acae; - display: table-cell; - vertical-align: middle; } - .forgotten-form div { - position: relative; - margin: 0 0 1em 0; - background: #3c4043; - float: left; } - .forgotten-form input { - margin: 0; - padding: 8px 10px; - position: relative; - border: none; - color: #fff; - font-size: 1.1em; - font-weight: 200; - background: transparent; - box-shadow: none; - -webkit-transition: background ease 0.25s; - -moz-transition: background ease 0.25s; - transition: background ease 0.25s; } - .forgotten-form input:focus { - border: none; - background: #484c50; } - .forgotten-form .email-wrap { - width: 100%; - position: relative; - border-radius: 2px; } - .forgotten-form .email-wrap .email { - border-radius: 2px; } - .forgotten-form button { - width: 100%; - height: 36px; - margin: 0 0 1em 0; - padding: 0.5em 1.37em; - min-height: 30px; - min-width: 80px; - box-shadow: rgba(255, 255, 255, 0.15) 0 1px 0 inset; } - -/* - * About Ghost page - * - * Table of Contents - * - * Ghost Logo - * Version, environment & support - * Contributors - * Credits & Copyright - */ -/* ========================================================================== - Ghost Logo - ========================================================================== */ -.settings-about .ghost_logo:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e000"; - font-size: 1.28rem; - color: #7d878a; - position: relative; - top: -6px; } -.settings-about .ghost_logo:hover { - text-decoration: none; } -.settings-about .ghost_logo:after { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e600"; - font-size: 2.5rem; - color: #242628; } -.settings-about .ghost_logo:hover { - text-decoration: none; } -.settings-about p { - color: #7d878a; } - -/* ========================================================================== - Version, environment & support - ========================================================================== */ -.about-ghost-intro h1 { - margin-top: -6px; - margin-bottom: -21px; } - .about-ghost-intro h1 .version { - font-weight: 300; - font-size: 1.3rem; - position: relative; - top: -3px; } -@media (max-width: 550px) { - .about-ghost-intro { - padding-top: 40px; } } - -.about-environment-help { - margin-top: 35px; } - -.about-environment p { - margin: 0; - line-height: 1.7; } - -.about-help { - padding-top: 6px; } - @media (max-width: 500px) { - .about-help { - padding-top: 16px; } } - .about-help .button-dark { - width: 100%; - display: block; - font-size: 0.85rem; - padding-top: 8px; - padding-bottom: 8px; - min-height: 32px; } - .about-help .button-dark:nth-child(1) { - margin-bottom: 11px; } - -@media (min-width: 501px) { - .about-environment-help { - max-width: 430px; } - - .about-environment { - float: left; - width: calc(100% - 196px); } - - .about-help { - float: right; - width: 176px; } } -/* ========================================================================== - Contributors - ========================================================================== */ -.top-contributors { - padding-left: 0; - max-width: 650px; } - .top-contributors li { - float: left; - list-style: none; - width: 10%; } - .top-contributors li a { - display: block; } - @media (min-width: 601px) { - .top-contributors li a { - margin-right: 9px; - margin-bottom: 9px; } } - @media (max-width: 600px) { - .top-contributors li a { - margin-right: 6px; - margin-bottom: 6px; } } - .top-contributors li a img { - width: 100%; - display: block; - border-radius: 100%; } - -/* ========================================================================== - Credits & Copyright - ========================================================================== */ -.about-credits { - margin-top: 48px; } - .about-credits h1 { - font-size: 1.85rem; - margin-bottom: 2rem; } - -.about-contributors-info { - margin-right: -0.9rem; - font-size: 1.2rem; - max-width: 620px; } - -.button-save.large.about-get-involved { - margin-top: -0.1rem; - font-size: 0.9rem; } - -.about-copyright { - margin-top: 4.9rem; } - .about-copyright a:link, .about-copyright a:visited { - color: inherit; } - .about-copyright a:hover, .about-copyright a:focus, .about-copyright a:active { - text-decoration: none; - color: #5ba4e5; } - -/* - * Content screen styles - * - * Table of Contents - * - * Content Management - * Preview - */ -/* ========================================================================== - Content Management - ========================================================================== */ -.manage .content-view-container { - position: relative; - height: 100%; - width: 100%; } - @media (max-width: 800px) { - .manage .content-view-container { - overflow-x: hidden; } } -.manage .content-list { - width: 35%; - padding: 15px; - position: absolute; - bottom: 0; - top: 0; - left: 0; - border-right: #edece4 2px solid; - background: #fff; - box-shadow: rgba(0, 0, 0, 0.05) 0 1px 5px; } - @media (max-width: 800px) { - .manage .content-list { - width: auto; - right: 0; - z-index: 500; - border: none; } } - .manage .content-list .content-filter { - position: relative; - z-index: 300; } - .manage .content-list .content-filter > a { - padding: 5px; - margin-left: -5px; } - .manage .content-list .content-filter .menu-drop, .manage .content-list .content-filter .menu-drop-left, .manage .content-list .content-filter .menu-drop-right { - display: block; } - .manage .content-list .button-add { - position: absolute; - top: 10px; - right: 15px; - z-index: 700; - color: #fff; - padding: 3px 4px 3px 5px; - min-height: 0; } - .manage .content-list .button-add:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e032"; } - .manage .content-list .button-add:hover { - text-decoration: none; } - .manage .content-list .content-list-content { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - overflow: auto; - padding-top: 40px; } - .manage .content-list .entry-title { - font-size: 1.4em; - line-height: 1.1em; - margin-bottom: 0.5em; - font-weight: normal; } - .manage .content-list .views { - float: right; - text-align: right; - margin-left: 15px; } - .manage .content-list .views:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e025"; - font-size: 10px; - color: #aaa9a2; } - .manage .content-list .views:hover { - text-decoration: none; } - @media (max-width: 800px) { - .manage .content-list .views { - float: none; } } - .manage .content-list .featured .status:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e026"; - font-size: 11px; - margin-right: 10px; - vertical-align: 7%; } - .manage .content-list .featured .status:hover { - text-decoration: none; } - .manage .content-list .status .draft { - color: #e25440; } - .manage .content-list .status .scheduled { - color: #f2a925; } - .manage .content-list ol { - list-style: none; - padding: 0; - margin: 0; - border-top: #edece4 1px solid; } - .manage .content-list ol li { - margin: 0; - padding: 0; - border-bottom: #edece4 1px solid; - position: relative; } - .manage .content-list ol li a { - display: block; - padding: 20px 15px; - color: #aaa9a2; } - @media (max-width: 400px) { - .manage .content-list ol li a { - padding: 15px; } } - @media (max-width: 800px) { - .manage .content-list ol li a { - padding-right: 40px; } } - .manage .content-list ol li a:after { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e01d"; - position: absolute; - top: 50%; - margin-top: -6px; - right: 15px; } - .manage .content-list ol li a:hover { - text-decoration: none; } - @media (min-width: 801px) { - .manage .content-list ol li a:after { - display: none; } } - .manage .content-list ol li a:hover { - text-decoration: none; } - @media (min-width: 801px) { - .manage .content-list ol li.active { - border-bottom: #e8eaeb 1px solid; - background: #f6f6f7; - box-shadow: #e8eaeb 0 -1px 0, rgba(0, 0, 0, 0.06) 7px 0 0 inset, #e8eaeb 1px 0 0 inset; } - .manage .content-list ol li.active a:hover { - box-shadow: rgba(0, 0, 0, 0.1) 7px 0 0 inset; - -webkit-transition: all 0.4s ease; - -moz-transition: all 0.4s ease; - transition: all 0.4s ease; } - .manage .content-list ol li.active .entry-title { - font-weight: bold; } - .manage .content-list ol li.active .entry-meta { - color: #242628; } - .manage .content-list ol li.active .views { - color: #242628; - font-weight: normal; } - .manage .content-list ol li.active .views:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e025"; - font-size: 10px; - color: #242628; } - .manage .content-list ol li.active .views:hover { - text-decoration: none; } } - -/* ============================================================================= - Preview - ============================================================================= */ -.manage .content-preview { - width: 65%; - padding: 15px; - position: absolute; - bottom: 0; - top: 0; - right: 0; - border-left: #edece4 2px solid; - background: #fff; - box-shadow: rgba(0, 0, 0, 0.05) 0 1px 5px; } - @media (max-width: 800px) { - .manage .content-preview { - width: auto; - left: 100%; - right: -100%; - margin-left: 15px; - border: none; } } - .manage .content-preview .unfeatured { - vertical-align: -6%; - margin: 0 7px 0 -5px; - padding: 5px; } - .manage .content-preview .unfeatured:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e027"; - font-size: 14px; } - .manage .content-preview .unfeatured:hover { - text-decoration: none; } - .manage .content-preview .featured { - vertical-align: -6%; - margin: 0 7px 0 -5px; - padding: 5px; } - .manage .content-preview .featured:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e026"; - font-size: 14px; } - .manage .content-preview .featured:hover { - text-decoration: none; } - .manage .content-preview .normal { - text-transform: none; - margin: 0 3px; } - .manage .content-preview .content-preview-content { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - overflow: auto; - padding: 80px 40px; - word-break: break-word; - hyphens: auto; } - .manage .content-preview .content-preview-content .wrapper { - max-width: 700px; - margin: 0 auto; } - .manage .content-preview .post-controls { - float: right; - position: relative; } - .manage .content-preview .post-settings-menu { - position: absolute; - top: 35px; - right: -3px; } - .manage .content-preview .post-edit { - margin-right: 2px; - padding: 0 10px; } - .manage .content-preview .post-edit:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e00f"; - font-size: 14px; } - .manage .content-preview .post-edit:hover { - text-decoration: none; } - .manage .content-preview img { - width: 100%; - height: auto; } -.manage .no-posts-box { - position: relative; - height: 90%; - margin: 0px auto; - padding: 0px; - display: table; - z-index: 600; } - @media (max-width: 800px) { - .manage .no-posts-box { - position: fixed; - top: 45%; - left: 50%; } } - .manage .no-posts-box .no-posts { - vertical-align: middle; - display: table-cell; - text-align: center; } - @media (max-width: 800px) { - .manage .no-posts-box .no-posts { - display: block; - position: relative; - left: -50%; } } - .manage .no-posts-box .no-posts h3 { - color: #aaa9a2; - font-weight: 200; - font-size: 2em; } - -/* - * Editor screen styles - * - * Table of Contents - * - * Editor - * Post Preview Content - * Full Screen Mode - * Publish Bar - * Markdown Help Modal - * CodeMirror - */ -/* ========================================================================== - Editor - ========================================================================== */ -.entry-container .entry-title { - height: 57px; - padding: 2px 15px; - margin-bottom: 5px; - position: relative; } - @media (max-width: 400px) { - .entry-container .entry-title { - box-shadow: none; } } - .entry-container .entry-title input { - border: 0; - margin: 0; - padding: 0; - font-size: 3em; - font-weight: bold; - letter-spacing: -1px; - width: 100%; - background: transparent; } - .entry-container .entry-title input:focus { - outline: 0; } - -@media (min-width: 401px) { - .editor .notifications { - bottom: 40px; } } -.editor .entry-container { - position: relative; - height: 100%; } -.editor .entry-markdown { - left: 0; - border-right: #edece4 2px solid; } -.editor .entry-preview { - right: 0; - border-left: #edece4 2px solid; } -.editor .entry-markdown, -.editor .entry-preview { - width: 50%; - padding: 15px; - position: absolute; - bottom: 40px; - top: 61px; - background: #fff; - box-shadow: rgba(0, 0, 0, 0.05) 0 1px 5px; } - @media (max-width: 400px) { - .editor .entry-markdown, - .editor .entry-preview { - box-shadow: none; } } - @media (max-width: 1000px) { - .editor .entry-markdown, - .editor .entry-preview { - top: 109px; - left: 0; - right: 0; - width: 100%; - border: none; - z-index: 100; - min-height: 380px; } - .editor .entry-markdown .markdown, .editor .entry-markdown .entry-preview-content, - .editor .entry-preview .markdown, - .editor .entry-preview .entry-preview-content { - height: 50px; - overflow: hidden; } } - @media (max-width: 1000px) { - .editor .entry-markdown .floatingheader, - .editor .entry-preview .floatingheader { - cursor: pointer; - width: 50%; - border-right: #edece4 2px solid; - color: #fff; - font-weight: normal; - background: #aaa9a2; - position: absolute; - top: -40px; - left: 0; - box-shadow: rgba(0, 0, 0, 0.1) 0 -2px 3px inset; } - .editor .entry-markdown .floatingheader a, - .editor .entry-preview .floatingheader a { - color: #fff; } } - .editor .entry-markdown .floatingheader a, - .editor .entry-preview .floatingheader a { - color: #aaa9a2; } - .editor .entry-markdown .floatingheader .entry-word-count, - .editor .entry-preview .floatingheader .entry-word-count { - float: right; } - @media (max-width: 1000px) { - .editor .entry-markdown:not(.active) .markdown-help:hover:before, - .editor .entry-preview:not(.active) .markdown-help:hover:before { - color: #fff; } } - .editor .entry-markdown.active, - .editor .entry-preview.active { - z-index: 200; } - .editor .entry-markdown.active .markdown, .editor .entry-markdown.active .entry-preview-content, - .editor .entry-preview.active .markdown, - .editor .entry-preview.active .entry-preview-content { - height: auto; - overflow: auto; } - @media (max-width: 1000px) { - .editor .entry-markdown.active header, - .editor .entry-preview.active header { - cursor: auto; - color: #aaa9a2; - background: #fff; - box-shadow: none; } - .editor .entry-markdown.active header a, - .editor .entry-preview.active header a { - color: #aaa9a2; } } - @media (max-width: 400px) { - .editor .entry-markdown .markdown-help, - .editor .entry-markdown .entry-word-count, - .editor .entry-preview .markdown-help, - .editor .entry-preview .entry-word-count { - display: none; } } -.editor .entry-markdown-content textarea { - border: 0; - width: 100%; - min-height: auto; - height: 100%; - max-width: 100%; - margin: 0; - padding: 10px 20px 50px 20px; - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - -webkit-overflow-scrolling: touch; } - @media (max-width: 600px) { - .editor .entry-markdown-content textarea { - padding: 10px; } } - @media (min-width: 601px) and (max-width: 1000px) { - .editor .entry-markdown-content textarea { - padding: 15px; } } - @media (min-width: 1001px) { - .editor .entry-markdown-content textarea { - top: 40px; } } - @media (max-height: 560px) { - .editor .entry-markdown-content textarea { - height: calc(100% - 40px); } } - .editor .entry-markdown-content textarea:focus { - outline: 0; } -.editor .entry-markdown-content .CodeMirror { - height: auto; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - font-family: Inconsolata, monospace; - font-size: 1.4em; - line-height: 1.3em; - color: #3c4043; } - .editor .entry-markdown-content .CodeMirror .CodeMirror-focused, - .editor .entry-markdown-content .CodeMirror .CodeMirror-selected { - color: #242628; - background: #b3d5f3; - text-shadow: none; } - .editor .entry-markdown-content .CodeMirror ::selection { - color: #242628; - background: #b3d5f3; - text-shadow: none; } -.editor .entry-markdown-content .CodeMirror-lines { - padding: 65px 0 40px 0; - /* Vertical padding around content */ } - @media (max-width: 1000px) { - .editor .entry-markdown-content .CodeMirror-lines { - padding-top: 25px; } } - @media (max-width: 400px) { - .editor .entry-markdown-content .CodeMirror-lines { - padding: 15px 0; } } -.editor .entry-markdown-content .CodeMirror pre { - padding: 0 40px; - /* Horizontal padding of content */ } - @media (max-width: 400px) { - .editor .entry-markdown-content .CodeMirror pre { - padding: 0 15px; } } -.editor .entry-markdown-content .cm-header { - color: #000; - font-size: 1.4em; - line-height: 1.4em; - font-weight: bold; } -.editor .entry-markdown-content .cm-variable-2, -.editor .entry-markdown-content .cm-variable-3, -.editor .entry-markdown-content .cm-keyword { - color: #3c4043; } -.editor .entry-markdown-content .cm-string, -.editor .entry-markdown-content .cm-strong, -.editor .entry-markdown-content .cm-link, -.editor .entry-markdown-content .cm-comment, -.editor .entry-markdown-content .cm-quote, -.editor .entry-markdown-content .cm-number, -.editor .entry-markdown-content .cm-atom, -.editor .entry-markdown-content .cm-tag { - color: #000; - font-weight: bold; } -@media (max-width: 1000px) { - .editor .entry-preview .floatingheader { - right: 0; - left: auto; - border-right: none; - border-left: #edece4 2px solid; } } -.editor .entry-preview .entry-preview-content { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - padding: 60px 40px 40px 40px; - overflow: auto; - word-break: break-word; - hyphens: auto; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; } - @media (max-width: 1000px) { - .editor .entry-preview .entry-preview-content { - padding-top: 20px; } } - @media (max-width: 400px) { - .editor .entry-preview .entry-preview-content { - padding: 15px; } } -@media (max-width: 1000px) { - .editor .scrolling .floatingheader { - box-shadow: none; } } -@media (max-width: 1000px) { - .editor .scrolling .floatingheader::before, .editor .scrolling .floatingheader::after { - display: none; } } -@media (max-width: 1000px) { - .editor .scrolling .CodeMirror-scroll, - .editor .scrolling .entry-preview-content { - box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05) inset; } } - -.markdown-help { - position: relative; - top: -5px; - right: -5px; - float: right; - padding: 5px; } - .markdown-help:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e018"; - color: #cfceca; } - .markdown-help:hover { - text-decoration: none; } - .markdown-help:hover:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e018"; - color: #aaa9a2; } - .markdown-help:hover:hover { - text-decoration: none; } - -/* ============================================================================= - Post Preview Content - ============================================================================= */ -.entry-preview-content, -.content-preview-content { - font-size: 1.4em; - line-height: 1.5em; } - .entry-preview-content a, - .content-preview-content a { - color: #5ba4e5; - text-decoration: underline; } - .entry-preview-content p, - .content-preview-content p { - margin: 1.2em 0 1.6em; } - .entry-preview-content p:first-of-type, - .content-preview-content p:first-of-type { - margin-top: 0; } - .entry-preview-content h1, - .content-preview-content h1 { - font-size: 3em; } - .entry-preview-content h2, - .content-preview-content h2 { - font-size: 2.2em; } - .entry-preview-content h3, - .content-preview-content h3 { - font-size: 1.8em; } - .entry-preview-content .btn, - .content-preview-content .btn { - text-decoration: none; - color: #35393b; } - .entry-preview-content .img-placeholder, - .content-preview-content .img-placeholder { - border: 5px dashed #35393b; - height: 100px; - position: relative; } - .entry-preview-content .img-placeholder span, - .content-preview-content .img-placeholder span { - display: block; - height: 30px; - position: absolute; - margin-top: -15px; - top: 50%; - width: 100%; - text-align: center; } - .entry-preview-content a.image-edit, - .content-preview-content a.image-edit { - width: 16px; - height: 16px; } - .entry-preview-content img, - .content-preview-content img { - max-width: 100%; - height: auto; - margin: 0 auto; } - -/* ============================================================================= - Full Screen Mode - ============================================================================= */ -body.zen { - background: #f3f2ed; } - body.zen .usermenu { - display: none; } - body.zen #global-header, - body.zen #publish-bar { - opacity: 0; - height: 0; - overflow: hidden; - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; } - body.zen main { - top: 15px; - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; } - body.zen .entry-markdown, - body.zen .entry-preview { - bottom: 0; - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; } - -/* ============================================================================= - Publish Bar - ============================================================================= */ -#publish-bar { - height: 40px; - padding: 0; - color: #7d878a; - background: #1a1c1d; - position: fixed; - bottom: 0; - left: 0; - right: 0; - z-index: 900; - box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.2); - -webkit-transform: translateZ(0); - -moz-transform: translateZ(0); - -ms-transform: translateZ(0); - -o-transform: translateZ(0); - transform: translateZ(0); } - @media (max-width: 1000px) { - #publish-bar { - font-weight: normal; } } - #publish-bar .post-settings:hover, #publish-bar .post-settings.active { - color: #e2edf2; } - #publish-bar .post-settings-menu { - position: absolute; - bottom: 44px; - right: -3px; } - #publish-bar .button-save { - min-height: 30px; - height: 30px; - line-height: 12px; - padding: 0 10px; - margin-top: 5px; - border-top: rgba(255, 255, 255, 0.4) 1px solid; } - #publish-bar .options { - width: 30px; - min-height: 30px; - height: 30px; - margin-top: 5px; - border-top: rgba(255, 255, 255, 0.4) 1px solid; } - #publish-bar .splitbutton-save .button-save, - #publish-bar .splitbutton-save .button-delete, - #publish-bar .splitbutton-delete .button-save, - #publish-bar .splitbutton-delete .button-delete { - -webkit-transition: width 0.25s ease, background-color 0.3s linear; - -moz-transition: width 0.25s ease, background-color 0.3s linear; - transition: width 0.25s ease, background-color 0.3s linear; } - #publish-bar .splitbutton-save .editor-options, - #publish-bar .splitbutton-delete .editor-options { - bottom: 140%; - right: -3%; } - #publish-bar .splitbutton-save .editor-options a, - #publish-bar .splitbutton-delete .editor-options a { - font-size: 14px; } - -.extended-tags { - position: static; - min-height: 100%; } - .extended-tags #entry-tags:after { - right: 10px; } - .extended-tags .tags { - width: 281px; } - .extended-tags .tag-label, - .extended-tags .tag-label.touch { - color: #fff; } - .extended-tags .tag-input { - width: 100%; - margin-top: 5px; - padding-top: 5px; - padding-left: 10px; - border-top: 1px solid #242628; } - .extended-tags .right { - display: none; } - -#entry-tags { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - text-transform: none; - padding: 10px 0 0 0; } - #entry-tags:after { - content: ""; - position: fixed; - top: 10px; - right: 220px; - width: 20px; - height: 26px; - background-color: rgba(26, 28, 29, 0); - background-image: -webkit-linear-gradient(left, rgba(26, 28, 29, 0), #1a1c1d); - background-image: linear-gradient(to right,rgba(26, 28, 29, 0), #1a1c1d); - z-index: 9999; - pointer-events: none; } - @media (max-width: 400px) { - #entry-tags:after { - right: 200px; } } - #entry-tags .tags { - position: relative; - display: inline-block; - vertical-align: middle; - width: auto; - max-width: 80%; - max-width: calc(100% - 250px); - height: 22px; - padding-left: 5px; - padding-bottom: 20px; - overflow-x: auto; - overflow-y: hidden; - -webkit-overflow-scrolling: touch; - white-space: nowrap; - -webkit-transition: width 0.2s linear; - -moz-transition: width 0.2s linear; - transition: width 0.2s linear; } - @media (max-width: 400px) { - #entry-tags .tags { - display: block; - max-width: calc(100% - 230px); - padding-bottom: 0; } } - #entry-tags .tag-label { - display: block; - float: left; - padding: 1px 8px 0 8px; - -webkit-transition: all 0.15s ease-out 0s; - -moz-transition: all 0.15s ease-out 0s; - transition: all 0.15s ease-out 0s; } - #entry-tags .tag-label:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e003"; } - #entry-tags .tag-label:hover { - text-decoration: none; } - #entry-tags .tag-label:hover { - cursor: pointer; - color: #e2edf2; } - #entry-tags .tag-label.touch { - color: inherit; } - #entry-tags input[type="text"].tag-input { - display: inline-block; - vertical-align: top; - color: #e2edf2; - font-weight: 300; - background: transparent; - border: none; - width: 150px; - margin-top: -8px; - line-height: 1; - padding: 9px; } - @media (max-width: 400px) { - #entry-tags input[type="text"].tag-input { - position: absolute; - top: 11px; - right: 170px; - width: 20px; } } - #entry-tags input[type="text"].tag-input:focus { - outline: none; } - #entry-tags .tag { - display: inline; - margin-right: 2px; - padding: 0 5px; - color: #e2edf2; - white-space: nowrap; - background: #596063; - border-radius: 2px; - box-shadow: rgba(255, 255, 255, 0.2) 0 1px 0 inset, black 0 1px 3px; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; } - #entry-tags .tag:after { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e034"; - font-size: 8px; - color: #242628; - margin-left: 4px; - vertical-align: 10%; - text-shadow: rgba(255, 255, 255, 0.15) 0 1px 0; - -webkit-transition: all 0.15s ease-out 0s; - -moz-transition: all 0.15s ease-out 0s; - transition: all 0.15s ease-out 0s; } - #entry-tags .tag:hover { - text-decoration: none; } - #entry-tags .tag:hover { - cursor: pointer; } - #entry-tags .tag:hover:after { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e034"; - font-size: 8px; - color: #e2edf2; - margin-left: 4px; - vertical-align: 10%; - text-shadow: none; } - #entry-tags .tag:hover:hover { - text-decoration: none; } - -.suggestions { - bottom: 100%; } - .suggestions li.selected { - background: #5ba4e5; - box-shadow: rgba(255, 255, 255, 0.2) 0 1px 0 inset, rgba(0, 0, 0, 0.5) 0 1px 5px; } - .suggestions li a { - padding-left: 25px; } - .suggestions mark { - background: none; - color: white; - font-weight: bold; } - -#entry-controls { - display: inline-block; - position: relative; - padding: 0; - z-index: 9000; } - #entry-controls.unsaved .post-settings-menu { - padding-bottom: 0; } - #entry-controls.unsaved .post-settings-menu .post-setting:nth-child(3) td { - border-bottom: none; } - #entry-controls.unsaved .post-settings-menu .delete { - display: none; } - -#entry-actions { - margin-right: 6px; - position: relative; } - -#entry-actions-menu { - position: absolute; - bottom: 50px; - right: -5px; } - -/* ============================================================================= - Markdown Help Modal - ============================================================================= */ -.markdown-help-container { - padding-bottom: 20px; } - -.modal-markdown-help-table { - margin-top: 0; } - -/* ============================================================================= - CodeMirror - ============================================================================= */ -.CodeMirror { - /* Set height, width, borders, and global font properties here */ - font-family: monospace; - height: 300px; } - -.CodeMirror-scroll { - /* Set scrolling behaviour here */ - overflow: auto; } - -/* PADDING */ -.CodeMirror-lines { - padding: 4px 0; - /* Vertical padding around content */ } - -.CodeMirror pre { - padding: 0 4px; - /* Horizontal padding of content */ } - -.CodeMirror-scrollbar-filler { - background-color: white; - /* The little square between H and V scrollbars */ } - -/* GUTTER */ -.CodeMirror-gutters { - border-right: 1px solid #ddd; - background-color: #f7f7f7; } - -/* CURSOR */ -.CodeMirror div.CodeMirror-cursor { - border-left: 1px solid black; - z-index: 3; } - -/* Shown when moving in bi-directional text */ -.CodeMirror div.CodeMirror-secondarycursor { - border-left: 1px solid silver; } - -.cm-tab { - display: inline-block; } - -/* DEFAULT THEME */ -.cm-s-default .cm-keyword { - color: #708; } - -.cm-s-default .cm-atom { - color: #219; } - -.cm-s-default .cm-number { - color: #164; } - -.cm-s-default .cm-def { - color: #00f; } - -.cm-s-default .cm-variable { - color: black; } - -.cm-s-default .cm-variable-2 { - color: #05a; } - -.cm-s-default .cm-variable-3 { - color: #085; } - -.cm-s-default .cm-property { - color: black; } - -.cm-s-default .cm-operator { - color: black; } - -.cm-s-default .cm-comment { - color: #a50; } - -.cm-s-default .cm-string { - color: #a11; } - -.cm-s-default .cm-string-2 { - color: #f50; } - -.cm-s-default .cm-meta { - color: #555; } - -.cm-s-default .cm-error { - color: #f00; } - -.cm-s-default .cm-qualifier { - color: #555; } - -.cm-s-default .cm-builtin { - color: #30a; } - -.cm-s-default .cm-bracket { - color: #997; } - -.cm-s-default .cm-tag { - color: #170; } - -.cm-s-default .cm-attribute { - color: #00c; } - -.cm-s-default .cm-header { - color: blue; } - -.cm-s-default .cm-quote { - color: #090; } - -.cm-s-default .cm-hr { - color: #999; } - -.cm-s-default .cm-link { - color: #00c; } - -.cm-negative { - color: #d44; } - -.cm-positive { - color: #292; } - -.cm-header, .cm-strong { - font-weight: bold; } - -.cm-em { - font-style: italic; } - -.cm-link { - text-decoration: underline; } - -.cm-invalidchar { - color: #f00; } - -/* STOP */ -/* The rest of this file contains styles related to the mechanics of - the editor. You probably shouldn't touch them. */ -.CodeMirror { - line-height: 1; - position: relative; - overflow: hidden; - background: white; - color: black; } - -.CodeMirror-scroll { - /* 30px is the magic margin used to hide the element's real scrollbars */ - /* See overflow: hidden in .CodeMirror */ - margin-bottom: -30px; - margin-right: -30px; - padding-bottom: 30px; - padding-right: 30px; - height: 100%; - outline: none; - /* Prevent dragging from highlighting the element */ - position: relative; } - -.CodeMirror-sizer { - position: relative; } - -/* The fake, visible scrollbars. Used to force redraw during scrolling - before actuall scrolling happens, thus preventing shaking and - flickering artifacts. */ -.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler { - position: absolute; - z-index: 6; - display: none; } - -.CodeMirror-vscrollbar { - right: 0; - top: 0; - overflow-x: hidden; - overflow-y: scroll; } - -.CodeMirror-hscrollbar { - bottom: 0; - left: 0; - overflow-y: hidden; - overflow-x: scroll; } - -.CodeMirror-scrollbar-filler { - right: 0; - bottom: 0; - z-index: 6; } - -.CodeMirror-gutters { - position: absolute; - left: 0; - top: 0; - height: 100%; - padding-bottom: 30px; - z-index: 3; } - -.CodeMirror-lines { - cursor: text; } - -.CodeMirror pre { - /* Reset some styles that the rest of the page might have set */ - -moz-border-radius: 0; - -webkit-border-radius: 0; - border-radius: 0; - border-width: 0; - background: transparent; - font-family: inherit; - font-size: inherit; - margin: 0; - white-space: pre; - word-wrap: normal; - line-height: inherit; - color: inherit; - z-index: 2; - position: relative; - overflow: visible; } - -.CodeMirror-wrap pre { - word-wrap: break-word; - white-space: pre-wrap; - word-break: normal; } - -.CodeMirror-wrap .CodeMirror-scroll { - overflow-x: hidden; } - -.CodeMirror-measure { - position: absolute; - width: 100%; - height: 0px; - overflow: hidden; - visibility: hidden; } - -.CodeMirror-measure pre { - position: static; } - -.CodeMirror:not(.CodeMirror-focused) div.CodeMirror-cursor { - visibility: hidden; } - -.CodeMirror div.CodeMirror-cursor { - position: absolute; - border-right: none; - width: 0; } - -.CodeMirror-selected { - background: #d9d9d9; } - -.CodeMirror-focused .CodeMirror-selected { - background: #d7d4f0; } - -/* IE7 hack to prevent it from returning funny offsetTops on the spans */ -.CodeMirror span { - *vertical-align: text-bottom; } - -@media print { - /* Hide the cursor when printing */ - .CodeMirror div.CodeMirror-cursor { - visibility: hidden; } } -/* - * Error page styles - * - * Table of Contents - * - * Error pages - */ -/* ========================================================================== - Error pages - ========================================================================== */ -.error-content { - max-width: 530px; - margin: 0 auto; - padding: 0; - display: table; - height: 100%; } - @media (max-width: 630px) { - .error-content { - max-width: 264px; - text-align: center; } } - -.error-details { - display: table-cell; - vertical-align: middle; } - -.error-image { - display: inline-block; - vertical-align: middle; - width: 96px; - height: 150px; } - @media (max-width: 630px) { - .error-image { - width: 72px; - height: 112px; } } - .error-image img { - width: 100%; - height: 100%; } - -.error-message { - position: relative; - top: -5px; - display: inline-block; - vertical-align: middle; - margin-left: 10px; } - -.error-code { - margin: 0; - font-size: 7.8em; - line-height: 0.9em; - color: #979797; } - @media (max-width: 630px) { - .error-code { - font-size: 5.8em; } } - -.error-description { - margin: 0; - padding: 0; - font-weight: 300; - font-size: 1.9em; - color: #979797; - border: none; } - @media (max-width: 630px) { - .error-description { - font-size: 1.4em; } } - -.error-stack { - margin: 1em auto; - padding: 2em; - max-width: 800px; - background-color: rgba(255, 255, 255, 0.3); } - -.error-stack-list { - list-style-type: none; - padding: 0; - margin: 0; } - -.error-stack-list li { - display: block; } - .error-stack-list li::before { - color: #BBB; - content: "\21AA"; - display: inline-block; - font-size: 1.2em; - margin-right: 0.5em; } - -.error-stack-function { - font-weight: bold; } - -.invite-new-user .modal-body:after { - content: ""; - display: table; - clear: both; } -.invite-new-user .modal-body fieldset { - margin: 1em 0 0 0; } -.invite-new-user .form-group { - margin-bottom: 0; - padding: 0; } - .invite-new-user .form-group label { - position: static; - display: block; - text-align: left; } - .invite-new-user .form-group:nth-of-type(1) { - float: left; - width: 60%; } - .invite-new-user .form-group:nth-of-type(2) { - float: right; - width: 35%; } - .invite-new-user .form-group input, - .invite-new-user .form-group select { - margin-top: 1px; - width: 100%; } -.invite-new-user .button-add { - width: 100%; - padding: 0.85rem 1.9rem; - font-size: 14px; - line-height: 16px; } - -/* - * Post Settings Menu - * - * Table of Contents - * - * Post Settings Menu - */ -/* ========================================================================== - Post Settings Menu - ========================================================================== */ -.post-settings { - display: inline-block; - padding: 0 10px; - color: #7d878a; - -webkit-transition: all 0.15s ease-out 0s; - -moz-transition: all 0.15s ease-out 0s; - transition: all 0.15s ease-out 0s; - position: relative; - top: 1px; } - .post-settings:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e006"; - font-size: 14px; } - .post-settings:hover { - text-decoration: none; } - .post-settings:hover, .post-settings.active { - color: #242628; } - -.post-settings-menu { - padding-top: 0; - text-transform: none; } - .post-settings-menu table { - margin: 0; } - .post-settings-menu td { - padding: 0; - border-top: none; - border-bottom: #414648 1px solid; } - .post-settings-menu .post-setting-label { - padding: 8px 10px 8px 15px; - border-right: #414648 1px solid; - text-align: right; } - .post-settings-menu label { - position: static; - width: auto; - font-weight: normal; - color: #7d878a; - white-space: nowrap; } - .post-settings-menu input { - width: 200px; - margin: 0; } - @media (max-width: 550px) { - .post-settings-menu input { - width: 200px; } } - .post-settings-menu input[type="text"] { - border: none; - padding: 8px 0 8px 10px; - color: #e2edf2; - border-radius: 0; - background: transparent; } - .post-settings-menu input[type="text"]:focus { - background: #35393b; - border: none; } - .post-settings-menu .post-setting-item { - padding: 5px 0 0 10px; } - .post-settings-menu .post-setting-item.no-padding { - padding: 0; } - .post-settings-menu .gh-select { - height: 36px; } - .post-settings-menu .gh-select:after { - color: #e2edf2; - margin-top: -0.425em; } - .post-settings-menu .gh-select select { - border: 0; - background: transparent; - border-radius: 0; - color: #e2edf2; - height: 36px; } - .post-settings-menu .gh-select select:focus { - background: #35393b; } - @media (max-width: 550px) { - .post-settings-menu .gh-select, - .post-settings-menu .gh-select select { - height: 41px; } } - .post-settings-menu .checkbox { - position: relative; - margin-top: 0; - top: 0; - border: 0; } - .post-settings-menu .checkbox:after { - border-color: #4d5356; - background: #35393b; } - .post-settings-menu input[type='checkbox']:focus + .checkbox:after { - border-color: #4d5356; } - .post-settings-menu .delete { - display: block; - padding: 10px 15px; - width: 100%; - text-align: left; } - .post-settings-menu .delete:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e023"; - position: relative; - top: -1px; - margin-right: 10px; } - .post-settings-menu .delete:hover { - text-decoration: none; } - .post-settings-menu .delete:hover { - background: #e25440; - color: #fff; } - -/* - * Setting pages styles - * - * Table of Contents - * - * Settings - * Sidebar - * Content - * Code Injection - */ -/* ========================================================================== - Settings - ========================================================================== */ -.settings .wrapper { - background: #fff; - box-shadow: rgba(0, 0, 0, 0.05) 0 1px 5px; - position: relative; - width: 100%; - height: 100%; - margin: 0; - padding: 0; } - @media (max-width: 800px) { - .settings .wrapper { - top: -55px; - margin-top: 55px; - overflow-x: hidden; } } -.settings .title { - text-transform: uppercase; - font-weight: normal; - font-size: 1.6em; - line-height: 0.8em; - margin: 0 0 18px 0; - padding: 0; - border: none; } - -/* ============================================================================= - Sidebar - ============================================================================= */ -.settings-sidebar { - width: 20%; - position: absolute; - top: 0; - left: 0; - bottom: 0; - z-index: 700; - background: #fff; - box-shadow: #edece4 1px 0 0; } - @media (max-width: 800px) { - .settings-sidebar { - width: 100%; - box-shadow: none; } } - .settings-sidebar > header { - position: relative; - z-index: 400; - height: 17px; - padding: 30px 15px 47px 40px; - margin-bottom: 0; - border-bottom: none; - box-shadow: #edece4 0 -1px 0 inset, #edece4 1px 0 0; - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(25%, white), color-stop(100%, rgba(255, 255, 255, 0.9))); - background: -webkit-linear-gradient(top, white 0%, white 25%, rgba(255, 255, 255, 0.9) 100%); - background: linear-gradient(to bottom, white 0%, white 25%, rgba(255, 255, 255, 0.9) 100%); } - @media (max-width: 1000px) { - .settings-sidebar > header { - padding-left: 15px; } } - -.settings-menu { - position: absolute; - top: 0; - left: 0; - bottom: 0; - right: -1px; - overflow: auto; } - @media (max-width: 800px) { - .settings-menu { - right: 0; } } - .settings-menu:before { - display: block; - content: ""; - height: 77px; } - .settings-menu ul { - border-top: none; } - @media (max-width: 800px) { - .settings-menu ul { - border-bottom: #edece4 1px solid; } } - .settings-menu li { - margin-right: 1px; - border-top: #fff 1px solid; } - @media (max-width: 800px) { - .settings-menu li { - margin-right: 0; - border-top: #edece4 1px solid; } } - .settings-menu li a { - padding: 15px 15px 15px 40px; - border-bottom: none; } - @media (max-width: 1000px) { - .settings-menu li a { - padding-left: 15px; } } - @media (max-width: 800px) { - .settings-menu li a:after { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e01d"; - float: right; - margin-top: 5px; } - .settings-menu li a:hover { - text-decoration: none; } } - .settings-menu li:first-child { - border-top: none; } - .settings-menu li:first-child.active { - border-top: none; } - @media (min-width: 801px) { - .settings-menu li.active { - margin-right: 0; - position: relative; - z-index: 300; - border-top: #edece4 1px solid; - box-shadow: #fff 1px 0 0, #edece4 0 1px 0; - -webkit-transition: all 0.15s ease-out 0s; - -moz-transition: all 0.15s ease-out 0s; - transition: all 0.15s ease-out 0s; } - .settings-menu li.active a { - color: #242628; - font-weight: bold; - background: #fff; } - .settings-menu li.active a:focus { - background: #edece4; } } - .settings-menu li a:before { - margin-right: 20px; } - @media (max-width: 1000px) { - .settings-menu li a:before { - margin-right: 15px; } } - .settings-menu .about a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e000"; } - .settings-menu .about a:hover { - text-decoration: none; } - .settings-menu .general a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e006"; } - .settings-menu .general a:hover { - text-decoration: none; } - .settings-menu .publishing a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e02d"; } - .settings-menu .publishing a:hover { - text-decoration: none; } - .settings-menu .services a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e020"; } - .settings-menu .services a:hover { - text-decoration: none; } - .settings-menu .users a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e002"; } - .settings-menu .users a:hover { - text-decoration: none; } - .settings-menu .appearance a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e021"; } - .settings-menu .appearance a:hover { - text-decoration: none; } - .settings-menu .apps a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e00b"; } - .settings-menu .apps a:hover { - text-decoration: none; } - .settings-menu .code a:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e03e"; } - .settings-menu .code a:hover { - text-decoration: none; } - -/* ============================================================================= - Content - ============================================================================= */ -.settings-content { - padding: 0; - position: absolute; - top: 0; - right: 0; - left: 20%; - bottom: 0; - background: #fff; } - @media (max-width: 800px) { - .settings-content { - width: 100%; - left: 100%; - right: -100%; - margin-left: 15px; } } - .settings-content .settings-general img { - max-width: 100%; - max-height: 400px; } - .settings-content > header { - position: relative; - z-index: 200; - height: 17px; - padding: 30px 220px 46px 40px; - border-bottom: #edece4 1px solid; - margin-bottom: 40px; - text-transform: none; - font-weight: normal; - line-height: inherit; - color: inherit; - background: -moz-linear-gradient(top, white 0%, white 25%, rgba(255, 255, 255, 0.9) 100%); - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(25%, white), color-stop(100%, rgba(255, 255, 255, 0.9))); - background: -webkit-linear-gradient(top, white 0%, white 25%, rgba(255, 255, 255, 0.9) 100%); - background: -o-linear-gradient(top, white 0%, white 25%, rgba(255, 255, 255, 0.9) 100%); - background: -ms-linear-gradient(top, white 0%, white 25%, rgba(255, 255, 255, 0.9) 100%); - background: linear-gradient(to bottom, white 0%, white 25%, rgba(255, 255, 255, 0.9) 100%); } - @media (max-width: 1000px) { - .settings-content > header { - padding-left: 15px; } } - @media (max-height: 600px) { - .settings-content > header { - height: auto; - padding: 5px; - position: absolute; - top: 0; - right: 0; - border: none; - background: transparent; } - .settings-content > header .title { - display: none; } } - @media (max-width: 650px) { - .settings-content > header { - padding-left: 15px; } - .settings-content > header .button-back { - position: fixed; - top: 5px; - left: 14px; - min-height: 0; - height: 30px; - display: block; } - .settings-content > header .button-back:before { - left: -9px; - border-width: 15px 9px 15px 0; } } - .settings-content > header .header-inner { - position: absolute; - top: 0; - left: 0; - right: 0; - height: 100px; - outline: 1px solid red; } - .settings-content .page-actions { - position: absolute; - top: 20px; - right: 40px; - z-index: 700; - font-size: 1em; } - @media (max-width: 1000px) { - .settings-content .page-actions { - right: 15px; } } - @media (max-width: 650px) { - .settings-content .page-actions { - position: fixed; - top: 5px; - right: 4px; } - .settings-content .page-actions .button-save { - min-height: 0; - height: 30px; - padding: 0.5em 1.37em; } } - .settings-content .page-actions.page-actions-alt { - left: 40px; } - @media (max-width: 1000px) { - .settings-content .page-actions.page-actions-alt { - left: 15px; } } - .settings-content .page-actions .button-add { - position: relative; - padding-left: 50px; - border: rgba(0, 0, 0, 0.07) 1px solid; } - .settings-content .page-actions .button-add:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e032"; - font-size: 1.4em; - color: rgba(255, 255, 255, 0.6); - position: absolute; - top: 0; - padding: 9px 8px 0 0; - left: 9px; - bottom: 0; - width: 26px; - border-right: rgba(0, 0, 0, 0.07) 1px solid; } - .settings-content .page-actions .button-add:hover { - text-decoration: none; } - @media (max-width: 650px) { - .settings-content .page-actions .button-add { - height: 30px; - min-height: 30px; - padding: 7px 10px 7px 40px; } - .settings-content .page-actions .button-add:before { - padding-top: 7px; - left: 6px; - width: 24px; } } - .settings-content .content { - position: absolute; - top: 0; - right: 0; - left: 0; - bottom: 0; - padding: 40px; - overflow: auto; - -webkit-overflow-scrolling: touch; } - .settings-content .content:before { - display: block; - content: ""; - height: 77px; } - @media (max-height: 600px) { - .settings-content .content:before { - display: none; } } - .settings-content .content.no-padding { - padding: 0; } - @media (max-width: 1000px) { - .settings-content .content { - padding-left: 15px; } } - @media (max-width: 550px) { - .settings-content .content { - padding: 0 15px 40px; } } - .settings-content .description-container textarea, - .settings-content .bio-container textarea { - min-height: 115px; } - .settings-content .word-count { - float: right; - font-weight: bold; - color: #9e9d95; } - @media (max-width: 550px) { - .settings-content textarea { - max-width: 100%; } - .settings-content textarea + p { - max-width: 100%; } } - -/* ============================================================================= - Code Injection - ============================================================================= */ -.header-injection, -.footer-injection { - margin-top: 3.2em; } - -/* - * Setup screen styles - * - * Table of Contents - * - * Setup Ghost for The First Time - */ -/* ========================================================================== - Setup Ghost for The First Time - ========================================================================== */ -.ghost-setup { - color: #7d878a; - background: #242628; } - @media (max-width: 550px) { - .ghost-setup { - background: #18191b; } } - .ghost-setup main { - top: 15px; } - @media (max-width: 550px) { - .ghost-setup main { - top: 0; } } - .ghost-setup input:-webkit-autofill { - -webkit-box-shadow: 0 0 0px 1000px #e2edf2 inset !important; } - .ghost-setup h1 { - margin: 0; - font-weight: 200; - font-size: 26px; - color: #e2edf2; } - @media (max-width: 550px) { - .ghost-setup h1 { - font-size: 20px; } } - .ghost-setup h2 { - margin: 6px 0 0 0; - padding: 0; - border: none; - font-weight: 200; - font-size: 16px; - color: #7d878a; } - @media (max-width: 550px) { - .ghost-setup h2 { - font-size: 14px; } } - -.setup-box { - display: table; - max-width: 500px; - height: 90%; - margin: 0 auto; - padding: 0; } - -.setup-form { - max-width: 530px; - padding: 40px; - color: #a5acae; - background: #18191b; - border-radius: 2px; } - @media (max-width: 400px) { - .setup-form { - padding: 15px; } } - .setup-form header { - margin-bottom: 35px; } - @media (max-width: 550px) { - .setup-form header { - margin-bottom: 35px; } } - .setup-form footer { - margin: 30px 0 5px 0; } - @media (max-width: 550px) { - .setup-form footer { - margin-top: 35px; } } - .setup-form label { - color: #e2edf2; - font-weight: 300; } - @media (max-width: 550px) { - .setup-form label { - width: 100%; } } - .setup-form input { - padding: 7px; - border: none; - color: #fff; - background: #3c4043; - -webkit-transition: background ease 0.25s; - -moz-transition: background ease 0.25s; - transition: background ease 0.25s; } - .setup-form input:focus { - border: none; - background: #484c50; } - .setup-form p { - font-size: 12px; - line-height: 1.4em; - color: #7d878a; } - .setup-form .button-add { - width: 100%; - padding: 0.9em 1.8em; - font-size: 13px; } - -/* - * Users screen styles - * - * Table of Contents - * - * Users - * User Profile - */ -/* ========================================================================== - Users - ========================================================================== */ -.settings { - /* ============================================================================= - User Profile - ============================================================================= */ } - .settings .user-group-header { - margin-bottom: 0px; - padding-bottom: 20px; - border: 0 none; - border-bottom: 1px solid #d9d6c5; } - .settings .user-group-header h3 { - display: inline-block; - margin: 0; - color: #c0bfb6; - font-weight: normal; - font-size: 1.1em; - line-height: 1em; } - .settings .user-search { - display: inline-block; - float: right; } - .settings .user-search label { - margin: 0; } - .settings .user-search:hover .user-search-input, - .settings .user-search .user-search-input:focus { - width: 260px; - padding: 0 10px; } - .settings .user-search .user-search-input { - width: 0px; - padding: 0; - border: none; - border-bottom: #f1f0ea 1px solid; - -webkit-transition: width 0.2s ease-in-out; - -moz-transition: width 0.2s ease-in-out; - transition: width 0.2s ease-in-out; - box-shadow: none; } - .settings .user-search .search-icon:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e007"; - font-size: 1em; - color: #c0bfb6; } - .settings .user-search .search-icon:hover { - text-decoration: none; } - .settings .users { - padding: 0px; - margin-top: 0px; - list-style: none; } - .settings .user { - display: block; - width: 100%; - padding: 20px; - border: 0 none; - border-top: 1px solid #e2edf2; } - .settings .user:first-child { - border: none; } - .settings .user .user-image { - display: inline-block; - width: 40px; - height: 40px; - margin-right: 17px; - vertical-align: middle; - background-color: #edece4; - border-radius: 20px; } - .settings .user .user-image.invite { - padding-top: 8px; - text-align: center; } - .settings .user .user-image.invite:before { - font-family: "GhostIcons"; - font-weight: normal; - font-style: normal; - vertical-align: -7%; - text-transform: none; - speak: none; - line-height: 1; - -webkit-font-smoothing: antialiased; - content: "\e012"; - font-size: 1em; - color: #aaa9a2; } - .settings .user .user-image.invite:hover { - text-decoration: none; } - .settings .user .user-image img { - width: 40px; - height: 40px; - border-radius: 20px; } - .settings .user .user-meta { - display: inline-block; - vertical-align: middle; } - .settings .user .user-name { - margin: 0; - margin-top: 0.4em; - font-weight: 400; - font-size: 1.2em; - line-height: 1em; } - .settings .user .user-last-seen { - line-height: 1em; } - .settings .user-actions-cog { - margin-right: 6px; } - .settings .user-actions-menu { - top: 49px; - right: 69px; - width: 145px; } - .settings .user-actions-menu .delete:hover { - background: #e25440; } - .settings .user-role { - padding: 2px 8px; - float: right; - font-size: 0.8em; - color: #fff; - text-transform: uppercase; } - .settings .user-role.admin { - background-color: #DE523A; } - .settings .user-role.editor { - background-color: #4A8CBD; } - .settings .user-profile-header { - position: relative; - max-height: 400px; - overflow: hidden; } - .settings .user-profile-header:after { - content: ""; - position: absolute; - left: 0; - right: 0; - bottom: 0; - height: 110px; - background-color: transparent; - background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.3)); - background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.3)); } - .settings .cover-image { - display: block; - line-height: 0; - width: 100%; - height: auto; - min-height: 180px; } - .settings .edit-cover-image { - position: absolute; - right: 35px; - bottom: 34px; - min-height: 34px; - height: 34px; - background: rgba(0, 0, 0, 0.3); - border-radius: 0; - color: rgba(255, 255, 255, 0.8); - z-index: 2; - border-radius: 2px; - -webkit-transition: color 0.3s ease, background 0.3s ease; - -moz-transition: color 0.3s ease, background 0.3s ease; - transition: color 0.3s ease, background 0.3s ease; } - @media (max-width: 1000px) { - .settings .edit-cover-image { - right: 15px; } } - .settings .edit-cover-image:hover { - color: #fff; - background: rgba(0, 0, 0, 0.5); } - .settings .user-image + .form-group { - margin-top: 155px; - max-width: 500px; } - @media (min-width: 651px) and (max-width: 1000px) { - .settings .user-image + .form-group { - width: calc(100% - 201px); } } - @media (min-width: 651px) { - .settings .user-image + .form-group { - min-width: 285px; - margin-top: 0; - top: -110px; - left: 40px; } } - @media (min-width: 1001px) { - .settings .user-image + .form-group { - width: calc(100% - 221px); } } - .settings .user-profile { - position: relative; - top: -110px; - z-index: 1; } - @media (min-width: 651px) { - .settings .user-profile { - padding-left: 143px; } } - .settings .user-profile fieldset { - padding: 0 40px; } - .settings .user-profile textarea { - min-width: 240px; } - @media (max-width: 650px) { - .settings fieldset.user-details-top { - margin-bottom: 10px; } } - @media (min-width: 651px) { - .settings fieldset.user-details-top { - margin-bottom: 0; - padding: 0; } - .settings fieldset.user-details-top p { - color: #fff; } } - @media (max-width: 550px) { - .settings fieldset.user-details-top, - .settings fieldset.user-details-bottom { - padding-left: 15px; - padding-right: 15px; } } - .settings .user-image { - display: block; - position: relative; - width: 126px; - height: 126px; - float: left; - margin-left: 34px; - margin-right: 20px; - text-align: center; - border-radius: 100%; - overflow: hidden; - padding: 3px; - background: #fff; - z-index: 2; - margin-left: -104px; } - @media (max-width: 550px) { - .settings .user-image { - margin-left: 0px; } } - @media (min-width: 551px) and (max-width: 650px) { - .settings .user-image { - margin-left: 20px; } } - .settings .user-image .img { - display: block; - width: 120px; - height: 120px; - background-size: cover; - background-position: center center; - border-radius: 100%; } - .settings .user-image:hover .edit-user-image { - opacity: 1; } - .settings .edit-user-image { - position: absolute; - top: 3px; - right: 3px; - bottom: 3px; - left: 3px; - border-radius: 100%; - width: calc(100% - 6px); - background: rgba(0, 0, 0, 0.5); - opacity: 0; - color: #fff; - line-height: 120px; - text-transform: uppercase; - text-decoration: none; - -webkit-transition: opacity 0.3s ease; - -moz-transition: opacity 0.3s ease; - transition: opacity 0.3s ease; } - @media (min-width: 651px) { - .settings label[for='user-name'] { - visibility: hidden; } - .settings #user-name { - border-color: #fff; - font-size: 1.5rem; - padding: 3px 12px; } } - .settings .user-details-bottom { - padding: 0 40px; } - @media (min-width: 651px) { - .settings .user-details-bottom { - margin: -104px 0 0 0; } } - -@media (max-width: 650px) { - .users-back { - display: none; } } -@media (max-width: 650px) { - .page-actions .user-actions-cog { - padding: 7px 0; - min-height: 30px; } - .page-actions .user-actions-cog .icon-settings { - margin-left: 8px; - margin-right: 8px; } - - .settings .user-actions-menu { - top: 43px; - right: 66px; } - - .settings-content .user-settings-header { - height: 0; - padding: 0; - margin: 0; - border-bottom: 0; } - - .user-settings-header .title, - .settings-content .settings-user:before { - display: none; } } diff --git a/ghost/admin/docs/dist/css/ghost-ui.min.css b/ghost/admin/docs/dist/css/ghost-ui.min.css index ed3a677e8d..38395ab775 100644 --- a/ghost/admin/docs/dist/css/ghost-ui.min.css +++ b/ghost/admin/docs/dist/css/ghost-ui.min.css @@ -1,20 +1 @@ -html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}*,*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}::-moz-selection{color:#242628;background:#b3d5f3;text-shadow:none}::selection{color:#242628;background:#b3d5f3;text-shadow:none}.darkgrey-bg{background:#242628}.darkgrey{color:#242628}.grey-bg{background:#35393b}.grey{color:#35393b}.midgrey-bg{background:#7d878a}.midgrey{color:#7d878a}.lightgrey-bg{background:#e2edf2}.lightgrey{color:#e2edf2}.brown-bg{background:#aaa9a2}.brown{color:#aaa9a2}.midbrown-bg{background:#c0bfb6}.midbrown{color:#c0bfb6}.lightbrown-bg{background:#edece4}.lightbrown{color:#edece4}.blue-bg{background:#5ba4e5}.blue{color:#5ba4e5}.red-bg{background:#e25440}.red{color:#e25440}.orange-bg{background:#f2a925}.orange{color:#f2a925}.green-bg{background:#9fbb58}.green{color:#9fbb58}*:not(img):focus{outline:0;outline-width:0}body{width:100%;background:#edece4}.clearfix:after{content:"";display:table;clear:both}.wrapper{position:relative}.right{float:right}.left{float:left}.vertical{display:table-cell;vertical-align:middle}.box,.entry-container .entry-title{padding:15px;margin-bottom:15px;background:#fff;position:relative;box-shadow:rgba(0,0,0,0.05) 0 1px 5px}.box header,.entry-container .entry-title header{height:14px;border-bottom:1px solid #edece4;padding-bottom:15px;margin-bottom:15px;text-transform:uppercase;font-size:0.85em;color:#aaa9a2}.box footer,.entry-container .entry-title footer{height:14px;border-top:1px solid #edece4;padding-top:10px;margin-top:15px;text-transform:uppercase;font-size:0.85em;color:#aaa9a2}.box header a,.entry-container .entry-title header a,.box footer a,.entry-container .entry-title footer a{color:#aaa9a2}.box header a:hover,.entry-container .entry-title header a:hover,.box footer a:hover,.entry-container .entry-title footer a:hover{color:#242628;text-decoration:none}main{position:absolute;top:55px;right:15px;bottom:0;left:15px;padding:0}@media (max-width: 400px){main{top:40px;left:0;right:0}} -.invisible{visibility:hidden}.hidden,.visuallyhidden,.screen-reader-text{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto}@-webkit-keyframes off-canvas{from{opacity:0}to{opacity:1}}@-moz-keyframes off-canvas{from{opacity:0}to{opacity:1}}@keyframes off-canvas{from{opacity:0}to{opacity:1}}@-webkit-keyframes fade-in{from{opacity:0}to{opacity:1}}@-moz-keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes fade-in{from{opacity:0}to{opacity:1}}.fade-in{-o-animation:fade-in 1s;-moz-animation:fade-in 1s;-webkit-animation:fade-in 1s;animation:fade-in 1s}@-webkit-keyframes fade-in-snap{to{opacity:1}}@-moz-keyframes fade-in-snap{to{opacity:1}}@keyframes fade-in-snap{to{opacity:1}}@-webkit-keyframes fade-out{from{opacity:1}to{opacity:0}}@-moz-keyframes fade-out{from{opacity:1}to{opacity:0}}@keyframes fade-out{from{opacity:1}to{opacity:0}}.fade-out{-o-animation:fade-out 0.5s;-moz-animation:fade-out 0.5s;-webkit-animation:fade-out 0.5s;animation:fade-out 0.5s}@font-face{font-family:'GhostIcons';src:url("../fonts/icons.eot");src:url("../fonts/icons.eot?#iefix") format("embedded-opentype"),url("../fonts/icons.woff") format("woff"),url("../fonts/icons.ttf") format("truetype"),url("../fonts/icons.svg#icons") format("svg");font-weight:normal;font-style:normal}[class*=icon-]:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased}[class*=icon-]:hover{text-decoration:none}.icon-ghost:before{content:"\e000"}.icon-ghost-logo:before{content:"\e600"}.icon-chevron-down:before{content:"\e001"}.icon-users:before{content:"\e002"}.icon-tag:before{content:"\e003"}.icon-tablet:before{content:"\e004"}.icon-menu:before{content:"\e005"}.icon-settings:before{content:"\e006"}.icon-search:before{content:"\e007"}.icon-search-left:before{content:"\e008"}.icon-rss:before{content:"\e009"}.icon-preview:before{content:"\e00a"}.icon-app:before{content:"\e00b"}.icon-pin:before{content:"\e00c"}.icon-pc:before{content:"\e00d"}.icon-pacman:before{content:"\e00e"}.icon-edit:before{content:"\e00f"}.icon-mobile:before{content:"\e010"}.icon-image:before{content:"\e011"}.icon-mail:before{content:"\e012"}.icon-list:before{content:"\e013"}.icon-info:before{content:"\e014"}.icon-home:before{content:"\e015"}.icon-grid:before{content:"\e016"}.icon-fullscreen:before{content:"\e017"}.icon-question:before{content:"\e018"}.icon-external:before{content:"\e019"}.icon-error:before{content:"\e01a"}.icon-comments:before{content:"\e01b"}.icon-close:before{content:"\e01c"}.icon-chevron:before{content:"\e01d"}.icon-chevron-left:before{content:"\e11d"}.icon-calendar:before{content:"\e01e"}.icon-archive:before{content:"\e01f"}.icon-services:before{content:"\e020"}.icon-appearance:before{content:"\e021"}.icon-video:before{content:"\e022"}.icon-trash:before{content:"\e023"}.icon-reply:before{content:"\e024"}.icon-stats:before{content:"\e025"}.icon-featured:before{content:"\e026"}.icon-unfeatured:before{content:"\e027"}.icon-clock:before{content:"\e028"}.icon-settings2:before{content:"\e029"}.icon-camera:before{content:"\e036"}.icon-power:before{content:"\e02b"}.icon-lock:before{content:"\e02c"}.icon-content:before{content:"\e02d"}.icon-user:before{content:"\e02e"}.icon-support:before{content:"\e02f"}.icon-success:before{content:"\e030"}.icon-notification:before{content:"\e031"}.icon-add:before{content:"\e032"}.icon-check:before{content:"\e033"}.icon-x:before{content:"\e034"}.icon-link:before{content:"\e035"}.icon-camera:before{content:"\e036"}.icon-repost:before{content:"\e037"}.icon-weather-rain:before{content:"\e038"}.icon-weather-sun:before{content:"\e039"}.icon-weather-partial:before{content:"\e03a"}.icon-weather-snow:before{content:"\e03b"}.icon-weather-cloudy:before{content:"\e03c"}.icon-lightning:before{content:"\e03d"}button{border:0;padding:0;background:transparent;-webkit-transition:all 0.15s ease-in-out;-moz-transition:all 0.15s ease-in-out;transition:all 0.15s ease-in-out}.button,.modal-footer .reject-button-class,.button-dark,.button-save,.button-add,.button-delete,.button-alt,.button-info,.button-link,.button-back{min-height:35px;width:auto;display:inline-block;padding:0.9em 1.37em;text-decoration:none;color:#fff;font-size:11px;line-height:13px;font-weight:300;text-align:center;letter-spacing:1px;text-transform:uppercase;text-shadow:none;border-radius:0.2em;border:rgba(0,0,0,0.05) 0.1em solid;-webkit-transition:background 0.3s ease,border-color 0.3s ease;-moz-transition:background 0.3s ease,border-color 0.3s ease;transition:background 0.3s ease,border-color 0.3s ease}.button:hover,.modal-footer .reject-button-class:hover,.button-dark:hover,.button-save:hover,.button-add:hover,.button-delete:hover,.button-alt:hover,.button-info:hover,.button-link:hover,.button-back:hover,.hover.button,.modal-footer .hover.reject-button-class,.hover.button-dark,.hover.button-save,.hover.button-add,.hover.button-delete,.hover.button-alt,.hover.button-info,.hover.button-link,.hover.button-back,.button:focus,.modal-footer .reject-button-class:focus,.button-dark:focus,.button-save:focus,.button-add:focus,.button-delete:focus,.button-alt:focus,.button-info:focus,.button-link:focus,.button-back:focus{will-change:border-color, background;border-color:transparent;background:#f8f8f8;text-decoration:none}.button:active,.modal-footer .reject-button-class:active,.button-dark:active,.button-save:active,.button-add:active,.button-delete:active,.button-alt:active,.button-info:active,.button-link:active,.button-back:active{box-shadow:rgba(0,0,0,0.3) 0 1px 3px inset}.button:disabled,.modal-footer .reject-button-class:disabled,.button-dark:disabled,.button-save:disabled,.button-add:disabled,.button-delete:disabled,.button-alt:disabled,.button-info:disabled,.button-link:disabled,.button-back:disabled{opacity:0.5}.large.button,.modal-footer .large.reject-button-class,.large.button-dark,.large.button-save,.large.button-add,.large.button-delete,.large.button-alt,.large.button-info,.large.button-link,.large.button-back{padding:1em 1.8em;font-size:14px;line-height:16px}[class*='icon-'].button,.modal-footer [class*='icon-'].reject-button-class,[class*='icon-'].button-dark,[class*='icon-'].button-save,[class*='icon-'].button-add,[class*='icon-'].button-delete,[class*='icon-'].button-alt,[class*='icon-'].button-info,[class*='icon-'].button-link,[class*='icon-'].button-back{position:relative;padding-left:calc(1.37em + 36px)}[class*='icon-'].button:before,.modal-footer [class*='icon-'].reject-button-class:before,[class*='icon-'].button-dark:before,[class*='icon-'].button-save:before,[class*='icon-'].button-add:before,[class*='icon-'].button-delete:before,[class*='icon-'].button-alt:before,[class*='icon-'].button-info:before,[class*='icon-'].button-link:before,[class*='icon-'].button-back:before{position:absolute;top:0;left:0;bottom:0;width:35px;font-size:13px;line-height:35px;border-right:1px solid rgba(36,38,40,0.1);opacity:0.95}[class*='icon-'].large.button,.modal-footer [class*='icon-'].large.reject-button-class,[class*='icon-'].large.button-dark,[class*='icon-'].large.button-save,[class*='icon-'].large.button-add,[class*='icon-'].large.button-delete,[class*='icon-'].large.button-alt,[class*='icon-'].large.button-info,[class*='icon-'].large.button-link,[class*='icon-'].large.button-back{padding-left:calc(1.8em + 46px)}[class*='icon-'].large.button:before,.modal-footer [class*='icon-'].large.reject-button-class:before,[class*='icon-'].large.button-dark:before,[class*='icon-'].large.button-save:before,[class*='icon-'].large.button-add:before,[class*='icon-'].large.button-delete:before,[class*='icon-'].large.button-alt:before,[class*='icon-'].large.button-info:before,[class*='icon-'].large.button-link:before,[class*='icon-'].large.button-back:before{width:46px;line-height:46px;font-size:17px}[class*='button'][class*='has-icon']{padding-left:0}[class*='button'][class*='has-icon'] [class*='icon-']{margin-left:11px;margin-right:4px}[class*='button'][class*='has-icon'] [class*='icon-']:before{font-size:0.9rem}[class*='button'].only-has-icon{padding-right:0}[class*='button'].only-has-icon [class*='icon-']{margin-right:11px}.button,.modal-footer .reject-button-class{color:#777;font-weight:normal;background:#eee;box-shadow:none}.button:hover,.modal-footer .reject-button-class:hover,.button:focus,.modal-footer .reject-button-class:focus{border-color:rgba(0,0,0,0.1)}.button-dark{color:#fff;font-weight:normal;background:#A1ADB3;box-shadow:none;border-color:#A1ADB3}.button-dark:hover,.button-dark:focus{border-color:#85949c;background:#85949c}.button-save{background:#5ba4e5;box-shadow:none}.button-save:hover,.button-save:focus{background:#2f8cde}.button-add{background:#9fbb58}.button-add:hover,.button-add:focus{background:#8ba644}.button-delete{background:#e25440;box-shadow:none}.button-delete:hover,.button-delete:focus{background:#cf3520}.button-alt{background:#3c4043}.button-alt:hover,.button-alt:focus{background:#242628}.button-alt[class*='icon-']:before{border-right-color:#3c4043}.button-info{background:#A1ADB3}.button-info:hover,.button-info:focus{background:#bdc6ca}.button-link{color:#5ba4e5;background:transparent;border:none}.button-link:hover,.button-link:focus{background:transparent;text-decoration:underline}.button-back{position:absolute;top:20px;left:20px;margin-right:30px;padding:0.5em 1.37em 0.5em 1.10em;display:none;color:#fff;background:#5ba4e5;border:none;border-top-left-radius:0;border-bottom-left-radius:0}.button-back:before{content:' ';position:absolute;top:0;left:-10px;width:0;height:0;border-width:18px 10px 18px 0;border-color:transparent #5ba4e5 transparent transparent;border-style:solid solid solid none;-webkit-transform:scale(0.9999);-moz-transform:scale(0.9999);-ms-transform:scale(0.9999);-o-transform:scale(0.9999);transform:scale(0.9999);-webkit-transition:border-color 0.3s ease;-moz-transition:border-color 0.3s ease;transition:border-color 0.3s ease}.button-back:hover,.button-back:focus{color:#fff;background:#2f8cde;border-color:#2f8cde}.button-back:hover:before,.button-back:focus:before{border-right-color:#2f8cde}.splitbutton,.splitbutton-save,.splitbutton-add,.splitbutton-delete,.splitbutton-alt{display:inline-block;position:relative;font-size:0;white-space:nowrap}.splitbutton button,.splitbutton-save button,.splitbutton-add button,.splitbutton-delete button,.splitbutton-alt button{font-size:11px;border-top-right-radius:0;border-bottom-right-radius:0}.splitbutton .options,.splitbutton-save .options,.splitbutton-add .options,.splitbutton-delete .options,.splitbutton-alt .options{display:inline-block;position:relative;width:35px;height:35px;margin-left:-1px;vertical-align:top;text-align:center;color:#fff;background:#e5e5e5;border-radius:0 2px 2px 0;border-left:0;box-shadow:rgba(0,0,0,0.02) 0 1px 0 inset,rgba(0,0,0,0.02) -1px 0 0 inset,rgba(0,0,0,0.02) 0 -1px 0 inset;-webkit-transition:background-color 0.3s linear;-moz-transition:background-color 0.3s linear;transition:background-color 0.3s linear}.splitbutton .options:before,.splitbutton-save .options:before,.splitbutton-add .options:before,.splitbutton-delete .options:before,.splitbutton-alt .options:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e001";font-size:9px;position:absolute;top:50%;right:50%;margin-top:-3px;margin-right:-5px;-webkit-transition:margin-top 0.3s ease;-moz-transition:margin-top 0.3s ease;transition:margin-top 0.3s ease;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform;-webkit-transition-duration:0.3;-moz-transition-duration:0.3;transition-duration:0.3;-webkit-transition-timing-function:ease;-moz-transition-timing-function:ease;transition-timing-function:ease}.splitbutton .options:hover,.splitbutton-save .options:hover,.splitbutton-add .options:hover,.splitbutton-delete .options:hover,.splitbutton-alt .options:hover{text-decoration:none}.splitbutton .options.active:before,.splitbutton-save .options.active:before,.splitbutton-add .options.active:before,.splitbutton-delete .options.active:before,.splitbutton-alt .options.active:before{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}.splitbutton .options.up.active:before,.splitbutton-save .options.up.active:before,.splitbutton-add .options.up.active:before,.splitbutton-delete .options.up.active:before,.splitbutton-alt .options.up.active:before{margin-top:-4px;-webkit-transform:rotate(540deg);-moz-transform:rotate(540deg);-ms-transform:rotate(540deg);-o-transform:rotate(540deg);transform:rotate(540deg)}.splitbutton .options:hover,.splitbutton-save .options:hover,.splitbutton-add .options:hover,.splitbutton-delete .options:hover,.splitbutton-alt .options:hover,.splitbutton .options:focus,.splitbutton-save .options:focus,.splitbutton-add .options:focus,.splitbutton-delete .options:focus,.splitbutton-alt .options:focus{will-change:box-shadow, background;box-shadow:none;background:#f8f8f8}.splitbutton .options:hover:before,.splitbutton-save .options:hover:before,.splitbutton-add .options:hover:before,.splitbutton-delete .options:hover:before,.splitbutton-alt .options:hover:before,.splitbutton .options:focus:before,.splitbutton-save .options:focus:before,.splitbutton-add .options:focus:before,.splitbutton-delete .options:focus:before,.splitbutton-alt .options:focus:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e001";will-change:transform;-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}.splitbutton .options:hover:hover,.splitbutton-save .options:hover:hover,.splitbutton-add .options:hover:hover,.splitbutton-delete .options:hover:hover,.splitbutton-alt .options:hover:hover,.splitbutton .options:focus:hover,.splitbutton-save .options:focus:hover,.splitbutton-add .options:focus:hover,.splitbutton-delete .options:focus:hover,.splitbutton-alt .options:focus:hover{text-decoration:none}.splitbutton .options.up:hover:before,.splitbutton-save .options.up:hover:before,.splitbutton-add .options.up:hover:before,.splitbutton-delete .options.up:hover:before,.splitbutton-alt .options.up:hover:before,.splitbutton .options.up:focus:before,.splitbutton-save .options.up:focus:before,.splitbutton-add .options.up:focus:before,.splitbutton-delete .options.up:focus:before,.splitbutton-alt .options.up:focus:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e001";margin-top:-4px;-webkit-transform:rotate(540deg);-moz-transform:rotate(540deg);-ms-transform:rotate(540deg);-o-transform:rotate(540deg);transform:rotate(540deg);-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform;-webkit-transition-duration:0.6;-moz-transition-duration:0.6;transition-duration:0.6;-webkit-transition-timing-function:ease;-moz-transition-timing-function:ease;transition-timing-function:ease}.splitbutton .options.up:hover:hover,.splitbutton-save .options.up:hover:hover,.splitbutton-add .options.up:hover:hover,.splitbutton-delete .options.up:hover:hover,.splitbutton-alt .options.up:hover:hover,.splitbutton .options.up:focus:hover,.splitbutton-save .options.up:focus:hover,.splitbutton-add .options.up:focus:hover,.splitbutton-delete .options.up:focus:hover,.splitbutton-alt .options.up:focus:hover{text-decoration:none}.splitbutton .options{color:#777}.splitbutton .options:hover,.splitbutton .options:focus{box-shadow:rgba(0,0,0,0.07) 0 1px 0 inset,rgba(0,0,0,0.07) -1px 0 0 inset,rgba(0,0,0,0.07) 0 -1px 0 inset}.splitbutton-save .options{background:#4598e2}.splitbutton-save .options:hover,.splitbutton-save .options.active,.splitbutton-save .options:focus{background:#2f8cde}.splitbutton-add .options{background:#91ae47}.splitbutton-add .options:hover,.splitbutton-add .options:focus{background:#8ba644}.splitbutton-delete .options{background:#de3c25}.splitbutton-delete .options:hover,.splitbutton-delete .options:focus{background:#cf3520}.splitbutton-alt .options{background:#2e3033}.splitbutton-alt .options:hover,.splitbutton-alt .options:focus{background:#242628}html{font:normal 81.2%/1.65 "Open Sans", sans-serif}body{color:#242628;font-weight:300}h1,h2,h3,h4,h5,h6{color:#242628;text-rendering:optimizeLegibility;line-height:1;margin-top:0}h2{padding-top:0.8em;margin-top:0.8em;border-top:#edece4 1px solid}h1 a:hover{text-decoration:none;box-shadow:#5ba4e5 0 -5px 0 inset}h2 a:hover{text-decoration:none;box-shadow:#5ba4e5 0 -4px 0 inset}h3 a:hover{text-decoration:none;box-shadow:#5ba4e5 0 -3px 0 inset}h4 a:hover,h5 a:hover,h6 a:hover{text-decoration:none;box-shadow:#5ba4e5 0 -1px 0 inset}hgroup{margin:1.6em 0}hgroup h1,hgroup h2,hgroup h3,hgroup h4,hgroup h5,hgroup h6{padding:0;margin:0;border:none;margin-bottom:5px}hgroup h1 a,hgroup h2 a,hgroup h3 a,hgroup h4 a,hgroup h5 a,hgroup h6 a{color:#242628}hgroup h1 a:hover,hgroup h2 a:hover,hgroup h3 a:hover,hgroup h4 a:hover,hgroup h5 a:hover,hgroup h6 a:hover{box-shadow:#242628 0 -1px 0 inset}hgroup h1:nth-child(n+2),hgroup h2:nth-child(n+2),hgroup h3:nth-child(n+2),hgroup h4:nth-child(n+2),hgroup h5:nth-child(n+2),hgroup h6:nth-child(n+2){font-size:1.8em;font-weight:300;color:#aaa9a2}p,ul,ol{margin:1.6em 0}ol ol,ul ul,ul ol,ol ul{margin:0.4em 0}mark{background-color:#ffc336}.markdown,pre,code,tt{font-family:Inconsolata,monospace}code,tt{font-size:0.85em;white-space:pre-wrap;background:#f1f0ea;border:1px solid #dddbcc;border-radius:2px;padding:1px 3px}pre{margin:1.6em 0;background:#f1f0ea;border:1px solid #dddbcc;width:100%;padding:10px;font-family:Inconsolata,monospace;font-size:0.9em;white-space:pre;overflow:auto;border-radius:3px}pre code,pre tt{font-size:inherit;white-space:-moz-pre-wrap;white-space:pre-wrap;background:transparent;border:none;padding:0}kbd{display:inline-block;margin-bottom:0.4em;padding:1px 8px;border:#ccc 1px solid;color:#242628;text-shadow:#fff 0 1px 0;font-size:0.9em;font-weight:bold;background:#f4f4f4;border-radius:4px;box-shadow:0 1px 0 rgba(0,0,0,0.2),0 1px 0 0 #fff inset}a{color:#5ba4e5;text-decoration:none;-webkit-transition:all 0.15s ease-in-out;-moz-transition:all 0.15s ease-in-out;transition:all 0.15s ease-in-out}a:hover{text-decoration:underline}a.highlight{color:#f2a925;font-weight:bold}hr{display:block;height:1px;border:0;border-top:1px solid #edece4;margin:3.2em 0;padding:0}blockquote{margin:1.6em 0;padding:0 1.6em 0 1.6em;border-left:#edece4 0.6em solid}blockquote p{margin:0.8em 0;font-size:1.2em;font-weight:300}blockquote small{display:inline-block;margin:0.8em 0 0.8em 1.5em;font-size:0.9em;color:#aaa9a2}blockquote small:before{content:'\2014 \00A0'}blockquote cite{font-weight:bold}blockquote cite a{font-weight:normal}dl{margin:1.6em 0}dl dt{float:left;width:180px;overflow:hidden;clear:left;text-align:right;text-overflow:ellipsis;white-space:nowrap;font-weight:bold;margin-bottom:1em}dl dd{margin-left:200px;margin-bottom:1em}.table,table{margin:1.6em 0;width:100%;max-width:100%;background-color:transparent}.table th,table th,.table td,table td{padding:8px;line-height:20px;text-align:left;vertical-align:middle}.table th,.table td{border-top:1px solid #edece4}.table th{color:#aaa9a2}.table caption+thead tr:first-child th,.table caption+thead tr:first-child td,.table colgroup+thead tr:first-child th,.table colgroup+thead tr:first-child td,.table thead:first-child tr:first-child th,.table thead:first-child tr:first-child td{border-top:0}.table tbody+tbody{border-top:2px solid #edece4}.table table table{background-color:#fff}.table tbody>tr:nth-child(odd)>td,.table tbody>tr:nth-child(odd)>th{background-color:#f7f7f3}.table.plain tbody>tr:nth-child(odd)>td,.table.plain tbody>tr:nth-child(odd)>th{background:transparent}form label{display:block;color:#242628;font-size:1em;font-weight:bold}.form-group{position:relative;margin-bottom:1.6em;width:100%;max-width:500px}.form-group p{margin:4px 0 0 0;color:#B3B2A8}.form-group label{margin-bottom:4px}@media (max-width: 550px){.form-group{max-width:100%}} -.form-group[class*='icon-'] input[type="email"],.form-group[class*='icon-'] input[type="number"],.form-group[class*='icon-'] input[type="password"],.form-group[class*='icon-'] input[type="search"],.form-group[class*='icon-'] input[type="tel"],.form-group[class*='icon-'] input[type="text"],.form-group[class*='icon-'] input[type="url"],.form-group[class*='icon-'] input[type="color"],.form-group[class*='icon-'] input[type="date"],.form-group[class*='icon-'] input[type="datetime"],.form-group[class*='icon-'] input[type="datetime-local"],.form-group[class*='icon-'] input[type="month"],.form-group[class*='icon-'] input[type="time"],.form-group[class*='icon-'] input[type="week"]{padding-left:32px}.form-group[class*='icon-']:before{position:absolute;top:50%;left:11px;font-size:0.9em;margin-top:calc(-0.45em - 1px)}.form-group.for-select[class*="icon-"] .gh-select:before{left:32px}.form-group.for-checkbox:after{content:"";display:table;clear:both}.form-group.for-checkbox .checkbox,.form-group.for-checkbox p{float:left}.form-group.for-checkbox p{margin-top:0;margin-left:4px}.form-group.for-radio:after{content:"";display:table;clear:both}.form-group.for-radio label:first-child{display:block;padding-bottom:4px}.form-group.for-radio .gh-radio-wrapper:after{content:"";display:table;clear:both}.form-group.for-radio .gh-radio-wrapper span{float:left}.form-group.for-radio span:not(.gh-radio){margin-top:0;margin-left:4px}fieldset{border:none;margin:0 0 3em 0;padding:0}legend{display:block;width:100%;margin:2em 0;border-bottom:#edece4 1px solid;font-size:1.2em;line-height:2.0em;color:#aaa9a2}input[type="email"],input[type="number"],input[type="password"],input[type="search"],input[type="tel"],input[type="text"],input[type="url"],input[type="color"],input[type="date"],input[type="datetime"],input[type="datetime-local"],input[type="month"],input[type="time"],input[type="week"],textarea,.gh-select,select{display:block;padding:8px 10px;width:100%;border:1px solid #E0DFD7;border-radius:2px;font-size:1.1rem;font-weight:normal;color:#242628;-webkit-transition:border-color,0.15s linear;-moz-transition:border-color,0.15s linear;transition:border-color,0.15s linear}input[type="email"]:focus,input[type="number"]:focus,input[type="password"]:focus,input[type="search"]:focus,input[type="tel"]:focus,input[type="text"]:focus,input[type="url"]:focus,input[type="color"]:focus,input[type="date"]:focus,input[type="datetime"]:focus,input[type="datetime-local"]:focus,input[type="month"]:focus,input[type="time"]:focus,input[type="week"]:focus,textarea:focus,.gh-select:focus,select:focus{border-color:#aaa9a2}textarea{width:100%;max-width:500px;min-width:250px;height:auto;min-height:6.5em}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{padding-right:6px}input[type="checkbox"]{position:absolute;top:0;right:0;bottom:0;left:-9999px}.checkbox{position:relative;width:auto}.checkbox:before{content:'';position:absolute;width:10px;height:6px;top:6px;left:5px;border:2px solid #fff;border-top:none;border-right:none;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}.checkbox:after{content:'';display:inline-block;width:20px;height:20px;margin-right:5px;background:#f7f7f3;border-radius:2px;border:#e3e1d5 1px solid;-webkit-transition:all 0.2s ease;-moz-transition:all 0.2s ease;transition:all 0.2s ease}input[type='checkbox']:checked+.checkbox:after{background:#9fbb58;border-color:#b4ca7c}input[type='checkbox']:checked+.checkbox:before{opacity:1}input[type='checkbox']:focus+.checkbox:after{border:#aaa9a2 1px solid}input[type='checkbox']:active+.checkbox:after{background:#edece4}input[type="radio"]{position:absolute;top:0;right:0;bottom:0;left:-9999px}.gh-radio{position:relative;width:auto}.gh-radio:before{content:'';position:absolute;width:10px;height:10px;top:5px;left:5px;opacity:0;border-radius:100%;background:#9fbb58}.gh-radio:after{content:'';display:inline-block;width:20px;height:20px;margin-right:5px;background:#f7f7f3;border-radius:100%;border:#edece4 1px solid;-webkit-transition:all 0.2s ease;-moz-transition:all 0.2s ease;transition:all 0.2s ease}input[type='radio']:checked+.gh-radio:before{opacity:1}input[type='radio']:focus+.gh-radio:after{border:#aaa9a2 1px solid}.gh-select{position:relative;display:block;overflow:hidden;width:100%;max-width:100%;padding:0;border-width:0}.gh-select:after{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e001";font-size:0.85em;color:#c0bfb6;position:absolute;top:50%;right:0.8em;margin-top:-0.5em;pointer-events:none}.gh-select:hover{text-decoration:none}.gh-select select{appearance:none;-webkit-appearance:none;-moz-appearance:window;text-indent:0.01px;text-overflow:"";background:#fff;outline:none;padding:8px 10px;line-height:normal}.gh-select select::-ms-expand{display:none}.gh-select select:focus{outline:none}.gh-select select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}@-moz-document url-prefix(){.gh-select{border-width:1px}.gh-select select{padding:7px 10px 7px 8px}}.floatingheader{position:absolute;top:0;left:0;right:0;z-index:400;height:40px;padding:6px 15px 14px;text-transform:uppercase;color:#aaa9a2;background-color:transparent;background-image:-webkit-linear-gradient(top, #fff 0%,#fff 25%,rgba(255,255,255,0.9) 100%);background-image:linear-gradient(to bottom,#fff 0%,#fff 25%,rgba(255,255,255,0.9) 100%)}.floatingheader .button,.floatingheader .modal-footer .reject-button-class,.modal-footer .floatingheader .reject-button-class{display:inline-block;font-size:10px;min-height:20px;height:20px;padding:3px 4px;vertical-align:top}.floatingheader .button.button-back,.floatingheader .modal-footer .button-back.reject-button-class,.modal-footer .floatingheader .button-back.reject-button-class{position:relative;top:-2px;left:3px;display:none;padding:0 6px 0 3px}.floatingheader .button.button-back:active,.floatingheader .modal-footer .button-back.reject-button-class:active,.modal-footer .floatingheader .button-back.reject-button-class:active{box-shadow:none}.floatingheader .button.button-back:before,.floatingheader .modal-footer .button-back.reject-button-class:before,.modal-footer .floatingheader .button-back.reject-button-class:before{left:-8px;border-width:10px 8px 10px 0}@media (max-width: 800px){.floatingheader .button.button-back,.floatingheader .modal-footer .button-back.reject-button-class,.modal-footer .floatingheader .button-back.reject-button-class{display:inline-block}}.floatingheader small{font-size:0.85em}.floatingheader a,.floatingheader button{color:#aaa9a2}.floatingheader a:hover,.floatingheader button:hover{color:#242628}.scrolling .floatingheader{box-shadow:rgba(0,0,0,0.02) 0 1px 2px,rgba(255,255,255,0.5) 0 -1px 0 inset}.scrolling .floatingheader:before{content:"";height:40px;width:80%;position:absolute;bottom:0;left:50%;margin-left:-40%;box-shadow:rgba(0,0,0,0.02) 0 2px 2px}.scrolling .floatingheader:after{content:"";height:40px;width:30%;position:absolute;bottom:0;left:50%;margin-left:-15%;box-shadow:rgba(0,0,0,0.02) 0 3px 3px}#modal-container{display:none;position:fixed;top:0;bottom:0;left:0;right:0;overflow-x:auto;overflow-y:scroll;z-index:1040;-webkit-transition:all 0.15s linear 0s;-moz-transition:all 0.15s linear 0s;transition:all 0.15s linear 0s;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.fade{opacity:0;-webkit-transition:opacity 0.2s linear 0s;-moz-transition:opacity 0.2s linear 0s;transition:opacity 0.2s linear 0s;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.fade.in{opacity:1}.modal-background{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,0.6);z-index:1030}.modal,.modal-action{left:50%;right:auto;width:450px;margin-left:auto;margin-right:auto;padding-top:30px;padding-bottom:30px;z-index:1050;pointer-events:auto}@media (max-width: 800px){.modal,.modal-action{width:auto;padding:10px}}.modal button,.modal-action button{min-width:100px}@media (max-width: 800px){.modal,.modal-action{width:100%;margin-left:0}}.modal .image-uploader,.modal-action .image-uploader,.modal .pre-image-uploader,.modal-action .pre-image-uploader{margin:0}.modal-action{padding:60px 0 30px}@media (max-width: 800px){.modal-action{padding:30px 0}} -.modal-content{position:relative;padding:18px;background-clip:padding-box;background-color:#FFFFFF;border-radius:2px;box-shadow:rgba(0,0,0,0.2) 0 0 0 6px}.modal-content .close{position:absolute;top:19px;right:19px;width:16px;padding:0;margin:0;border:none;z-index:9999}.modal-content .close:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e01c";font-size:1.4rem;color:#7d878a;-webkit-transition:color 0.3s linear;-moz-transition:color 0.3s linear;transition:color 0.3s linear}.modal-content .close:hover{text-decoration:none}.modal-content .close:hover:before{color:#35393b}.modal-header{position:relative}.modal-header h1{display:inline-block;margin:0;font-size:1.85em;font-weight:100}.modal-body{position:relative;overflow-y:auto}.modal-footer{margin-top:20px}.modal-style-wide{width:550px}@media (max-width: 800px){.modal-style-wide{width:100%}} -.modal-style-centered{text-align:center}.dropdown:after{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e001";font-size:8px;padding-left:6px;vertical-align:0}.dropdown:hover{text-decoration:none}.dropdown.active{color:#242628}.dropdown.active:after{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e001";font-size:8px}.dropdown.active:hover{text-decoration:none}.ghost-popover{display:none !important}.ghost-popover.open{display:block !important}.menu,.menu-drop,.menu-drop-left,.menu-drop-right,.menu-left,.menu-right,#publish-bar .splitbutton-save .editor-options,#publish-bar .splitbutton-delete .editor-options,.suggestions{display:inline-block;position:absolute;z-index:960;padding:6px 0;border:none;list-style:none;color:#e2edf2;background:#242628;border-radius:3px;box-shadow:rgba(0,0,0,0.5) 0 1px 15px}.menu:before,.menu-drop:before,.menu-drop-left:before,.menu-drop-right:before,.menu-left:before,.menu-right:before,#publish-bar .splitbutton-save .editor-options:before,#publish-bar .splitbutton-delete .editor-options:before,.suggestions:before{content:"";position:absolute;bottom:-10px;left:50%;margin-left:-10px;border-width:10px 10px 0 10px;border-style:solid;border-color:#242628 transparent;display:block;width:0}.menu li,.menu-drop li,.menu-drop-left li,.menu-drop-right li,.menu-left li,.menu-right li,#publish-bar .splitbutton-save .editor-options li,#publish-bar .splitbutton-delete .editor-options li,.suggestions li{overflow:hidden}.menu a,.menu-drop a,.menu-drop-left a,.menu-drop-right a,.menu-left a,.menu-right a,#publish-bar .splitbutton-save .editor-options a,#publish-bar .splitbutton-delete .editor-options a,.suggestions a,.menu p,.menu-drop p,.menu-drop-left p,.menu-drop-right p,.menu-left p,.menu-right p,#publish-bar .splitbutton-save .editor-options p,#publish-bar .splitbutton-delete .editor-options p,.suggestions p{display:block;position:relative;padding:10px 25px 10px 35px;border:none;color:#e2edf2 !important;text-transform:none;text-decoration:none}.menu a:hover,.menu-drop a:hover,.menu-drop-left a:hover,.menu-drop-right a:hover,.menu-left a:hover,.menu-right a:hover,#publish-bar .splitbutton-save .editor-options a:hover,#publish-bar .splitbutton-delete .editor-options a:hover,.suggestions a:hover,.menu p:hover,.menu-drop p:hover,.menu-drop-left p:hover,.menu-drop-right p:hover,.menu-left p:hover,.menu-right p:hover,#publish-bar .splitbutton-save .editor-options p:hover,#publish-bar .splitbutton-delete .editor-options p:hover,.suggestions p:hover{background:#5ba4e5;box-shadow:rgba(255,255,255,0.2) 0 1px 0 inset}.menu .active a:before,.menu-drop .active a:before,.menu-drop-left .active a:before,.menu-drop-right .active a:before,.menu-left .active a:before,.menu-right .active a:before,#publish-bar .splitbutton-save .editor-options .active a:before,#publish-bar .splitbutton-delete .editor-options .active a:before,.suggestions .active a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e033";position:absolute;top:14px;left:11px}.menu .active a:hover,.menu-drop .active a:hover,.menu-drop-left .active a:hover,.menu-drop-right .active a:hover,.menu-left .active a:hover,.menu-right .active a:hover,#publish-bar .splitbutton-save .editor-options .active a:hover,#publish-bar .splitbutton-delete .editor-options .active a:hover,.suggestions .active a:hover{text-decoration:none}.menu-drop:before,.menu-drop-left:before,.menu-drop-right:before{top:-10px;bottom:auto;border-width:0 10px 10px 10px}.menu-left:before,.menu-drop-left:before{left:10px;margin-left:0}.menu-right:before,.menu-drop-right:before,#publish-bar .splitbutton-save .editor-options:before,#publish-bar .splitbutton-delete .editor-options:before{left:auto;right:10px;margin-left:0}@media (min-width: 401px){.notifications{position:absolute;bottom:0;left:0;z-index:980;width:300px}}@media (max-width: 400px){.notifications{position:fixed;top:0;left:0;right:0;z-index:9999}} -.js-bb-notification{-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.notification,.notification-success,.notification-error,.notification-warn,.notification-info{width:100%;min-height:40px;max-height:253px;margin:0 0 15px 0;color:rgba(255,255,255,0.9);background:#5ba4e5;position:relative;box-shadow:rgba(0,0,0,0.05) 0 1px 5px;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.notification:before,.notification-success:before,.notification-error:before,.notification-warn:before,.notification-info:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e031";position:absolute;top:0;left:0;height:100%;width:44px;padding:14px 15px;text-align:center;color:rgba(255,255,255,0.8);background:rgba(0,0,0,0.1)}.notification:hover,.notification-success:hover,.notification-error:hover,.notification-warn:hover,.notification-info:hover{text-decoration:none}@media (max-width: 400px){.notification,.notification-success,.notification-error,.notification-warn,.notification-info{margin-bottom:1px}}.notification .notification-message,.notification-success .notification-message,.notification-error .notification-message,.notification-warn .notification-message,.notification-info .notification-message{display:block;padding:10px 43px 10px 57px;max-height:253px;overflow:auto}.notification .close,.notification-success .close,.notification-error .close,.notification-warn .close,.notification-info .close{color:rgba(255,255,255,0.6)}.notification .close:after,.notification-success .close:after,.notification-error .close:after,.notification-warn .close:after,.notification-info .close:after{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e01c";padding:6px;position:absolute;top:8px;right:9px}.notification .close:hover,.notification-success .close:hover,.notification-error .close:hover,.notification-warn .close:hover,.notification-info .close:hover{text-decoration:none}.notification .close:hover,.notification-success .close:hover,.notification-error .close:hover,.notification-warn .close:hover,.notification-info .close:hover{color:#fff}.notification a,.notification-success a,.notification-error a,.notification-warn a,.notification-info a{color:inherit;text-decoration:underline}.notification-success{background:#9fbb58}.notification-success:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e030"}.notification-success:hover{text-decoration:none}.notification-success.notification-passive{-webkit-animation:fade-out 1s linear;-moz-animation:fade-out 1s linear;animation:fade-out 1s linear;-webkit-animation-delay:3s;-moz-animation-delay:3s;animation-delay:3s;-webkit-animation-iteration-count:1;-moz-animation-iteration-count:1;animation-iteration-count:1;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;animation-fill-mode:forwards}.notification-success.notification-passive:hover{-webkit-animation:fade-in-snap 0.2s linear;-moz-animation:fade-in-snap 0.2s linear;animation:fade-in-snap 0.2s linear}.notification-error{background:#e25440}.notification-error:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e01a"}.notification-error:hover{text-decoration:none}.notification-warn{background:#f2a925}.notification-warn:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e014"}.notification-warn:hover{text-decoration:none}.notification-info{background:#5ba4e5}.notification-info:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e014"}.notification-info:hover{text-decoration:none}.update-available main{bottom:56px}.invited-users{margin-bottom:34px}.object-list-title{font-size:13px;font-weight:normal;color:#c0bfb6;margin-bottom:14px}.object-list-item{border-top:1px solid #edece4;min-height:68px}@media (max-width: 500px){.object-list-item{display:block;padding:15px 0}.object-list-item:after{content:"";display:table;clear:both}}@media (min-width: 501px){.object-list-item{display:-webkit-box;display:-moz-box;display:box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-moz-box-pack:start;box-pack:start;-webkit-justify-content:start;-moz-justify-content:start;-ms-justify-content:start;-o-justify-content:start;justify-content:start;-ms-flex-pack:start;-webkit-box-align:center;-moz-box-align:center;box-align:center;-webkit-align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;align-items:center;-ms-flex-align:center;padding:0 15px}} -a.object-list-item{text-decoration:none}a.object-list-item:hover{background:#f7f7f3}a.object-list-item:last-of-type:hover{box-shadow:inset 0px -1px 0px #edece4}.object-list-item-icon{width:35px;height:35px;display:block;border-radius:100%;background:#edece4;font-size:0px;color:transparent;overflow:hidden;position:relative}.object-list-item-icon:before{position:absolute;top:50%;left:0;right:0;margin-top:-7px;text-align:center;color:#aaa9a2;font-size:14px}.object-list-item-figure{width:35px;border-radius:100%;display:block;border:1px solid #979797}@media (max-width: 500px){.object-list-item-icon,.object-list-item-figure{float:left;margin-right:15px}} -.object-list-item-body{-webkit-box-flex:1;-moz-box-flex:1;box-flex:1;-webkit-flex:1;-moz-flex:1;-ms-flex:1;flex:1;-webkit-box-align:stretch;-moz-box-align:stretch;box-align:stretch;-webkit-align-items:stretch;-moz-align-items:stretch;-ms-align-items:stretch;-o-align-items:stretch;align-items:stretch;-ms-flex-align:stretch;padding-left:15px;line-height:1}@media (max-width: 500px){.object-list-item-body{margin-top:3px}}.object-list-item-body .name{display:inline-block;font-size:15px;font-weight:400;color:#242628}.object-list-item-body .description{display:inline-block;font-size:12px;color:#c0bfb6;margin-top:3px}@media (max-width: 500px){.object-list-item-aside{float:left;width:100%;margin-top:15px}}.object-list-item-aside .object-list-action:not(:first-of-type){margin-left:20px}@media (min-width: 501px){.object-list-item-aside .object-list-action:not(:first-of-type){margin-left:50px}}.object-list-item-aside .role-label{float:left;margin-top:-1px}.object-list-item-aside .role-label+.role-label{margin-left:5px}.object-list-action{font-size:11px;text-transform:uppercase;text-decoration:underline}.role-label{background:#eee;display:inline-block;padding:6px 8px;color:rgba(0,0,0,0.5);font-size:9px;line-height:1;text-transform:uppercase;letter-spacing:0.1em;font-weight:400}.role-label.owner,.role-label.admin,.role-label.editor{color:rgba(255,255,255,0.8)}.role-label.owner{background:#242628}.role-label.admin{background:#e25440}.role-label.editor{background:#5ba4e5}.image-uploader{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:1.6em 0;position:relative;overflow:hidden;padding:55px 60px;border:#edece4 3px dashed;width:100%;height:auto;text-align:center;color:#aaa9a2;background:#F9F8F5}.image-uploader a{color:#aaa9a2;text-decoration:none}.image-uploader a:hover{color:#242628}.image-uploader .description{margin-top:10px}.image-uploader .media:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e011";font-size:60px;color:#e7e6db;display:inline-block;vertical-align:initial;-webkit-transition:-webkit-transform 1s ease;-moz-transition:-moz-transform 1s ease;transition:transform 1s ease}.image-uploader .media:hover{text-decoration:none}.image-uploader .image-url,.image-uploader .image-upload{line-height:12px;padding:10px;display:block;position:absolute;bottom:0;left:0;color:#aaa9a2;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.image-uploader .image-url:hover,.image-uploader .image-upload:hover{cursor:pointer}.image-uploader .image-webcam:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e036";font-size:12px}.image-uploader .image-webcam:hover{text-decoration:none}.image-uploader .image-url:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e035";font-size:12px}.image-uploader .image-url:hover{text-decoration:none}.image-uploader .image-upload:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e011";font-size:12px}.image-uploader .image-upload:hover{text-decoration:none}.image-uploader .button-add{display:inline-block;position:relative;z-index:700;color:#fff;padding-left:5px}.image-uploader .button-save{margin:0 0 0 10px}.image-uploader input.main{position:absolute;right:0;margin:0;opacity:0;-webkit-transform-origin:right;-moz-transform-origin:right;-ms-transform-origin:right;-o-transform-origin:right;transform-origin:right;-webkit-transform:scale(14);-moz-transform:scale(14);-ms-transform:scale(14);-o-transform:scale(14);transform:scale(14);font-size:23px;direction:ltr;cursor:pointer}.image-uploader input.main.right{right:9999px;height:0}.image-uploader input.url{font:-webkit-small-control;box-sizing:border-box;width:276px;vertical-align:middle;padding:9px 7px;margin:10px 0;outline:0;font-size:1.1em;background:#fff;border:#e3e1d5 1px solid;border-radius:4px;-webkit-transition:all 0.15s ease-in-out;-moz-transition:all 0.15s ease-in-out}.image-uploader .progress{position:relative;margin:-19px 0 44px 0;display:block;overflow:hidden;background-color:#f5f5f5;background-image:-webkit-linear-gradient(top, #f5f5f5,#f9f9f9);background-image:linear-gradient(to bottom,#f5f5f5,#f9f9f9);border-radius:12px;box-shadow:rgba(0,0,0,0.1) 0 1px 2px inset}.image-uploader .fileupload-loading{display:block;top:50%;width:35px;height:28px;margin:-28px auto 0;background-size:contain}.image-uploader .failed{position:relative;top:-40px;font-size:16px}.image-uploader .bar{height:12px;background:#5ba4e5}.image-uploader .bar.fail{background:#e25440}.pre-image-uploader{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:1.6em 0;position:relative;overflow:hidden;height:auto;color:#aaa9a2;background:rgba(0,0,0,0.1);border-radius:2px;min-height:46px}.pre-image-uploader input{position:absolute;left:9999px;opacity:0}.pre-image-uploader a{z-index:10000;color:#aaa9a2;text-decoration:none}.pre-image-uploader a:hover{color:#242628}.pre-image-uploader img{display:block;max-width:100%;margin:0 auto;line-height:0}.pre-image-uploader .image-cancel{position:absolute;top:10px;right:10px;padding:8px;z-index:300;color:#fff;text-decoration:none;line-height:0;border-radius:2px;background:rgba(0,0,0,0.6);box-shadow:rgba(255,255,255,0.2) 0 0 0 1px}.pre-image-uploader .image-cancel:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e023";font-size:11px}.pre-image-uploader .image-cancel:hover{text-decoration:none}.pre-image-uploader .image-cancel:hover{color:#fff;cursor:pointer;background:#e25440}.ghost-logo{display:block;float:left;height:40px;padding:12px 15px;color:#4d5356;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.ghost-logo:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e000";line-height:0}.ghost-logo:hover{text-decoration:none}.ghost-logo:hover,.ghost-logo:focus{text-decoration:none}.ghost-logo:hover,.ghost-logo:focus{color:#e2edf2;background:#1f2123}.navbar{height:40px;font-size:0.85em;background:#242628}@media (max-width: 1000px){.navbar{font-weight:normal}}.navbar nav ul{float:left;border-left:#35393b 1px solid;border-top:none;margin:0;padding:0}.navbar nav li{float:left;font-size:1em;position:relative;border-right:#35393b 1px solid}.navbar nav li a{display:block;height:40px;padding:11px 15px;border-bottom:none;color:#7d878a;text-transform:uppercase;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.navbar nav li a:hover,.navbar nav li a:focus,.navbar nav li.active a{color:#e2edf2;text-decoration:none;position:relative;background:#303436;box-shadow:0 -2px 2px rgba(0,0,0,0.2) inset}.navbar nav li.active a:after{content:"";position:absolute;bottom:0;left:50%;margin-left:-5px;border-width:0 5px 5px 5px;border-style:solid;border-color:#edece4 transparent;display:block;width:0}@media (max-width: 400px){.navbar nav li.active a:after{border-color:#fff transparent}}.navbar nav li ul{position:absolute;top:40px;right:0;min-width:200px;background:#242628}.navbar nav li li{width:100%;border-right:none}.navbar nav a:before{margin-right:5px}.navbar nav .dashboard a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e025";vertical-align:-10%}.navbar nav .dashboard a:hover{text-decoration:none}.navbar nav .content a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e02d"}.navbar nav .content a:hover{text-decoration:none}.navbar nav .editor a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e032"}.navbar nav .editor a:hover{text-decoration:none}.navbar nav .settings a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e029"}.navbar nav .settings a:hover{text-decoration:none}.navbar .subnav{position:relative}.navbar .subnav>a:after{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e001";font-size:8px;margin-left:8px}.navbar .subnav>a:hover{text-decoration:none}.navbar .subnav>a.active{color:#e2edf2;background:#2e3133;-webkit-transition:none;-moz-transition:none;transition:none;box-shadow:none}.navbar .subnav ul{display:none;padding:7px 0;border-left:none;position:absolute;top:40px;left:-1px;z-index:800;background:#2e3133;box-shadow:rgba(0,0,0,0.2) 0 4px 6px}.navbar .subnav li{list-style:none}.navbar .subnav li a{color:#e2edf2}.navbar .subnav li a:hover,.navbar .subnav li a:focus{background:#0c0d0d;-webkit-transition:none;-moz-transition:none;transition:none;box-shadow:none}.navbar .subnav li a:before{margin-right:1em}.navbar .subnav .divider{height:1px;margin:7px 0;overflow:hidden;background:#35393b}.usermenu.subnav{position:absolute;top:0;right:0;border-right:none;border-left:#35393b 1px solid}.usermenu.subnav>a{padding-left:43px}.usermenu.subnav .avatar{height:18px;width:18px;border-radius:50px;position:absolute;top:11px;left:15px}.usermenu.subnav>ul{right:0;left:auto}.usermenu.subnav .usermenu-profile a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e02e"}.usermenu.subnav .usermenu-profile a:hover{text-decoration:none}.usermenu.subnav .usermenu-help a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e02f";font-size:1.1em}.usermenu.subnav .usermenu-help a:hover{text-decoration:none}.usermenu.subnav .usermenu-shortcuts a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e00d"}.usermenu.subnav .usermenu-shortcuts a:hover{text-decoration:none}.usermenu.subnav .usermenu-signout a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e02b"}.usermenu.subnav .usermenu-signout a:hover{text-decoration:none}@media (max-width: 650px){#global-header .ghost-logo{height:40px;width:40px;text-align:center;padding:12px 0;-webkit-transition:margin-left 0.3s ease 0s;-moz-transition:margin-left 0.3s ease 0s;transition:margin-left 0.3s ease 0s}#global-header .ghost-logo:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e005";font-size:14px}#global-header .ghost-logo:hover{text-decoration:none}.off-canvas #global-header .ghost-logo{margin-left:280px;-webkit-transition:margin-left 0.3s ease 0.1s;-moz-transition:margin-left 0.3s ease 0.1s;transition:margin-left 0.3s ease 0.1s}#global-header ul{position:fixed;overflow:auto;top:0;right:auto;bottom:0;left:-280px;z-index:980;width:280px;padding-top:40px;font-weight:normal;background:#242628;border-left:none;-webkit-transition:left 0.3s ease 0.2s;-moz-transition:left 0.3s ease 0.2s;transition:left 0.3s ease 0.2s}.off-canvas #global-header ul{left:0;-webkit-transition:left 0.3s ease 0s;-moz-transition:left 0.3s ease 0s;transition:left 0.3s ease 0s}#global-header li{float:none;border-right:none;border-bottom:#35393b 1px solid}#global-header li a:hover,#global-header li a:focus,#global-header li.active a{box-shadow:none}#global-header li.active a:after{display:none}#global-header li a:before{margin-right:1em}#global-header li ul{position:static;min-width:0;background:#242628}#global-header li li{width:auto}#global-header .usermenu{position:fixed;top:0;right:auto;bottom:auto;left:-280px;height:40px;z-index:990;width:279px;border-left:none;border-right:#242728 1px solid;border-bottom:#292c2e 1px solid;background-color:#1d1e20;background-image:-webkit-linear-gradient(bottom, #111213, #1d1e20);background-image:-moz-linear-gradient(bottom, #111213, #1d1e20);background-image:-ms-linear-gradient(bottom, #111213, #1d1e20);background-image:linear-gradient(to top, #111213, #1d1e20);-webkit-transition:left 0.3s ease 0.2s;-moz-transition:left 0.3s ease 0.2s;transition:left 0.3s ease 0.2s}.off-canvas #global-header .usermenu{left:0;-webkit-transition:left 0.3s ease 0s;-moz-transition:left 0.3s ease 0s;transition:left 0.3s ease 0s}#global-header .usermenu>a:hover,#global-header .usermenu>a:focus{background:inherit}#global-header .usermenu>a.active{background:#2e3133}#global-header .usermenu>ul{padding:0;box-shadow:none;width:100%;font-weight:300}#global-header .usermenu .open{box-shadow:rgba(0,0,0,0.4) 0 10px 20px}#global-header .usermenu li{border-bottom:#2e3133 1px solid}#global-header .usermenu li a{background:#2e3133}#global-header .usermenu li a:hover,#global-header .usermenu li a:focus{background:#222426}#global-header .usermenu li a:before{margin-right:1em}#global-header .usermenu .divider{display:none}} -nav ul{list-style:none;margin:0;padding:0;border-top:#edece4 1px solid}nav li a{display:block;padding:10px 15px;color:#aaa9a2;border-bottom:#edece4 1px solid}nav li a:hover,nav li a:focus{color:#242628;background:#edece4;text-decoration:none}nav li a:before{margin-right:1em}#nprogress{pointer-events:none;-webkit-pointer-events:none}#nprogress .bar{background:#5ba4e5;position:fixed;z-index:100;top:0;left:0;width:100%;height:2px}#nprogress .peg{display:block;position:absolute;right:0px;width:100px;height:100%;box-shadow:0 0 10px #5ba4e5,0 0 5px #5ba4e5;opacity:1.0;-webkit-transform:rotate(3deg) translate(0px, -4px);-moz-transform:rotate(3deg) translate(0px, -4px);-ms-transform:rotate(3deg) translate(0px, -4px);-o-transform:rotate(3deg) translate(0px, -4px);transform:rotate(3deg) translate(0px, -4px)}#nprogress .spinner{display:block;position:fixed;z-index:100;top:15px;right:15px}#nprogress .spinner-icon{width:14px;height:14px;border:solid 2px transparent;border-top-color:#5ba4e5;border-left-color:#5ba4e5;border-radius:10px;-webkit-animation:nprogress-spinner 400ms linear infinite;-moz-animation:nprogress-spinner 400ms linear infinite;-ms-animation:nprogress-spinner 400ms linear infinite;-o-animation:nprogress-spinner 400ms linear infinite;animation:nprogress-spinner 400ms linear infinite}@-webkit-keyframes nprogress-spinner{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-moz-keyframes nprogress-spinner{0%{-moz-transform:rotate(0deg);transform:rotate(0deg)}100%{-moz-transform:rotate(360deg);transform:rotate(360deg)}}@-o-keyframes nprogress-spinner{0%{-o-transform:rotate(0deg);transform:rotate(0deg)}100%{-o-transform:rotate(360deg);transform:rotate(360deg)}}@-ms-keyframes nprogress-spinner{0%{-ms-transform:rotate(0deg);transform:rotate(0deg)}100%{-ms-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes nprogress-spinner{0%{transform:rotate(0deg);transform:rotate(0deg)}100%{transform:rotate(360deg);transform:rotate(360deg)}}.ghost-login,.ghost-signup,.ghost-forgotten,.ghost-reset{color:#7d878a;background:#242628}@media (max-width: 400px){.ghost-login,.ghost-signup,.ghost-forgotten,.ghost-reset{background:#242628}}.ghost-login main,.ghost-signup main,.ghost-forgotten main,.ghost-reset main{top:15px}.ghost-login input,.ghost-signup input,.ghost-forgotten input,.ghost-reset input{line-height:1.4em;font-size:1.1em;font-weight:200;border:none;color:#fff;background:transparent;box-shadow:none;margin:0;position:relative}.ghost-login input:-webkit-autofill,.ghost-signup input:-webkit-autofill,.ghost-forgotten input:-webkit-autofill,.ghost-reset input:-webkit-autofill{-webkit-box-shadow:0 0 0px 1000px #e2edf2 inset !important}.login-box,.signup-box,.forgotten-box,.reset-box{max-width:530px;height:90%;margin:0 auto;padding:0;display:table}@media (max-width: 630px){.login-box,.signup-box,.forgotten-box,.reset-box{max-width:264px;text-align:center}} -.login-form{max-width:530px;color:#a5acae;display:table-cell;vertical-align:middle}@media (max-width: 630px){.login-form{max-width:264px}}.login-form div{position:relative;margin:0 0 5px 0;background:#3c4043;float:left}@media (max-width: 630px){.login-form div{margin-bottom:1em}}.login-form input{display:inline-block;clear:both;padding:8px 0 8px 8px;width:216px;-webkit-transition:background ease 0.25s;-moz-transition:background ease 0.25s;transition:background ease 0.25s}@media (max-width: 630px){.login-form input{width:264px;-webkit-transition:none;-moz-transition:none;transition:none}}.login-form input:focus{border:none;background:#484c50}.login-form .email-wrap{position:relative;margin-right:3px}.login-form .email-wrap:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e012";font-size:12px;position:absolute;bottom:11px;left:8px;z-index:100}.login-form .email-wrap:hover{text-decoration:none}@media (max-width: 630px){.login-form .email-wrap{margin-right:0}}.login-form .email-wrap .email{padding-left:28px;border-radius:2px 0 0 2px}.login-form .password-wrap{position:relative}.login-form .password-wrap:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e02c";font-size:10px;position:absolute;bottom:12px;left:11px;z-index:100}.login-form .password-wrap:hover{text-decoration:none}.login-form .password-wrap .password{padding-left:28px;border-radius:0 2px 2px 0}@media (min-width: 631px){.login-form .email-wrap,.login-form .email-wrap .email{border-radius:2px 0 0 2px}.login-form .password-wrap,.login-form .password-wrap .password{border-radius:0 2px 2px 0}}@media (max-width: 630px){.login-form .email-wrap,.login-form .email-wrap .email,.login-form .password-wrap,.login-form .password-wrap .password{border-radius:2px}}.login-form button{width:85px;height:36px;margin:0 0 0 10px;padding:0.5em 1.37em;min-height:30px;min-width:80px;box-shadow:rgba(255,255,255,0.15) 0 1px 0 inset}@media (max-width: 630px){.login-form button{margin:0;width:100%;margin-bottom:1em}}.login-form .meta{clear:both;color:#7d878a}.login-form a{color:#646d70;font-size:0.9em}.login-form a:hover{color:#8a9396;text-decoration:none}.signup-form,.reset-form{max-width:280px;color:#a5acae;display:table-cell;vertical-align:middle}@media (max-width: 630px){.signup-form,.reset-form{width:264px}}.signup-form div,.reset-form div{position:relative;margin:0 0 1em 0;background:#3c4043;float:left;display:table}.signup-form input,.reset-form input{width:280px;padding:8px 10px}@media (min-width: 631px){.signup-form input,.reset-form input{-webkit-transition:background ease 0.25s;-moz-transition:background ease 0.25s;transition:background ease 0.25s}}@media (max-width: 630px){.signup-form input,.reset-form input{width:264px}}.signup-form input:focus,.reset-form input:focus{border:none;background:#484c50}.signup-form .name-wrap,.reset-form .name-wrap{position:relative;border-radius:2px}.signup-form .name-wrap .name,.reset-form .name-wrap .name{border-radius:2px}.signup-form .email-wrap,.reset-form .email-wrap{position:relative;border-radius:2px}.signup-form .email-wrap .email,.reset-form .email-wrap .email{border-radius:2px}.signup-form .password-wrap,.reset-form .password-wrap{position:relative;border-radius:2px}.signup-form .password-wrap .password,.reset-form .password-wrap .password{border-radius:2px}.signup-form button,.reset-form button{width:100%;height:36px;margin:0 0 1em 0;padding:0.5em 1.37em;min-height:30px;min-width:80px;box-shadow:rgba(255,255,255,0.15) 0 1px 0 inset}.forgotten-form{max-width:280px;color:#a5acae;display:table-cell;vertical-align:middle}.forgotten-form div{position:relative;margin:0 0 1em 0;background:#3c4043;float:left}.forgotten-form input{padding:8px 10px;-webkit-transition:background ease 0.25s;-moz-transition:background ease 0.25s;transition:background ease 0.25s}.forgotten-form input:focus{border:none;background:#484c50}.forgotten-form .email-wrap{width:100%;position:relative;border-radius:2px}.forgotten-form .email-wrap .email{border-radius:2px}.forgotten-form button{width:100%;height:36px;margin:0 0 1em 0;padding:0.5em 1.37em;min-height:30px;min-width:80px;box-shadow:rgba(255,255,255,0.15) 0 1px 0 inset}.settings-about .ghost_logo:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e000";font-size:1.28rem;color:#7d878a;position:relative;top:-6px}.settings-about .ghost_logo:hover{text-decoration:none}.settings-about .ghost_logo:after{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e600";font-size:2.5rem;color:#242628}.settings-about .ghost_logo:hover{text-decoration:none}.settings-about p{color:#7d878a}.about-ghost-intro h1{margin-top:-6px;margin-bottom:-21px}.about-ghost-intro h1 .version{font-weight:300;font-size:1.3rem;position:relative;top:-3px}@media (max-width: 550px){.about-ghost-intro{padding-top:40px}} -.about-environment-help{margin-top:35px}.about-environment p{margin:0;line-height:1.7}.about-help{padding-top:6px}@media (max-width: 500px){.about-help{padding-top:16px}}.about-help .button-dark{width:100%;display:block;font-size:0.85rem;padding-top:8px;padding-bottom:8px;min-height:32px}.about-help .button-dark:nth-child(1){margin-bottom:11px}@media (min-width: 501px){.about-environment-help{max-width:430px}.about-environment{float:left;width:calc(100% - 196px)}.about-help{float:right;width:176px}}.top-contributors{padding-left:0;max-width:650px}.top-contributors li{float:left;list-style:none;width:10%}.top-contributors li a{display:block}@media (min-width: 601px){.top-contributors li a{margin-right:9px;margin-bottom:9px}}@media (max-width: 600px){.top-contributors li a{margin-right:6px;margin-bottom:6px}}.top-contributors li a img{width:100%;display:block;border-radius:100%}.about-credits{margin-top:48px}.about-credits h1{font-size:1.85rem;margin-bottom:2rem}.about-contributors-info{margin-right:-0.9rem;font-size:1.2rem;max-width:620px}.button-save.large.about-get-involved{margin-top:-0.1rem;font-size:0.9rem}.about-copyright{margin-top:4.9rem}.about-copyright a:link,.about-copyright a:visited{color:inherit}.about-copyright a:hover,.about-copyright a:focus,.about-copyright a:active{text-decoration:none;color:#5ba4e5}.manage .content-view-container{position:relative;height:100%;width:100%}@media (max-width: 800px){.manage .content-view-container{overflow-x:hidden}}.manage .content-list{width:35%;padding:15px;position:absolute;bottom:0;top:0;left:0;border-right:#edece4 2px solid;background:#fff;box-shadow:rgba(0,0,0,0.05) 0 1px 5px}@media (max-width: 800px){.manage .content-list{width:auto;right:0;z-index:500;border:none}}.manage .content-list .content-filter{position:relative;z-index:300}.manage .content-list .content-filter>a{padding:5px;margin-left:-5px}.manage .content-list .content-filter .menu-drop,.manage .content-list .content-filter .menu-drop-left,.manage .content-list .content-filter .menu-drop-right{display:block}.manage .content-list .button-add{position:absolute;top:10px;right:15px;z-index:700;color:#fff;padding:3px 4px 3px 5px;min-height:0}.manage .content-list .button-add:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e032"}.manage .content-list .button-add:hover{text-decoration:none}.manage .content-list .content-list-content{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto;padding-top:40px}.manage .content-list .entry-title{font-size:1.4em;line-height:1.1em;margin-bottom:0.5em;font-weight:normal}.manage .content-list .views{float:right;text-align:right;margin-left:15px}.manage .content-list .views:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e025";font-size:10px;color:#aaa9a2}.manage .content-list .views:hover{text-decoration:none}@media (max-width: 800px){.manage .content-list .views{float:none}}.manage .content-list .featured .status:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e026";font-size:11px;margin-right:10px;vertical-align:7%}.manage .content-list .featured .status:hover{text-decoration:none}.manage .content-list .status .draft{color:#e25440}.manage .content-list .status .scheduled{color:#f2a925}.manage .content-list ol{list-style:none;padding:0;margin:0;border-top:#edece4 1px solid}.manage .content-list ol li{margin:0;padding:0;border-bottom:#edece4 1px solid;position:relative}.manage .content-list ol li a{display:block;padding:20px 15px;color:#aaa9a2}@media (max-width: 400px){.manage .content-list ol li a{padding:15px}}@media (max-width: 800px){.manage .content-list ol li a{padding-right:40px}}.manage .content-list ol li a:after{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e01d";position:absolute;top:50%;margin-top:-6px;right:15px}.manage .content-list ol li a:hover{text-decoration:none}@media (min-width: 801px){.manage .content-list ol li a:after{display:none}}.manage .content-list ol li a:hover{text-decoration:none}@media (min-width: 801px){.manage .content-list ol li.active{border-bottom:#e8eaeb 1px solid;background:#f6f6f7;box-shadow:#e8eaeb 0 -1px 0,rgba(0,0,0,0.06) 7px 0 0 inset,#e8eaeb 1px 0 0 inset}.manage .content-list ol li.active a:hover{box-shadow:rgba(0,0,0,0.1) 7px 0 0 inset;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;transition:all 0.4s ease}.manage .content-list ol li.active .entry-title{font-weight:bold}.manage .content-list ol li.active .entry-meta{color:#242628}.manage .content-list ol li.active .views{color:#242628;font-weight:normal}.manage .content-list ol li.active .views:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e025";font-size:10px;color:#242628}.manage .content-list ol li.active .views:hover{text-decoration:none}} -.manage .content-preview{width:65%;padding:15px;position:absolute;bottom:0;top:0;right:0;border-left:#edece4 2px solid;background:#fff;box-shadow:rgba(0,0,0,0.05) 0 1px 5px}@media (max-width: 800px){.manage .content-preview{width:auto;left:100%;right:-100%;margin-left:15px;border:none}}.manage .content-preview .unfeatured{vertical-align:-6%;margin:0 7px 0 -5px;padding:5px}.manage .content-preview .unfeatured:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e027";font-size:14px}.manage .content-preview .unfeatured:hover{text-decoration:none}.manage .content-preview .featured{vertical-align:-6%;margin:0 7px 0 -5px;padding:5px}.manage .content-preview .featured:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e026";font-size:14px}.manage .content-preview .featured:hover{text-decoration:none}.manage .content-preview .normal{text-transform:none;margin:0 3px}.manage .content-preview .content-preview-content{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto;padding:80px 40px;word-break:break-word;hyphens:auto}.manage .content-preview .content-preview-content .wrapper{max-width:700px;margin:0 auto}.manage .content-preview .post-controls{float:right;position:relative;top:3px}.manage .content-preview .post-settings-menu{position:absolute;top:35px;right:-3px}.manage .content-preview .post-edit{margin-right:2px;padding:0 10px}.manage .content-preview .post-edit:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e00f";font-size:14px}.manage .content-preview .post-edit:hover{text-decoration:none}.manage .content-preview img{width:100%;height:auto}.manage .no-posts-box{position:relative;height:90%;margin:0px auto;padding:0px;display:table;z-index:600}@media (max-width: 800px){.manage .no-posts-box{position:fixed;top:45%;left:50%}}.manage .no-posts-box .no-posts{vertical-align:middle;display:table-cell;text-align:center}@media (max-width: 800px){.manage .no-posts-box .no-posts{display:block;position:relative;left:-50%}}.manage .no-posts-box .no-posts h3{color:#aaa9a2;font-weight:200;font-size:2em}.entry-container .entry-title{height:57px;padding:2px 15px;margin-bottom:5px;position:relative}@media (max-width: 400px){.entry-container .entry-title{box-shadow:none}}.entry-container .entry-title input{border:0;margin:0;padding:0;font-size:3em;font-weight:bold;letter-spacing:-1px;width:100%;background:transparent}.entry-container .entry-title input:focus{outline:0}@media (min-width: 401px){.editor .notifications{bottom:40px}}.editor .entry-container{position:relative;height:100%}.editor .entry-markdown{left:0;border-right:#edece4 2px solid}.editor .entry-preview{right:0;border-left:#edece4 2px solid}.editor .entry-markdown,.editor .entry-preview{width:50%;padding:15px;position:absolute;bottom:40px;top:61px;background:#fff;box-shadow:rgba(0,0,0,0.05) 0 1px 5px}@media (max-width: 400px){.editor .entry-markdown,.editor .entry-preview{box-shadow:none}}@media (max-width: 1000px){.editor .entry-markdown,.editor .entry-preview{top:109px;left:0;right:0;width:100%;border:none;z-index:100;min-height:380px}.editor .entry-markdown .markdown,.editor .entry-markdown .entry-preview-content,.editor .entry-preview .markdown,.editor .entry-preview .entry-preview-content{height:50px;overflow:hidden}}@media (max-width: 1000px){.editor .entry-markdown .floatingheader,.editor .entry-preview .floatingheader{cursor:pointer;width:50%;border-right:#edece4 2px solid;color:#fff;font-weight:normal;background:#aaa9a2;position:absolute;top:-40px;left:0;box-shadow:rgba(0,0,0,0.1) 0 -2px 3px inset}.editor .entry-markdown .floatingheader a,.editor .entry-preview .floatingheader a{color:#fff}}.editor .entry-markdown .floatingheader a,.editor .entry-preview .floatingheader a{color:#aaa9a2}.editor .entry-markdown .floatingheader .entry-word-count,.editor .entry-preview .floatingheader .entry-word-count{float:right}@media (max-width: 1000px){.editor .entry-markdown:not(.active) .markdown-help:hover:before,.editor .entry-preview:not(.active) .markdown-help:hover:before{color:#fff}}.editor .entry-markdown.active,.editor .entry-preview.active{z-index:200}.editor .entry-markdown.active .markdown,.editor .entry-markdown.active .entry-preview-content,.editor .entry-preview.active .markdown,.editor .entry-preview.active .entry-preview-content{height:auto;overflow:auto}@media (max-width: 1000px){.editor .entry-markdown.active header,.editor .entry-preview.active header{cursor:auto;color:#aaa9a2;background:#fff;box-shadow:none}.editor .entry-markdown.active header a,.editor .entry-preview.active header a{color:#aaa9a2}}@media (max-width: 400px){.editor .entry-markdown .markdown-help,.editor .entry-markdown .entry-word-count,.editor .entry-preview .markdown-help,.editor .entry-preview .entry-word-count{display:none}}.editor .entry-markdown-content textarea{border:0;width:100%;min-height:auto;height:100%;max-width:100%;margin:0;padding:10px 20px 50px 20px;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-overflow-scrolling:touch}@media (max-width: 600px){.editor .entry-markdown-content textarea{padding:10px}}@media (min-width: 601px) and (max-width: 1000px){.editor .entry-markdown-content textarea{padding:15px}}@media (min-width: 1001px){.editor .entry-markdown-content textarea{top:40px}}@media (max-height: 560px){.editor .entry-markdown-content textarea{height:calc(100% - 40px)}}.editor .entry-markdown-content textarea:focus{outline:0}.editor .entry-markdown-content .CodeMirror{height:auto;position:absolute;top:0;left:0;right:0;bottom:0;font-family:Inconsolata,monospace;font-size:1.4em;line-height:1.3em;color:#3c4043}.editor .entry-markdown-content .CodeMirror .CodeMirror-focused,.editor .entry-markdown-content .CodeMirror .CodeMirror-selected{color:#242628;background:#b3d5f3;text-shadow:none}.editor .entry-markdown-content .CodeMirror ::selection{color:#242628;background:#b3d5f3;text-shadow:none}.editor .entry-markdown-content .CodeMirror-lines{padding:65px 0 40px 0}@media (max-width: 1000px){.editor .entry-markdown-content .CodeMirror-lines{padding-top:25px}}@media (max-width: 400px){.editor .entry-markdown-content .CodeMirror-lines{padding:15px 0}}.editor .entry-markdown-content .CodeMirror pre{padding:0 40px}@media (max-width: 400px){.editor .entry-markdown-content .CodeMirror pre{padding:0 15px}}.editor .entry-markdown-content .cm-header{color:#000;font-size:1.4em;line-height:1.4em;font-weight:bold}.editor .entry-markdown-content .cm-variable-2,.editor .entry-markdown-content .cm-variable-3,.editor .entry-markdown-content .cm-keyword{color:#3c4043}.editor .entry-markdown-content .cm-string,.editor .entry-markdown-content .cm-strong,.editor .entry-markdown-content .cm-link,.editor .entry-markdown-content .cm-comment,.editor .entry-markdown-content .cm-quote,.editor .entry-markdown-content .cm-number,.editor .entry-markdown-content .cm-atom,.editor .entry-markdown-content .cm-tag{color:#000;font-weight:bold}@media (max-width: 1000px){.editor .entry-preview .floatingheader{right:0;left:auto;border-right:none;border-left:#edece4 2px solid}}.editor .entry-preview .entry-preview-content{position:absolute;top:0;right:0;bottom:0;left:0;padding:60px 40px 40px 40px;overflow:auto;word-break:break-word;hyphens:auto;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default}@media (max-width: 1000px){.editor .entry-preview .entry-preview-content{padding-top:20px}}@media (max-width: 400px){.editor .entry-preview .entry-preview-content{padding:15px}}@media (max-width: 1000px){.editor .scrolling .floatingheader{box-shadow:none}}@media (max-width: 1000px){.editor .scrolling .floatingheader::before,.editor .scrolling .floatingheader::after{display:none}}@media (max-width: 1000px){.editor .scrolling .CodeMirror-scroll,.editor .scrolling .entry-preview-content{box-shadow:0 5px 5px rgba(0,0,0,0.05) inset}} -.markdown-help{position:relative;top:-5px;right:-5px;float:right;padding:5px}.markdown-help:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e018";color:#cfceca}.markdown-help:hover{text-decoration:none}.markdown-help:hover:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e018";color:#aaa9a2}.markdown-help:hover:hover{text-decoration:none}.entry-preview-content,.content-preview-content{font-size:1.4em;line-height:1.5em}.entry-preview-content a,.content-preview-content a{color:#5ba4e5;text-decoration:underline}.entry-preview-content p,.content-preview-content p{margin:1.2em 0 1.6em}.entry-preview-content p:first-of-type,.content-preview-content p:first-of-type{margin-top:0}.entry-preview-content h1,.content-preview-content h1{font-size:3em}.entry-preview-content h2,.content-preview-content h2{font-size:2.2em}.entry-preview-content h3,.content-preview-content h3{font-size:1.8em}.entry-preview-content .btn,.content-preview-content .btn{text-decoration:none;color:#35393b}.entry-preview-content .img-placeholder,.content-preview-content .img-placeholder{border:5px dashed #35393b;height:100px;position:relative}.entry-preview-content .img-placeholder span,.content-preview-content .img-placeholder span{display:block;height:30px;position:absolute;margin-top:-15px;top:50%;width:100%;text-align:center}.entry-preview-content a.image-edit,.content-preview-content a.image-edit{width:16px;height:16px}.entry-preview-content img,.content-preview-content img{max-width:100%;height:auto;margin:0 auto}body.zen{background:#f3f2ed}body.zen .usermenu{display:none}body.zen #global-header,body.zen #publish-bar{opacity:0;height:0;overflow:hidden;-webkit-transition:all 0.5s ease-out;-moz-transition:all 0.5s ease-out;transition:all 0.5s ease-out}body.zen main{top:15px;-webkit-transition:all 0.5s ease-out;-moz-transition:all 0.5s ease-out;transition:all 0.5s ease-out}body.zen .entry-markdown,body.zen .entry-preview{bottom:0;-webkit-transition:all 0.5s ease-out;-moz-transition:all 0.5s ease-out;transition:all 0.5s ease-out}#publish-bar{height:40px;padding:0;color:#7d878a;background:#1a1c1d;position:fixed;bottom:0;left:0;right:0;z-index:900;box-shadow:0 -2px 8px rgba(0,0,0,0.2);-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}@media (max-width: 1000px){#publish-bar{font-weight:normal}}#publish-bar .post-settings:hover,#publish-bar .post-settings.active{color:#e2edf2}#publish-bar .post-settings-menu{position:absolute;bottom:44px;right:-3px}#publish-bar .button-save,#publish-bar .button-delete{min-height:30px;height:30px;line-height:12px;padding:0 10px;margin-top:5px;border-top:rgba(255,255,255,0.4) 1px solid}#publish-bar .options{width:30px;min-height:30px;height:30px;margin-top:5px;border-top:rgba(255,255,255,0.4) 1px solid}#publish-bar .splitbutton-save .button-save,#publish-bar .splitbutton-save .button-delete,#publish-bar .splitbutton-delete .button-save,#publish-bar .splitbutton-delete .button-delete{-webkit-transition:width 0.25s ease,background-color 0.3s linear;-moz-transition:width 0.25s ease,background-color 0.3s linear;transition:width 0.25s ease,background-color 0.3s linear}#publish-bar .splitbutton-save .editor-options,#publish-bar .splitbutton-delete .editor-options{bottom:140%;right:-3%}#publish-bar .splitbutton-save .editor-options a,#publish-bar .splitbutton-delete .editor-options a{font-size:14px}.extended-tags{position:static;min-height:100%}.extended-tags #entry-tags:after{right:10px}.extended-tags .tags{width:281px}.extended-tags .tag-label,.extended-tags .tag-label.touch{color:#fff}.extended-tags .tag-input{width:100%;margin-top:5px;padding-top:5px;padding-left:10px;border-top:1px solid #242628}.extended-tags .right{display:none}#entry-tags{position:absolute;top:0;left:0;right:0;bottom:0;text-transform:none;padding:10px 0 0 0}#entry-tags:after{content:"";position:fixed;top:10px;right:220px;width:20px;height:26px;background-color:rgba(26,28,29,0);background-image:-webkit-linear-gradient(left, rgba(26,28,29,0),#1a1c1d);background-image:linear-gradient(to right,rgba(26,28,29,0),#1a1c1d);z-index:9999;pointer-events:none}@media (max-width: 400px){#entry-tags:after{right:200px}}#entry-tags .tags{position:relative;display:inline-block;vertical-align:middle;width:auto;max-width:80%;max-width:calc(100% - 250px);height:22px;padding-left:5px;padding-bottom:20px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;white-space:nowrap;-webkit-transition:width 0.2s linear;-moz-transition:width 0.2s linear;transition:width 0.2s linear}@media (max-width: 400px){#entry-tags .tags{display:block;max-width:calc(100% - 230px);padding-bottom:0}}#entry-tags .tag-label{display:block;float:left;padding:1px 8px 0 8px;-webkit-transition:all 0.15s ease-out 0s;-moz-transition:all 0.15s ease-out 0s;transition:all 0.15s ease-out 0s}#entry-tags .tag-label:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e003"}#entry-tags .tag-label:hover{text-decoration:none}#entry-tags .tag-label:hover{cursor:pointer;color:#e2edf2}#entry-tags .tag-label.touch{color:inherit}#entry-tags input[type="text"].tag-input{display:inline-block;vertical-align:top;color:#e2edf2;font-weight:300;background:transparent;border:none;width:150px;margin-top:-8px;line-height:1;padding:9px}@media (max-width: 400px){#entry-tags input[type="text"].tag-input{position:absolute;top:11px;right:170px;width:20px}}#entry-tags input[type="text"].tag-input:focus{outline:none}#entry-tags .tag{display:inline;margin-right:2px;padding:0 5px;color:#e2edf2;white-space:nowrap;background:#596063;border-radius:2px;box-shadow:rgba(255,255,255,0.2) 0 1px 0 inset,#000 0 1px 3px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#entry-tags .tag:after{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e034";font-size:8px;color:#242628;margin-left:4px;vertical-align:10%;text-shadow:rgba(255,255,255,0.15) 0 1px 0;-webkit-transition:all 0.15s ease-out 0s;-moz-transition:all 0.15s ease-out 0s;transition:all 0.15s ease-out 0s}#entry-tags .tag:hover{text-decoration:none}#entry-tags .tag:hover{cursor:pointer}#entry-tags .tag:hover:after{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e034";font-size:8px;color:#e2edf2;margin-left:4px;vertical-align:10%;text-shadow:none}#entry-tags .tag:hover:hover{text-decoration:none}.suggestions{bottom:100%}.suggestions li.selected{background:#5ba4e5;box-shadow:rgba(255,255,255,0.2) 0 1px 0 inset,rgba(0,0,0,0.5) 0 1px 5px}.suggestions li a{padding-left:25px}.suggestions mark{background:none;color:white;font-weight:bold}#entry-controls{display:inline-block;position:relative;padding:0;z-index:9000}#entry-controls.unsaved .post-settings-menu{padding-bottom:0}#entry-controls.unsaved .post-settings-menu .post-setting:nth-child(3) td{border-bottom:none}#entry-controls.unsaved .post-settings-menu .delete{display:none}#entry-actions{margin-right:6px;position:relative}#entry-actions-menu{position:absolute;bottom:50px;right:-5px}.markdown-help-container{padding-bottom:20px}.modal-markdown-help-table{margin-top:0}.CodeMirror{font-family:monospace;height:300px}.CodeMirror-scroll{overflow:auto}.CodeMirror-lines{padding:4px 0}.CodeMirror pre{padding:0 4px}.CodeMirror-scrollbar-filler{background-color:white}.CodeMirror-gutters{border-right:1px solid #ddd;background-color:#f7f7f7}.CodeMirror div.CodeMirror-cursor{border-left:1px solid black;z-index:3}.CodeMirror div.CodeMirror-secondarycursor{border-left:1px solid silver}.cm-tab{display:inline-block}.cm-s-default .cm-keyword{color:#708}.cm-s-default .cm-atom{color:#219}.cm-s-default .cm-number{color:#164}.cm-s-default .cm-def{color:#00f}.cm-s-default .cm-variable{color:black}.cm-s-default .cm-variable-2{color:#05a}.cm-s-default .cm-variable-3{color:#085}.cm-s-default .cm-property{color:black}.cm-s-default .cm-operator{color:black}.cm-s-default .cm-comment{color:#a50}.cm-s-default .cm-string{color:#a11}.cm-s-default .cm-string-2{color:#f50}.cm-s-default .cm-meta{color:#555}.cm-s-default .cm-error{color:#f00}.cm-s-default .cm-qualifier{color:#555}.cm-s-default .cm-builtin{color:#30a}.cm-s-default .cm-bracket{color:#997}.cm-s-default .cm-tag{color:#170}.cm-s-default .cm-attribute{color:#00c}.cm-s-default .cm-header{color:blue}.cm-s-default .cm-quote{color:#090}.cm-s-default .cm-hr{color:#999}.cm-s-default .cm-link{color:#00c}.cm-negative{color:#d44}.cm-positive{color:#292}.cm-header,.cm-strong{font-weight:bold}.cm-em{font-style:italic}.cm-link{text-decoration:underline}.cm-invalidchar{color:#f00}.CodeMirror{line-height:1;position:relative;overflow:hidden;background:white;color:black}.CodeMirror-scroll{margin-bottom:-30px;margin-right:-30px;padding-bottom:30px;padding-right:30px;height:100%;outline:none;position:relative}.CodeMirror-sizer{position:relative}.CodeMirror-vscrollbar,.CodeMirror-hscrollbar,.CodeMirror-scrollbar-filler{position:absolute;z-index:6;display:none}.CodeMirror-vscrollbar{right:0;top:0;overflow-x:hidden;overflow-y:scroll}.CodeMirror-hscrollbar{bottom:0;left:0;overflow-y:hidden;overflow-x:scroll}.CodeMirror-scrollbar-filler{right:0;bottom:0;z-index:6}.CodeMirror-gutters{position:absolute;left:0;top:0;height:100%;padding-bottom:30px;z-index:3}.CodeMirror-lines{cursor:text}.CodeMirror pre{-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;border-width:0;background:transparent;font-family:inherit;font-size:inherit;margin:0;white-space:pre;word-wrap:normal;line-height:inherit;color:inherit;z-index:2;position:relative;overflow:visible}.CodeMirror-wrap pre{word-wrap:break-word;white-space:pre-wrap;word-break:normal}.CodeMirror-wrap .CodeMirror-scroll{overflow-x:hidden}.CodeMirror-measure{position:absolute;width:100%;height:0px;overflow:hidden;visibility:hidden}.CodeMirror-measure pre{position:static}.CodeMirror:not(.CodeMirror-focused) div.CodeMirror-cursor{visibility:hidden}.CodeMirror div.CodeMirror-cursor{position:absolute;border-right:none;width:0}.CodeMirror-selected{background:#d9d9d9}.CodeMirror-focused .CodeMirror-selected{background:#d7d4f0}.CodeMirror span{*vertical-align:text-bottom}@media print{.CodeMirror div.CodeMirror-cursor{visibility:hidden}}.error-content{max-width:530px;margin:0 auto;padding:0;display:table;height:100%}@media (max-width: 630px){.error-content{max-width:264px;text-align:center}} -.error-details{display:table-cell;vertical-align:middle}.error-image{display:inline-block;vertical-align:middle;width:96px;height:150px}@media (max-width: 630px){.error-image{width:72px;height:112px}}.error-image img{width:100%;height:100%}.error-message{position:relative;top:-5px;display:inline-block;vertical-align:middle;margin-left:10px}.error-code{margin:0;font-size:7.8em;line-height:0.9em;color:#979797}@media (max-width: 630px){.error-code{font-size:5.8em}} -.error-description{margin:0;padding:0;font-weight:300;font-size:1.9em;color:#979797;border:none}@media (max-width: 630px){.error-description{font-size:1.4em}} -.error-stack{margin:1em auto;padding:2em;max-width:800px;background-color:rgba(255,255,255,0.3)}.error-stack-list{list-style-type:none;padding:0;margin:0}.error-stack-list li{display:block}.error-stack-list li::before{color:#BBB;content:"\21AA";display:inline-block;font-size:1.2em;margin-right:0.5em}.error-stack-function{font-weight:bold}.invite-new-user .modal-body:after{content:"";display:table;clear:both}.invite-new-user .modal-body fieldset{margin:1em 0 0 0}.invite-new-user .form-group{margin-bottom:0;padding:0}.invite-new-user .form-group label{position:static;display:block;text-align:left}.invite-new-user .form-group:nth-of-type(1){float:left;width:60%}.invite-new-user .form-group:nth-of-type(2){float:left;width:35%;margin-left:5%}.invite-new-user .form-group input{width:100%}.invite-new-user .button-add{width:100%;padding:0.85rem 1.9rem;font-size:14px;line-height:16px}.post-settings{display:inline-block;padding:0 10px;color:#7d878a;-webkit-transition:all 0.15s ease-out 0s;-moz-transition:all 0.15s ease-out 0s;transition:all 0.15s ease-out 0s;position:relative;top:1px}.post-settings:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e006";font-size:14px}.post-settings:hover{text-decoration:none}.post-settings:hover,.post-settings.active{color:#242628}.post-settings-menu{padding-top:0;text-transform:none}.post-settings-menu table{margin:0}.post-settings-menu td{padding:0;border-top:none;border-bottom:#414648 1px solid}.post-settings-menu .post-setting-label{padding:8px 10px 8px 15px;border-right:#414648 1px solid;text-align:right}.post-settings-menu label{position:static;width:auto;font-weight:normal;color:#7d878a;white-space:nowrap}.post-settings-menu input{width:200px;margin:0}@media (max-width: 550px){.post-settings-menu input{width:200px}}.post-settings-menu input[type="text"]{border:none;padding:8px 0 8px 10px;color:#e2edf2;border-radius:0;background:transparent}.post-settings-menu input[type="text"]:focus{background:#35393b;border:none}.post-settings-menu .post-setting-item{padding:5px 0 0 10px}.post-settings-menu .post-setting-item.no-padding{padding:0}.post-settings-menu .gh-select{height:36px}.post-settings-menu .gh-select:after{color:#e2edf2;margin-top:-0.425em}.post-settings-menu .gh-select select{border:0;background:transparent;border-radius:0;color:#e2edf2;height:36px}.post-settings-menu .gh-select select:focus{background:#35393b}@media (max-width: 550px){.post-settings-menu .gh-select,.post-settings-menu .gh-select select{height:41px}}.post-settings-menu .checkbox{position:relative;margin-top:0;top:0;border:0}.post-settings-menu .checkbox:after{border-color:#4d5356;background:#35393b}.post-settings-menu input[type='checkbox']:focus+.checkbox:after{border-color:#4d5356}.post-settings-menu .delete{display:block;padding:10px 15px;width:100%;text-align:left}.post-settings-menu .delete:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e023";position:relative;top:-1px;margin-right:10px}.post-settings-menu .delete:hover{text-decoration:none}.post-settings-menu .delete:hover{background:#e25440;color:#fff}.settings .wrapper{background:#fff;box-shadow:rgba(0,0,0,0.05) 0 1px 5px;position:relative;width:100%;height:100%;margin:0;padding:0}@media (max-width: 800px){.settings .wrapper{top:-55px;margin-top:55px;overflow-x:hidden}}.settings .title{text-transform:uppercase;font-weight:normal;font-size:1.6em;line-height:0.8em;margin:0 0 18px 0;padding:0;border:none}.settings-sidebar{width:20%;position:absolute;top:0;left:0;bottom:0;z-index:700;background:#fff;box-shadow:#edece4 1px 0 0}@media (max-width: 800px){.settings-sidebar{width:100%;box-shadow:none}}.settings-sidebar>header{position:relative;z-index:400;height:17px;padding:30px 15px 47px 40px;margin-bottom:0;border-bottom:none;box-shadow:#edece4 0 -1px 0 inset, #edece4 1px 0 0;background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(25%, #fff), color-stop(100%, rgba(255,255,255,0.9)));background:-webkit-linear-gradient(top, #fff 0%, #fff 25%, rgba(255,255,255,0.9) 100%);background:linear-gradient(to bottom, #fff 0%, #fff 25%, rgba(255,255,255,0.9) 100%)}@media (max-width: 1000px){.settings-sidebar>header{padding-left:15px}} -.settings-menu{position:absolute;top:0;left:0;bottom:0;right:-1px;overflow:auto}@media (max-width: 800px){.settings-menu{right:0}}.settings-menu:before{display:block;content:"";height:77px}.settings-menu ul{border-top:none}@media (max-width: 800px){.settings-menu ul{border-bottom:#edece4 1px solid}}.settings-menu li{margin-right:1px;border-top:#fff 1px solid}@media (max-width: 800px){.settings-menu li{margin-right:0;border-top:#edece4 1px solid}}.settings-menu li a{padding:15px 15px 15px 40px;border-bottom:none}@media (max-width: 1000px){.settings-menu li a{padding-left:15px}}@media (max-width: 800px){.settings-menu li a:after{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e01d";float:right;margin-top:5px}.settings-menu li a:hover{text-decoration:none}}.settings-menu li:first-child{border-top:none}.settings-menu li:first-child.active{border-top:none}@media (min-width: 801px){.settings-menu li.active{margin-right:0;position:relative;z-index:300;border-top:#edece4 1px solid;box-shadow:#fff 1px 0 0, #edece4 0 1px 0;-webkit-transition:all 0.15s ease-out 0s;-moz-transition:all 0.15s ease-out 0s;transition:all 0.15s ease-out 0s}.settings-menu li.active a{color:#242628;font-weight:bold;background:#fff}.settings-menu li.active a:focus{background:#edece4}}.settings-menu li a:before{margin-right:20px}@media (max-width: 1000px){.settings-menu li a:before{margin-right:15px}}.settings-menu .about a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e000"}.settings-menu .about a:hover{text-decoration:none}.settings-menu .general a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e006"}.settings-menu .general a:hover{text-decoration:none}.settings-menu .publishing a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e02d"}.settings-menu .publishing a:hover{text-decoration:none}.settings-menu .services a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e020"}.settings-menu .services a:hover{text-decoration:none}.settings-menu .users a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e002"}.settings-menu .users a:hover{text-decoration:none}.settings-menu .appearance a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e021"}.settings-menu .appearance a:hover{text-decoration:none}.settings-menu .apps a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e00b"}.settings-menu .apps a:hover{text-decoration:none}.settings-menu .code a:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e03e"}.settings-menu .code a:hover{text-decoration:none}.settings-content{padding:0;position:absolute;top:0;right:0;left:20%;bottom:0;background:#fff}@media (max-width: 800px){.settings-content{width:100%;left:100%;right:-100%;margin-left:15px}}.settings-content .settings-general img{max-width:100%;max-height:400px}.settings-content>header{position:relative;z-index:200;height:17px;padding:30px 220px 46px 40px;border-bottom:#edece4 1px solid;margin-bottom:40px;text-transform:none;font-weight:normal;line-height:inherit;color:inherit;background:-moz-linear-gradient(top, #fff 0%, #fff 25%, rgba(255,255,255,0.9) 100%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(25%, #fff), color-stop(100%, rgba(255,255,255,0.9)));background:-webkit-linear-gradient(top, #fff 0%, #fff 25%, rgba(255,255,255,0.9) 100%);background:-o-linear-gradient(top, #fff 0%, #fff 25%, rgba(255,255,255,0.9) 100%);background:-ms-linear-gradient(top, #fff 0%, #fff 25%, rgba(255,255,255,0.9) 100%);background:linear-gradient(to bottom, #fff 0%, #fff 25%, rgba(255,255,255,0.9) 100%)}@media (max-width: 1000px){.settings-content>header{padding-left:15px}}@media (max-height: 600px){.settings-content>header{height:auto;padding:5px;position:absolute;top:0;right:0;border:none;background:transparent}.settings-content>header .title{display:none}}@media (max-width: 650px){.settings-content>header{padding-left:15px}.settings-content>header .button-back{position:fixed;top:5px;left:14px;min-height:0;padding-top:8px;padding-bottom:8px;display:block}.settings-content>header .button-back:before{left:-9px;border-width:15px 9px 15px 0}}.settings-content>header .header-inner{position:absolute;top:0;left:0;right:0;height:100px;outline:1px solid red}.settings-content .page-actions{position:absolute;top:20px;right:40px;z-index:700;font-size:1em}@media (max-width: 1000px){.settings-content .page-actions{right:15px}}@media (max-width: 650px){.settings-content .page-actions{position:fixed;top:5px;right:4px}.settings-content .page-actions .button-save{min-height:0;height:30px;padding:0.5em 1.37em}}.settings-content .page-actions.page-actions-alt{left:40px}@media (max-width: 1000px){.settings-content .page-actions.page-actions-alt{left:15px}}.settings-content .page-actions .button-add{position:relative;padding-left:50px;border:rgba(0,0,0,0.07) 1px solid}.settings-content .page-actions .button-add:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e032";font-size:1.4em;color:rgba(255,255,255,0.6);position:absolute;top:0;padding:9px 8px 0 0;left:9px;bottom:0;width:26px;border-right:rgba(0,0,0,0.07) 1px solid}.settings-content .page-actions .button-add:hover{text-decoration:none}@media (max-width: 650px){.settings-content .page-actions .button-add{height:30px;min-height:30px;padding:6px 10px 8px 40px}.settings-content .page-actions .button-add:before{padding-top:7px;left:8px;width:22px}}.settings-content .content{position:absolute;top:0;right:0;left:0;bottom:0;padding:40px;overflow:auto;-webkit-overflow-scrolling:touch}.settings-content .content:before{display:block;content:"";height:87px}.settings-content .content.no-padding{padding:0}@media (max-width: 1000px){.settings-content .content{padding-left:15px;padding-right:15px}}@media (max-width: 550px){.settings-content .content{padding:0 15px 40px}}.settings-content .description-container textarea,.settings-content .bio-container textarea{min-height:115px}.settings-content .word-count{float:right;font-weight:bold;color:#9e9d95}@media (max-width: 550px){.settings-content textarea{max-width:100%}.settings-content textarea+p{max-width:100%}} -.header-injection,.footer-injection{margin-top:3.2em}.ghost-setup{color:#7d878a;background:#242628}@media (max-width: 550px){.ghost-setup{background:#18191b}}.ghost-setup main{top:15px}@media (max-width: 550px){.ghost-setup main{top:0}} -.setup-box{display:table;max-width:500px;height:90%;margin:0 auto;padding:0}.setup-form{max-width:530px;padding:40px;color:#a5acae;background:#18191b;border-radius:2px}@media (max-width: 400px){.setup-form{padding:15px}}.setup-form header{margin-bottom:30px}.setup-form label{color:#e2edf2;font-weight:300}@media (max-width: 550px){.setup-form label{width:100%}}.setup-form input{padding:7px;border:none;color:#fff;background:#3c4043;-webkit-transition:background ease 0.25s;-moz-transition:background ease 0.25s;transition:background ease 0.25s}.setup-form input:focus{border:none;background:#484c50}.setup-form input:-webkit-autofill{-webkit-box-shadow:0 0 0px 1000px #e2edf2 inset !important}.setup-form h1{margin:0;font-weight:200;font-size:26px;color:#e2edf2}@media (max-width: 550px){.setup-form h1{font-size:20px}}.setup-form h2{margin:6px 0 0 0;padding:0;border:none;font-weight:200;font-size:16px;color:#7d878a}@media (max-width: 550px){.setup-form h2{font-size:14px}}.setup-form p{font-size:12px;line-height:1.4em;color:#7d878a}.setup-form footer{margin:30px 0 5px 0}.setup-form .button-add{width:100%;padding:0.9em 1.8em;font-size:13px}.settings .user-group-header{margin-bottom:0px;padding-bottom:20px;border:0 none;border-bottom:1px solid #d9d6c5}.settings .user-group-header h3{display:inline-block;margin:0;color:#c0bfb6;font-weight:normal;font-size:1.1em;line-height:1em}.settings .user-search{display:inline-block;float:right}.settings .user-search label{margin:0}.settings .user-search:hover .user-search-input,.settings .user-search .user-search-input:focus{width:260px;padding:0 10px}.settings .user-search .user-search-input{width:0px;padding:0;border:none;border-bottom:#f1f0ea 1px solid;-webkit-transition:width 0.2s ease-in-out;-moz-transition:width 0.2s ease-in-out;transition:width 0.2s ease-in-out;box-shadow:none}.settings .user-search .search-icon:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e007";font-size:1em;color:#c0bfb6}.settings .user-search .search-icon:hover{text-decoration:none}.settings .users{padding:0px;margin-top:0px;list-style:none}.settings .user{display:block;width:100%;padding:20px;border:0 none;border-top:1px solid #e2edf2}.settings .user:first-child{border:none}.settings .user .user-image{display:inline-block;width:40px;height:40px;margin-right:17px;vertical-align:middle;background-color:#edece4;border-radius:20px}.settings .user .user-image.invite{padding-top:8px;text-align:center}.settings .user .user-image.invite:before{font-family:"GhostIcons";font-weight:normal;font-style:normal;vertical-align:-7%;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;content:"\e012";font-size:1em;color:#aaa9a2}.settings .user .user-image.invite:hover{text-decoration:none}.settings .user .user-image img{width:40px;height:40px;border-radius:20px}.settings .user .user-meta{display:inline-block;vertical-align:middle}.settings .user .user-name{margin:0;margin-top:0.4em;font-weight:400;font-size:1.2em;line-height:1em}.settings .user .user-last-seen{line-height:1em}.settings .user-actions-cog{margin-right:6px}.settings .user-actions-menu{top:49px;right:69px;width:145px}.settings .user-actions-menu .delete:hover{background:#e25440}.settings .user-role{padding:2px 8px;float:right;font-size:0.8em;color:#fff;text-transform:uppercase}.settings .user-role.admin{background-color:#DE523A}.settings .user-role.editor{background-color:#4A8CBD}.settings .user-profile-header{position:relative;max-height:400px;overflow:hidden}.settings .user-profile-header:after{content:"";position:absolute;left:0;right:0;bottom:0;height:110px;background-color:transparent;background-image:-webkit-linear-gradient(transparent,rgba(0,0,0,0.3));background-image:linear-gradient(transparent,rgba(0,0,0,0.3))}.settings .cover-image{display:block;line-height:0;width:100%;height:auto;min-height:180px}.settings .edit-cover-image{position:absolute;right:35px;bottom:34px;min-height:34px;height:34px;background:rgba(0,0,0,0.3);border-radius:0;color:rgba(255,255,255,0.8);z-index:2;border-radius:2px;-webkit-transition:color 0.3s ease,background 0.3s ease;-moz-transition:color 0.3s ease,background 0.3s ease;transition:color 0.3s ease,background 0.3s ease}@media (max-width: 1000px){.settings .edit-cover-image{right:15px}}.settings .edit-cover-image:hover{color:#fff;background:rgba(0,0,0,0.5)}.settings .user-image+.form-group{margin-top:155px;max-width:500px}@media (min-width: 651px) and (max-width: 1000px){.settings .user-image+.form-group{width:calc(100% - 201px)}}@media (min-width: 651px){.settings .user-image+.form-group{min-width:285px;margin-top:0;top:-110px;left:40px}}@media (min-width: 1001px){.settings .user-image+.form-group{width:calc(100% - 221px)}}.settings .user-profile{position:relative;top:-110px;z-index:1}@media (min-width: 651px){.settings .user-profile{padding-left:143px}}.settings .user-profile fieldset{padding:0 40px}.settings .user-profile textarea{min-width:240px}@media (max-width: 650px){.settings fieldset.user-details-top{margin-bottom:10px}}@media (min-width: 651px){.settings fieldset.user-details-top{margin-bottom:0;padding:0}.settings fieldset.user-details-top p{color:#fff}}@media (max-width: 550px){.settings fieldset.user-details-top,.settings fieldset.user-details-bottom{padding-left:15px;padding-right:15px}}.settings .user-image{display:block;position:relative;width:126px;height:126px;float:left;margin-left:34px;margin-right:20px;text-align:center;border-radius:100%;overflow:hidden;padding:3px;background:#fff;z-index:2;margin-left:-104px}@media (max-width: 550px){.settings .user-image{margin-left:0px}}@media (min-width: 551px) and (max-width: 650px){.settings .user-image{margin-left:20px}}.settings .user-image .img{display:block;width:120px;height:120px;background-size:cover;background-position:center center;border-radius:100%}.settings .user-image:hover .edit-user-image{opacity:1}.settings .edit-user-image{position:absolute;top:3px;right:3px;bottom:3px;left:3px;border-radius:100%;width:calc(100% - 6px);background:rgba(0,0,0,0.5);opacity:0;color:#fff;line-height:120px;text-transform:uppercase;text-decoration:none;-webkit-transition:opacity 0.3s ease;-moz-transition:opacity 0.3s ease;transition:opacity 0.3s ease}@media (min-width: 651px){.settings label[for='user-name']{visibility:hidden}.settings #user-name{border-color:#fff;font-size:1.5rem;padding:3px 12px}}.settings .user-details-bottom{padding:0 40px}@media (min-width: 651px){.settings .user-details-bottom{margin:-104px 0 0 0}} -@media (max-width: 650px){.users-back{display:none}}@media (max-width: 650px){.page-actions .user-actions-cog{padding:7px 0;min-height:30px}.page-actions .user-actions-cog .icon-settings{margin-left:8px;margin-right:8px}.settings .user-actions-menu{top:43px;right:66px}.settings-content .user-settings-header{height:0;padding:0;margin:0;border-bottom:0}.user-settings-header .title,.settings-content .settings-user:before{display:none}} +html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0} diff --git a/ghost/admin/docs/dist/fonts/icons.eot b/ghost/admin/docs/dist/fonts/icons.eot index 08fd9eaf04..f1558ed398 100644 Binary files a/ghost/admin/docs/dist/fonts/icons.eot and b/ghost/admin/docs/dist/fonts/icons.eot differ diff --git a/ghost/admin/docs/dist/fonts/icons.svg b/ghost/admin/docs/dist/fonts/icons.svg index 89979452c6..238263fb87 100644 --- a/ghost/admin/docs/dist/fonts/icons.svg +++ b/ghost/admin/docs/dist/fonts/icons.svg @@ -7,68 +7,68 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/ghost/admin/docs/dist/fonts/icons.ttf b/ghost/admin/docs/dist/fonts/icons.ttf index 4a29855ee0..7540a8759f 100644 Binary files a/ghost/admin/docs/dist/fonts/icons.ttf and b/ghost/admin/docs/dist/fonts/icons.ttf differ diff --git a/ghost/admin/docs/dist/fonts/icons.woff b/ghost/admin/docs/dist/fonts/icons.woff index a7f976a524..836a299df9 100644 Binary files a/ghost/admin/docs/dist/fonts/icons.woff and b/ghost/admin/docs/dist/fonts/icons.woff differ diff --git a/ghost/admin/docs/index-old.html b/ghost/admin/docs/index-old.html new file mode 100644 index 0000000000..5b3132f1f5 --- /dev/null +++ b/ghost/admin/docs/index-old.html @@ -0,0 +1,418 @@ + + + + + + + + Ghost Admin + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+ + +
+ + +
+ + +
+
+ +

About

+
+ +
+ +
+

+ + + v0.4.2 +

+

A free, open, simple publishing platform

+ +
+
+

+ + Version: 0.4.2 (That latest version!)
+ + Environment: Production
+ Database: SQLite3
+ Mail: Native +

+
+ +
+
+ +
+

The People Who Made it Possible

+ + +
    +
  • ErisDS
  • +
  • JohnONolan
  • +
  • matthojo
  • +
  • jgable
  • +
  • sebgie
  • +
  • halfdan
  • +
  • javorszky
  • +
  • jaswilli
  • +
  • hswolff
  • +
  • cobbspur
  • +
  • tgriesser
  • +
  • gotdibbs
  • +
  • novaugust
  • +
  • darvelo
  • +
  • ricardobeat
  • +
  • jamesbloomer
  • +
  • cgiffard
  • +
  • jgillich
  • +
  • shindakun
  • +
  • PaulAdamDavis
  • +
+ +

Ghost is built by an incredible group of contributors from all over the world. Here are just a few of the people who helped create the version you’re using right now.

+ + Find out how you can get involved + + +
+ +
+ +
+ +
+ +
+ + + \ No newline at end of file diff --git a/ghost/admin/docs/index.html b/ghost/admin/docs/index.html new file mode 100644 index 0000000000..9e170c8ba1 --- /dev/null +++ b/ghost/admin/docs/index.html @@ -0,0 +1,6 @@ +--- +layout: default +title: Ghost UI · Making publishing beautiful. +--- + +test \ No newline at end of file diff --git a/ghost/admin/docs/index.md b/ghost/admin/docs/index.md deleted file mode 100644 index 51c4a3fa87..0000000000 --- a/ghost/admin/docs/index.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -layout: default -title: Ghost UI ---- - -# Ghost-UI \ No newline at end of file