diff --git a/ghost/admin/app/styles/layouts/main.css b/ghost/admin/app/styles/layouts/main.css index 1496b4cbe7..1674fcad36 100644 --- a/ghost/admin/app/styles/layouts/main.css +++ b/ghost/admin/app/styles/layouts/main.css @@ -405,6 +405,12 @@ body > .ember-view:not(.liquid-target-container) { .gh-mobile-nav-bar { display: none; } @media (max-width: 800px) { + + /* Make space for the mobile nav bar */ + .gh-viewport { + padding-bottom: 55px; + } + .gh-mobile-nav-bar { display: flex; align-items: center; @@ -518,9 +524,7 @@ body > .ember-view:not(.liquid-target-container) { .view-content { position: relative; flex-grow: 1; - overflow-x: hidden; - overflow-y: auto; - -webkit-overflow-scrolling: touch; + padding-bottom: 4vw; } .view-content { diff --git a/ghost/admin/app/styles/layouts/settings.css b/ghost/admin/app/styles/layouts/settings.css index b2793a4227..7dd5f862af 100644 --- a/ghost/admin/app/styles/layouts/settings.css +++ b/ghost/admin/app/styles/layouts/settings.css @@ -14,7 +14,8 @@ } .gh-setting-content { - margin-right: 0 20px 0 0; + width: 100%; + margin: 0 50px 0 0; } .gh-setting-title { @@ -51,6 +52,11 @@ height: 9px; } +.gh-setting-content-extended { + width: 100%; + margin-top: 25px; +} + /* Navigation /* ---------------------------------------------------------- */ diff --git a/ghost/admin/app/styles/patterns/forms.css b/ghost/admin/app/styles/patterns/forms.css index 24a9508df3..daaf3ca843 100644 --- a/ghost/admin/app/styles/patterns/forms.css +++ b/ghost/admin/app/styles/patterns/forms.css @@ -57,7 +57,7 @@ input { .form-group { position: relative; margin-bottom: 1.6em; - max-width: 500px; + max-width: 700px; width: 100%; user-select: text; } @@ -124,13 +124,13 @@ input { .gh-select, select { display: block; - padding: 8px 10px; + padding: 10px 12px; width: 100%; border: color(var(--lightgrey) l(-5%) s(-10%)) 1px solid; border-radius: var(--border-radius); color: color(var(--midgrey) l(-18%)); - font-size: 1.4rem; - font-weight: normal; + font-size: 1.6rem; + font-weight: 300; user-select: text; transition: border-color 0.15s linear; diff --git a/ghost/admin/app/templates/components/gh-timezone-select.hbs b/ghost/admin/app/templates/components/gh-timezone-select.hbs index 8b770b2f5a..67431c9ea2 100644 --- a/ghost/admin/app/templates/components/gh-timezone-select.hbs +++ b/ghost/admin/app/templates/components/gh-timezone-select.hbs @@ -1,4 +1,3 @@ - {{one-way-select id="activeTimezone" diff --git a/ghost/admin/app/templates/settings/general.hbs b/ghost/admin/app/templates/settings/general.hbs index 05fd28cbd6..e415cc0d25 100644 --- a/ghost/admin/app/templates/settings/general.hbs +++ b/ghost/admin/app/templates/settings/general.hbs @@ -2,40 +2,83 @@

General

- {{#gh-spin-button class="gh-btn gh-btn-blue" action="save" submitting=submitting data-test-save-button=true}}Save{{/gh-spin-button}} + {{#gh-spin-button class="gh-btn gh-btn-blue" action="save" submitting=submitting data-test-save-button=true}}Save settings{{/gh-spin-button}}
-
-
- {{#gh-form-group errors=model.errors hasValidated=model.hasValidated property="title"}} - - {{gh-input model.title id="blog-title" name="general[title]" type="text" focusOut=(action "validate" "title" target=model) update=(action (mut model.title))}} - {{gh-error-message errors=model.errors property="title"}} -

The name of your blog

- {{/gh-form-group}} +
Publication info
+
+
+
Title & description
+
The details used to identify your publication around the web
+
+ {{#gh-form-group errors=model.errors hasValidated=model.hasValidated property="title"}} + {{gh-input model.title id="blog-title" name="general[title]" type="text" focusOut=(action "validate" "title" target=model) update=(action (mut model.title))}} + {{gh-error-message errors=model.errors property="title"}} +

The name of your site

+ {{/gh-form-group}} - {{#gh-form-group errors=model.errors hasValidated=model.hasValidated property="description" class="description-container"}} - - {{gh-textarea model.description id="blog-description" name="general[description]" focusOut=(action "validate" "description" target=model) update=(action (mut model.description))}} - {{gh-error-message errors=model.errors property="description"}} -

- Describe what your blog is about - {{gh-count-characters model.description}} -

- {{/gh-form-group}} -
+ {{#gh-form-group errors=model.errors hasValidated=model.hasValidated property="description" class="description-container"}} + {{gh-input model.description id="blog-description" name="general[description]" type="text" focusOut=(action "validate" "description" target=model) update=(action (mut model.description))}} + {{gh-error-message errors=model.errors property="description"}} +

Used in your theme, meta data and search results

+ {{/gh-form-group}} + + +
+ +
+ +
+
+
Site timezone
+
Set the time and date of your publication, used for all published posts
+
+ {{gh-timezone-select + activeTimezone=model.activeTimezone + availableTimezones=availableTimezones + update=(action "setTimezone")}} +
+
+
+ +
+
-
- +
Publication identity
+
+
+
Publication icon
+
A square, social icon used in the UI of your publication, at least 60x60px
+
+
+ {{#if model.icon}} + icon + {{else}} + + {{/if}} + + {{#if showUploadIconModal}} + {{gh-fullscreen-modal "upload-image" + model=(hash model=model imageProperty="icon" accept=iconMimeTypes extensions=iconExtensions allowUrlInput=false uploadUrl="/uploads/icon/") + close=(action "toggleUploadIconModal") + modifier="action wide"}} + {{/if}} +
+
+
+
+
Publication logo
+
The primary logo for your brand displayed across your theme, should be transparent and at least 600px x 72px
+
+
{{#if model.logo}} {{else}} - + {{/if}} -

Display a logo for your publication

{{#if showUploadLogoModal}} {{gh-fullscreen-modal "upload-image" @@ -44,34 +87,18 @@ modifier="action wide"}} {{/if}}
- - {{#if config.fileStorage}} -
- - {{#if model.icon}} - icon - {{else}} - - {{/if}} -

Upload a square blog icon ('.ico' or '.png', max. 100kb, 32px * 32px up to 1,000px * 1,000px) for your publication

- - {{#if showUploadIconModal}} - {{gh-fullscreen-modal "upload-image" - model=(hash model=model imageProperty="icon" accept=iconMimeTypes extensions=iconExtensions allowUrlInput=false uploadUrl="/uploads/icon/") - close=(action "toggleUploadIconModal") - modifier="action wide"}} - {{/if}} -
- {{/if}} - -
- +
+
+
+
Publication cover
+
An optional large background image for your site
+
+
{{#if model.cover}} cover photo {{else}} - + {{/if}} -

Display a cover image on your site

{{#if showUploadCoverModal}} {{gh-fullscreen-modal "upload-image" @@ -80,67 +107,65 @@ modifier="action wide"}} {{/if}}
+
-
- -
- {{#gh-form-group errors=model.errors hasValidated=model.hasValidated property="postsPerPage"}} - - {{! `pattern` brings up numeric keypad allowing any number of digits}} - {{gh-input model.postsPerPage id="postsPerPage" name="general[postsPerPage]" focusOut=(action "validate" "postsPerPage" target=model) min="1" max="1000" type="number" pattern="[0-9]*" update=(action (mut model.postsPerPage))}} - {{gh-error-message errors=model.errors property="postsPerPage"}} -

How many posts should be displayed on each page

- {{/gh-form-group}} -
- -
- - -
- -
+
Social accounts
+
+
+
Social accounts
+
Link your social accounts for full structured data and rich card support
+
{{#gh-form-group errors=model.errors hasValidated=model.hasValidated property="facebook"}} - {{gh-error-message errors=model.errors property="facebook"}} -

URL of your blog's Facebook Page

+

URL of your publication's Facebook Page

{{/gh-form-group}} -
-
{{#gh-form-group errors=model.errors hasValidated=model.hasValidated property="twitter"}} - {{gh-error-message errors=model.errors property="twitter"}} -

URL of your blog's Twitter profile

+

URL of your publication's Twitter profile

{{/gh-form-group}}
+
+
+ +
+
- {{gh-timezone-select - activeTimezone=model.activeTimezone - availableTimezones=availableTimezones - update=(action "setTimezone")}} - -
- - -
- +
Advanced settings
+
+
+
Use dated permalinks
+
Include the date in your post URLs, eg. blogurl.com/2017/01/post-title/
+
+
+ {{one-way-checkbox isDatedPermalinks id="permalinks" name="general[permalinks]" type="checkbox" update=(action (mut isDatedPermalinks))}} + +
+
+
+
+
Make this site private
+
Enable protection with simple shared password, All search engine optimization and social features will be disabled.
{{#if model.isPrivate}} +
{{#gh-form-group errors=model.errors hasValidated=model.hasValidated property="password"}} {{gh-input model.password name="general[password]" type="text" focusOut=(action "validate" "password" target=model) update=(action (mut model.password))}} {{gh-error-message errors=model.errors property="password"}} -

This password will be needed to access your blog. All search engine optimization and social features are now disabled. This password is stored in plaintext.

+

Set the password for this site

{{/gh-form-group}} +
{{/if}} -
+
+
+ {{one-way-checkbox model.isPrivate id="isPrivate" name="general[isPrivate]" type="checkbox" update=(action (mut model.isPrivate))}} + +
+
+ + + +

Themes

@@ -169,6 +194,7 @@ {{/if}}
+