Various improvements
- new mono font - copy updates - simpler logic for header section
This commit is contained in:
parent
d120bf0006
commit
3c79301108
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -65,8 +65,7 @@ production stylesheet in assets/built/screen.css
|
||||
--font-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
--font-serif: "EB Garamond", Georgia, Times, serif;
|
||||
--font-serif-alt: Georgia, Times, serif;
|
||||
--font-slab: "Roboto Slab", Georgia, Times, serif;
|
||||
--font-mono: Menlo, Courier, monospace;
|
||||
--font-mono: "JetBrains Mono", Menlo, Consolas, Monaco, "Liberation Mono", "Lucida Console", monospace;
|
||||
--container-width: 1320px;
|
||||
--container-gap: clamp(24px, 1.7032rem + 1.9355vw, 48px);
|
||||
--grid-gap: 42px;
|
||||
@ -112,11 +111,20 @@ production stylesheet in assets/built/screen.css
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Roboto Slab";
|
||||
font-family: "JetBrains Mono";
|
||||
font-style: normal;
|
||||
font-weight: 100 900;
|
||||
font-weight: 100 800;
|
||||
font-display: swap;
|
||||
src: url(/assets/fonts/roboto-slab-roman.woff2) format("woff2");
|
||||
src: url(/assets/fonts/jetbrains-mono-roman.woff2) format("woff2");
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "JetBrains Mono";
|
||||
font-style: italic;
|
||||
font-weight: 100 800;
|
||||
font-display: swap;
|
||||
src: url(/assets/fonts/jetbrains-mono-italic.woff2) format("woff2");
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
@ -279,7 +287,7 @@ button.gh-form-input {
|
||||
color: rgb(0 0 0 / 0.3);
|
||||
}
|
||||
|
||||
:is(.has-serif-title, .has-slab-title) .gh-form-input {
|
||||
:is(.has-serif-title, .has-mono-title) .gh-form-input {
|
||||
padding-inline: 20px;
|
||||
}
|
||||
|
||||
@ -315,7 +323,7 @@ button.gh-form-input {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
:is(.has-serif-title,.has-slab-title) button.gh-form-input {
|
||||
:is(.has-serif-title,.has-mono-title) button.gh-form-input {
|
||||
padding-inline-start: 50px;
|
||||
}
|
||||
|
||||
@ -335,7 +343,7 @@ button.gh-form-input {
|
||||
color: var(--color-secondary-text);
|
||||
}
|
||||
|
||||
:is(.has-serif-title,.has-slab-title) .gh-form > svg {
|
||||
:is(.has-serif-title,.has-mono-title) .gh-form > svg {
|
||||
left: 16px;
|
||||
}
|
||||
|
||||
@ -975,6 +983,7 @@ Search LOGO Login Subscribe
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
flex-wrap: wrap;
|
||||
padding-bottom: 1px;
|
||||
font-size: 1.25rem;
|
||||
font-weight: 500;
|
||||
line-height: 1.05;
|
||||
@ -1686,7 +1695,7 @@ Search LOGO Login Subscribe
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
}
|
||||
|
||||
.gh-container-title:has(+ .gh-main:not(:has(.gh-card))) {
|
||||
.gh-container:not(:has(.gh-card)) .gh-container-title {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -2193,8 +2202,8 @@ unless a heading is the very first element in the post content */
|
||||
font-family: var(--font-serif);
|
||||
}
|
||||
|
||||
.has-slab-title .kg-toggle-card .kg-toggle-heading-text {
|
||||
font-family: var(--font-slab);
|
||||
.has-mono-title .kg-toggle-card .kg-toggle-heading-text {
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
/* Callout */
|
||||
@ -2232,8 +2241,8 @@ blockquote.kg-blockquote-alt {
|
||||
font-family: var(--font-serif);
|
||||
}
|
||||
|
||||
.has-slab-title .kg-card.kg-header-card h2.kg-header-card-header {
|
||||
font-family: var(--font-slab);
|
||||
.has-mono-title .kg-card.kg-header-card h2.kg-header-card-header {
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
.has-serif-body .kg-header-card h3.kg-header-card-subheader {
|
||||
@ -2287,8 +2296,8 @@ blockquote.kg-blockquote-alt {
|
||||
font-family: var(--font-serif);
|
||||
}
|
||||
|
||||
.has-slab-title .kg-product-card.kg-card .kg-product-card-title {
|
||||
font-family: var(--font-slab);
|
||||
.has-mono-title .kg-product-card.kg-card .kg-product-card-title {
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
.has-serif-body .kg-product-card-description :is(p, ul, ol) {
|
||||
@ -2466,7 +2475,7 @@ figcaption a {
|
||||
--factor: 1.15;
|
||||
}
|
||||
|
||||
.has-slab-title {
|
||||
.has-mono-title {
|
||||
--factor: 1.1;
|
||||
}
|
||||
|
||||
@ -2479,9 +2488,8 @@ figcaption a {
|
||||
font-weight: 550;
|
||||
}
|
||||
|
||||
.has-slab-title :is(.is-title, .gh-content :is(h2, h3)) {
|
||||
font-family: var(--font-slab);
|
||||
font-weight: 650;
|
||||
.has-mono-title :is(.is-title, .gh-content :is(h2, h3)) {
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
.has-sans-body .is-body {
|
||||
@ -2497,7 +2505,7 @@ figcaption a {
|
||||
letter-spacing: -0.015em;
|
||||
}
|
||||
|
||||
.has-slab-title .gh-header.is-classic .gh-header-title {
|
||||
.has-mono-title .gh-header.is-classic .gh-header-title {
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
@ -2515,7 +2523,7 @@ figcaption a {
|
||||
font-size: calc(1.6rem*var(--factor, 1))
|
||||
}
|
||||
|
||||
.has-slab-title .gh-featured-feed .gh-card-title {
|
||||
.has-mono-title .gh-featured-feed .gh-card-title {
|
||||
font-size: calc(1.5rem*var(--factor, 1));
|
||||
letter-spacing: 0;
|
||||
}
|
||||
@ -2524,12 +2532,12 @@ figcaption a {
|
||||
font-size: clamp(1.6rem, 0.23vw + 1.51rem, 1.8rem);
|
||||
}
|
||||
|
||||
.has-slab-title .gh-card-title {
|
||||
.has-mono-title .gh-card-title {
|
||||
font-size: calc(1.8rem*var(--factor, 1));
|
||||
}
|
||||
|
||||
.has-slab-title .gh-header.gh-header.is-highlight .gh-card-title,
|
||||
.has-slab-title .gh-header.gh-header.gh-header.is-magazine .gh-card-title {
|
||||
.has-mono-title .gh-header.gh-header.is-highlight .gh-card-title,
|
||||
.has-mono-title .gh-header.gh-header.gh-header.is-magazine .gh-card-title {
|
||||
line-height: 1.15;
|
||||
}
|
||||
|
||||
@ -2583,12 +2591,12 @@ figcaption a {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.has-slab-title :is(.gh-button) {
|
||||
border-radius: 6px;
|
||||
.has-mono-title :is(.gh-button) {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.has-slab-title :is(.gh-form) {
|
||||
border-radius: 8px;
|
||||
.has-mono-title :is(.gh-form) {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.has-serif-title .gh-cta-title {
|
||||
@ -2599,7 +2607,7 @@ figcaption a {
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.gh-footer {
|
||||
margin-top: 6vw;
|
||||
margin-top: 12vw;
|
||||
font-size: 1.5rem;
|
||||
color: var(--color-darker-gray);
|
||||
}
|
||||
|
BIN
assets/fonts/jetbrains-mono-italic.woff2
Normal file
BIN
assets/fonts/jetbrains-mono-italic.woff2
Normal file
Binary file not shown.
BIN
assets/fonts/jetbrains-mono-roman.woff2
Normal file
BIN
assets/fonts/jetbrains-mono-roman.woff2
Normal file
Binary file not shown.
Binary file not shown.
@ -4,7 +4,7 @@
|
||||
<main class="gh-main gh-outer">
|
||||
|
||||
{{#author}}
|
||||
<section class="gh-archive{{#if @custom.show_site_in_sidebar}} has-sidebar{{/if}} gh-inner">
|
||||
<section class="gh-archive{{#if @custom.show_publication_info_sidebar}} has-sidebar{{/if}} gh-inner">
|
||||
<div class="gh-archive-inner">
|
||||
<div class="gh-archive-wrapper">
|
||||
<h1 class="gh-article-title is-title">
|
||||
@ -38,6 +38,6 @@
|
||||
</section>
|
||||
{{/author}}
|
||||
|
||||
{{> "components/post-list" feed="archive" postFeedStyle=@custom.post_feed_style showTitle=false showSidebar=@custom.show_site_in_sidebar}}
|
||||
{{> "components/post-list" feed="archive" postFeedStyle=@custom.post_feed_style showTitle=false showSidebar=@custom.show_publication_info_sidebar}}
|
||||
|
||||
</main>
|
@ -41,7 +41,7 @@
|
||||
{{ghost_head}}
|
||||
|
||||
</head>
|
||||
<body class="{{body_class}} has-{{#match @custom.title_font "Elegant serif"}}serif{{else match @custom.title_font "Clean slab"}}slab{{else}}sans{{/match}}-title has-{{#match @custom.body_font "Elegant serif"}}serif{{else}}sans{{/match}}-body">
|
||||
<body class="{{body_class}} has-{{#match @custom.title_font "Elegant serif"}}serif{{else match @custom.title_font "Consistent mono"}}mono{{else}}sans{{/match}}-title has-{{#match @custom.body_font "Elegant serif"}}serif{{else}}sans{{/match}}-body">
|
||||
|
||||
<div class="gh-viewport">
|
||||
|
||||
|
4
home.hbs
4
home.hbs
@ -4,9 +4,9 @@
|
||||
{{> "components/header" headerStyle=@custom.header_style}}
|
||||
|
||||
{{#match @custom.header_style "!=" "Highlight"}}
|
||||
{{> "components/featured" showFeatured=@custom.highlight_featured_posts limit=4}}
|
||||
{{> "components/featured" showFeatured=@custom.show_featured_posts limit=4}}
|
||||
{{/match}}
|
||||
|
||||
{{> "components/cta"}}
|
||||
|
||||
{{> "components/post-list" feed="home" postFeedStyle=@custom.post_feed_style showTitle=true showSidebar=@custom.show_site_in_sidebar}}
|
||||
{{> "components/post-list" feed="home" postFeedStyle=@custom.post_feed_style showTitle=true showSidebar=@custom.show_publication_info_sidebar}}
|
@ -2,5 +2,5 @@
|
||||
{{!-- The tag above means: insert everything in this file into the body of the default.hbs template --}}
|
||||
|
||||
<main class="gh-main">
|
||||
{{> "components/post-list" feed="index" postFeedStyle=@custom.post_feed_style showTitle=true showSidebar=@custom.show_site_in_sidebar}}
|
||||
{{> "components/post-list" feed="index" postFeedStyle=@custom.post_feed_style showTitle=true showSidebar=@custom.show_publication_info_sidebar}}
|
||||
</main>
|
19
package.json
19
package.json
@ -100,17 +100,17 @@
|
||||
"header_and_footer_color": {
|
||||
"type": "select",
|
||||
"options": [
|
||||
"Accent color",
|
||||
"Background color"
|
||||
"Background color",
|
||||
"Accent color"
|
||||
],
|
||||
"default": "Accent color"
|
||||
"default": "Background color"
|
||||
},
|
||||
"title_font": {
|
||||
"type": "select",
|
||||
"options": [
|
||||
"Modern sans-serif",
|
||||
"Elegant serif",
|
||||
"Clean slab"
|
||||
"Consistent mono"
|
||||
],
|
||||
"default": "Modern sans-serif"
|
||||
},
|
||||
@ -139,17 +139,18 @@
|
||||
"Search",
|
||||
"Off"
|
||||
],
|
||||
"description": "Highlight & Magazine styles will default to Landing until 7 posts have been published",
|
||||
"description": "Landing is recommended for all sites, Highlight & Magazine are ideal for those with more content",
|
||||
"default": "Landing",
|
||||
"group": "homepage"
|
||||
},
|
||||
"use_publication_cover_as_background": {
|
||||
"type": "boolean",
|
||||
"default": false,
|
||||
"description": "A cover image can be uploaded in Brand settings",
|
||||
"group": "homepage",
|
||||
"visibility": "header_style:[Landing, Search]"
|
||||
},
|
||||
"highlight_featured_posts": {
|
||||
"show_featured_posts": {
|
||||
"type": "boolean",
|
||||
"default": false,
|
||||
"group": "homepage",
|
||||
@ -167,26 +168,22 @@
|
||||
"show_images_in_feed": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "Toggles thumbnails of the post cards when the post feed style is List",
|
||||
"group": "homepage",
|
||||
"visibility": "post_feed_style:List"
|
||||
},
|
||||
"show_author": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "Show the author below each post",
|
||||
"group": "homepage"
|
||||
},
|
||||
"show_publish_date": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "Show the date published below each post",
|
||||
"group": "homepage"
|
||||
},
|
||||
"show_site_in_sidebar": {
|
||||
"show_publication_info_sidebar": {
|
||||
"type": "boolean",
|
||||
"default": false,
|
||||
"description": "Include your site info on the side of the post feed",
|
||||
"group": "homepage"
|
||||
}
|
||||
}
|
||||
|
@ -26,8 +26,8 @@
|
||||
{{/foreach}}
|
||||
</div>
|
||||
<div class="gh-header-right">
|
||||
{{#if @custom.highlight_featured_posts}}
|
||||
{{> "components/featured" showFeatured=@custom.highlight_featured_posts limit=6}}
|
||||
{{#if @custom.show_featured_posts}}
|
||||
{{> "components/featured" showFeatured=@custom.show_featured_posts limit=6}}
|
||||
{{else}}
|
||||
<div class="gh-featured-feed">
|
||||
{{#foreach posts from="5" limit="6"}}
|
||||
|
@ -1,13 +1,9 @@
|
||||
{{#match headerStyle "!=" "Off"}}
|
||||
|
||||
{{#match headerStyle "Highlight"}}
|
||||
{{#match posts.length ">=" 7}}
|
||||
{{> "components/header-content"}}
|
||||
{{/match}}
|
||||
{{else match headerStyle "Magazine"}}
|
||||
{{#match posts.length ">=" 7}}
|
||||
{{> "components/header-content"}}
|
||||
{{/match}}
|
||||
{{else}}
|
||||
{{#match headerStyle "Landing"}}
|
||||
{{#if @site.members_enabled}}
|
||||
|
@ -21,27 +21,23 @@
|
||||
{{!-- Homepage --}}
|
||||
{{#match feed "home"}}
|
||||
{{#match @custom.header_style "Highlight"}}
|
||||
{{#match posts.length ">=" 7}}
|
||||
{{#if @custom.highlight_featured_posts}}
|
||||
{{#if @custom.show_featured_posts}}
|
||||
{{#match posts.length ">=" 4}}
|
||||
{{#get "posts" include="authors" limit="16"}}
|
||||
{{#foreach posts from="5" limit="12"}}
|
||||
{{> "post-card"}}
|
||||
{{/foreach}}
|
||||
{{/get}}
|
||||
{{/match}}
|
||||
{{else}}
|
||||
{{#match posts.length ">=" 10}}
|
||||
{{#get "posts" include="authors" limit="22"}}
|
||||
{{#foreach posts from="11" limit="12"}}
|
||||
{{> "post-card"}}
|
||||
{{/foreach}}
|
||||
{{/get}}
|
||||
{{/if}}
|
||||
{{else}}
|
||||
{{#get "posts" include="authors" limit="12"}}
|
||||
{{#foreach posts}}
|
||||
{{> "post-card"}}
|
||||
{{/foreach}}
|
||||
{{/get}}
|
||||
{{/match}}
|
||||
{{/if}}
|
||||
{{else match @custom.header_style "Magazine"}}
|
||||
{{#match posts.length ">=" 7}}
|
||||
{{#get "posts" include="authors" limit="19"}}
|
||||
@ -49,12 +45,6 @@
|
||||
{{> "post-card"}}
|
||||
{{/foreach}}
|
||||
{{/get}}
|
||||
{{else}}
|
||||
{{#get "posts" include="authors" limit="12"}}
|
||||
{{#foreach posts}}
|
||||
{{> "post-card"}}
|
||||
{{/foreach}}
|
||||
{{/get}}
|
||||
{{/match}}
|
||||
{{else}}
|
||||
{{#get "posts" include="authors" limit="12"}}
|
||||
|
4
tag.hbs
4
tag.hbs
@ -4,7 +4,7 @@
|
||||
<main class="gh-main gh-outer">
|
||||
|
||||
{{#tag}}
|
||||
<section class="gh-archive{{#if feature_image}} has-image{{/if}}{{#if @custom.show_site_in_sidebar}} has-sidebar{{/if}} gh-inner">
|
||||
<section class="gh-archive{{#if feature_image}} has-image{{/if}}{{#if @custom.show_publication_info_sidebar}} has-sidebar{{/if}} gh-inner">
|
||||
<div class="gh-archive-inner">
|
||||
<header class="gh-archive-wrapper">
|
||||
<h1 class="gh-article-title is-title">{{name}}</h1>
|
||||
@ -17,6 +17,6 @@
|
||||
</section>
|
||||
{{/tag}}
|
||||
|
||||
{{> "components/post-list" feed="archive" postFeedStyle=@custom.post_feed_style showTitle=false showSidebar=@custom.show_site_in_sidebar}}
|
||||
{{> "components/post-list" feed="archive" postFeedStyle=@custom.post_feed_style showTitle=false showSidebar=@custom.show_publication_info_sidebar}}
|
||||
|
||||
</main>
|
Loading…
Reference in New Issue
Block a user