More theme settings cleanup

This commit is contained in:
Sodbileg Gansukh 2022-05-16 19:33:11 +08:00
parent 98f7f53119
commit 838120323a
8 changed files with 73 additions and 41 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -179,6 +179,10 @@ body:not(.has-cover-image) .site-header-content:not(.vertical) {
padding-bottom: 32px; padding-bottom: 32px;
} }
.site-header-content.vertical .site-title + .site-description {
margin-top: 16px;
}
@media (max-width: 600px) { @media (max-width: 600px) {
.site-description { .site-description {
max-width: 80vmin; max-width: 80vmin;
@ -225,8 +229,7 @@ body:not(.has-cover-image) .site-header-content:not(.vertical) {
display: flex; display: flex;
align-items: center; align-items: center;
height: 40px; height: 40px;
max-width: 200px; max-width: 400px;
text-align: center;
word-break: break-all; word-break: break-all;
} }
@ -237,6 +240,10 @@ body:not(.has-cover-image) .site-header-content:not(.vertical) {
letter-spacing: -0.02em; letter-spacing: -0.02em;
} }
.has-cover-image .gh-head-logo {
color: #fff;
}
.no-logo .gh-head-logo { .no-logo .gh-head-logo {
display: none; display: none;
} }
@ -548,6 +555,10 @@ body:not(.gh-head-open) .gh-burger:hover .gh-burger-inner::after {
padding-bottom: 55%; padding-bottom: 55%;
} }
.post-card.keep-ratio:not(.post-card-large):not(.post-card-full) .post-card-image-link::after {
display: none;
}
.post-card-image { .post-card-image {
position: absolute; position: absolute;
inset: 0; inset: 0;
@ -557,6 +568,10 @@ body:not(.gh-head-open) .gh-burger:hover .gh-burger-inner::after {
object-fit: cover; object-fit: cover;
} }
.post-card.keep-ratio:not(.post-card-large):not(.post-card-full) .post-card-image {
position: static;
}
.post-card-content-link { .post-card-content-link {
position: relative; position: relative;
display: block; display: block;
@ -608,7 +623,7 @@ body:not(.gh-head-open) .gh-burger:hover .gh-burger-inner::after {
display: -webkit-box; display: -webkit-box;
overflow-y: hidden; overflow-y: hidden;
margin-top: 12px; margin-top: 12px;
max-width: 56em; max-width: 720px;
line-height: 1.5; line-height: 1.5;
-webkit-line-clamp: 3; -webkit-line-clamp: 3;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
@ -619,6 +634,10 @@ body:not(.gh-head-open) .gh-burger:hover .gh-burger-inner::after {
font-family: var(--font-sans); font-family: var(--font-sans);
} }
.post-card:not(.post-card-large):not(.post-card-full):not(.dynamic) .post-card-excerpt {
display: none;
}
.post-card-meta { .post-card-meta {
display: flex; display: flex;
align-items: center; align-items: center;
@ -724,8 +743,8 @@ make sure this only happens on large viewports / desktop-ish devices.
.post-card-large .post-card-title { .post-card-large .post-card-title {
margin-top: 0; margin-top: 0;
font-size: 4rem; font-size: 4.4rem;
line-height: 1.05; line-height: 1;
} }
.post-card-large .post-card-excerpt { .post-card-large .post-card-excerpt {
@ -751,8 +770,22 @@ make sure this only happens on large viewports / desktop-ish devices.
grid-column: span 6; grid-column: span 6;
} }
.post-card-full .post-card-image-link {
margin-bottom: 40px;
}
.post-card-full .post-card-primary-tag {
margin-bottom: 14px;
}
.post-card-full .post-card-title { .post-card-full .post-card-title {
font-size: 6.4rem; font-size: 6.4rem;
line-height: 0.95;
}
.post-card-full .post-card-excerpt {
margin-top: 20px;
font-size: 1.8rem;
} }
.post-card.dynamic { .post-card.dynamic {

View File

@ -27,7 +27,7 @@
{{ghost_head}} {{ghost_head}}
</head> </head>
<body class="{{body_class}}{{#match @custom.title_font "=" "Elegant serif"}} has-serif-title{{/match}}{{#match @custom.body_font "=" "Modern sans-serif"}} has-sans-body{{/match}}{{#if @site.cover_image}} has-cover-image{{/if}}{{#is "home"}}{{#match @custom.identity "!=" "None"}}{{#if @custom.include_logo_in_identity}} no-logo{{/if}}{{/match}}{{/is}}"> <body class="{{body_class}}{{#match @custom.title_font "=" "Elegant serif"}} has-serif-title{{/match}}{{#match @custom.body_font "=" "Modern sans-serif"}} has-sans-body{{/match}}{{#is "home"}}{{#if @site.cover_image}} has-cover-image{{/if}}{{#match @custom.about_section "!=" "None"}}{{#if @custom.include_logo_in_about_section}} no-logo{{/if}}{{/match}}{{/is}}">
<div class="viewport"> <div class="viewport">
<header id="gh-head" class="gh-head outer"> <header id="gh-head" class="gh-head outer">

View File

@ -2,7 +2,7 @@
{{!-- The tag above means: insert everything in this file {{!-- The tag above means: insert everything in this file
into the {body} of the default.hbs template --}} into the {body} of the default.hbs template --}}
<div class="site-header-content outer{{#match @custom.identity "Vertical"}} vertical{{/match}}"> <div class="site-header-content outer{{#match @custom.about_section "Vertical"}} vertical{{/match}}">
{{#if @site.cover_image}} {{#if @site.cover_image}}
{{!-- This is a responsive image, it loads different sizes depending on device {{!-- This is a responsive image, it loads different sizes depending on device
@ -18,18 +18,26 @@ into the {body} of the default.hbs template --}}
/> />
{{/if}} {{/if}}
{{#match @custom.identity "!=" "None"}} {{#match @custom.about_section "!=" "None"}}
<section class="site-header-inner inner"> <section class="site-header-inner inner">
{{#if @custom.include_logo_in_identity}} {{#if @custom.include_logo_in_about_section}}
{{#if @site.logo}} {{#if @site.logo}}
<img class="site-logo" src="{{@site.logo}}" alt="{{@site.title}}"> <img class="site-logo" src="{{@site.logo}}" alt="{{@site.title}}">
{{/if}} {{/if}}
{{/if}} {{/if}}
<div class="site-header-wrapper"> <div class="site-header-wrapper">
{{#match @custom.identity "Horizontal"}} {{#match @custom.about_section "Horizontal"}}
<h1 class="site-title">{{@site.title}}</h1> <h1 class="site-title">{{@site.title}}</h1>
{{else}}
{{#if @custom.include_logo_in_about_section}}
{{#unless @site.logo}}
<h1 class="site-title">{{@site.title}}</h1>
{{/unless}}
{{/if}}
{{/match}} {{/match}}
{{#if @site.description}}
<p class="site-description">{{@site.description}}</p> <p class="site-description">{{@site.description}}</p>
{{/if}}
</div> </div>
</section> </section>
{{/match}} {{/match}}
@ -38,16 +46,14 @@ into the {body} of the default.hbs template --}}
{{!-- The main content area --}} {{!-- The main content area --}}
<main id="site-main" class="site-main outer"> <main id="site-main" class="site-main outer">
<div class="inner posts"> <div class="inner posts">
<div class="post-feed{{#match @custom.feed_layout "List"}} list{{/match}}"> <div class="post-feed{{#match @custom.feed_layout "List"}} list{{/match}}">
{{#foreach posts}} {{#foreach posts}}
{{!-- The tag below includes the markup for each post - partials/post-card.hbs --}} {{!-- The tag below includes the markup for each post - partials/post-card.hbs --}}
{{> "post-card"}} {{> "post-card"}}
{{/foreach}} {{/foreach}}
</div> </div>
</div> </div>
</main> </main>

View File

@ -105,7 +105,7 @@
], ],
"default": "Elegant serif" "default": "Elegant serif"
}, },
"identity": { "about_section": {
"type": "select", "type": "select",
"options": [ "options": [
"Horizontal", "Horizontal",
@ -115,7 +115,7 @@
"default": "Horizontal", "default": "Horizontal",
"group": "homepage" "group": "homepage"
}, },
"include_logo_in_identity": { "include_logo_in_about_section": {
"type": "boolean", "type": "boolean",
"default": true, "default": true,
"group": "homepage" "group": "homepage"
@ -139,6 +139,11 @@
"default": "Dynamic grid", "default": "Dynamic grid",
"group": "homepage" "group": "homepage"
}, },
"keep_card_thumbnail_ratio": {
"type": "boolean",
"default": false,
"group": "homepage"
},
"color_scheme": { "color_scheme": {
"type": "select", "type": "select",
"options": [ "options": [
@ -158,16 +163,6 @@
"default": "Wide", "default": "Wide",
"group": "post" "group": "post"
}, },
"email_signup_for_logged_out_visitors": {
"type": "select",
"options": [
"Footer",
"Bottom of post",
"None"
],
"default": "Footer",
"group": "post"
},
"email_signup_text": { "email_signup_text": {
"type": "text", "type": "text",
"default": "Sign up for more like this.", "default": "Sign up for more like this.",

View File

@ -1,7 +1,7 @@
{{!-- This is a partial file used to generate a post "card" {{!-- This is a partial file used to generate a post "card"
which templates loop over to generate a list of posts. --}} which templates loop over to generate a list of posts. --}}
<article class="post-card {{post_class}}{{#is "home"}}{{^is "paged"}}{{#has index="0"}}{{#match @custom.first_post_layout "Large card"}} post-card-large{{/match}}{{#match @custom.first_post_layout "Full-width card"}} post-card-full{{/match}}{{/has}}{{/is}}{{/is}}{{#match @custom.feed_layout "Dynamic grid"}}{{#match @custom.first_post_layout "None"}}{{#has index="0,1"}} dynamic{{/has}}{{else}}{{#has index="1,2"}} dynamic{{/has}}{{/match}}{{/match}}"> <article class="post-card {{post_class}}{{#is "home"}}{{^is "paged"}}{{#has index="0"}}{{#match @custom.first_post_layout "Large card"}} post-card-large{{/match}}{{#match @custom.first_post_layout "Full-width card"}} post-card-full{{/match}}{{/has}}{{#match @custom.feed_layout "Dynamic grid"}}{{#match @custom.first_post_layout "None"}}{{#has index="0,1"}} dynamic{{/has}}{{else}}{{#has index="1,2"}} dynamic{{/has}}{{/match}}{{/match}}{{/is}}{{/is}}{{#if @custom.keep_card_thumbnail_ratio}} keep-ratio{{/if}}">
{{#if feature_image}} {{#if feature_image}}
<a class="post-card-image-link" href="{{url}}"> <a class="post-card-image-link" href="{{url}}">

View File

@ -87,7 +87,6 @@ into the {body} tag of the default.hbs template --}}
</main> </main>
{{!-- A signup call to action is displayed here, unless viewed as a logged-in member --}} {{!-- A signup call to action is displayed here, unless viewed as a logged-in member --}}
{{#match @custom.email_signup_for_logged_out_visitors "!=" "None"}}
{{#unless @member}}{{#if access}} {{#unless @member}}{{#if access}}
<section class="footer-cta outer"> <section class="footer-cta outer">
<div class="inner"> <div class="inner">
@ -101,7 +100,6 @@ into the {body} tag of the default.hbs template --}}
</div> </div>
</section> </section>
{{/if}}{{/unless}} {{/if}}{{/unless}}
{{/match}}
{{!-- Read more links, just above the footer --}} {{!-- Read more links, just above the footer --}}