Skip to content

Commit

Permalink
Various improvements
Browse files Browse the repository at this point in the history
- new mono font
- copy updates
- simpler logic for header section
  • Loading branch information
minimaluminium committed Sep 18, 2023
1 parent d120bf0 commit 3c79301
Show file tree
Hide file tree
Showing 15 changed files with 66 additions and 75 deletions.
2 changes: 1 addition & 1 deletion assets/built/screen.css

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion assets/built/screen.css.map

Large diffs are not rendered by default.

66 changes: 37 additions & 29 deletions assets/css/screen.css
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand Down Expand Up @@ -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/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/roboto-slab-roman.woff2) format("woff2");
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;
}

Expand Down Expand Up @@ -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;
}

Expand Down Expand Up @@ -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;
}

Expand All @@ -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;
}

Expand Down Expand Up @@ -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;
Expand Down Expand Up @@ -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;
}

Expand Down Expand Up @@ -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 */
Expand Down Expand Up @@ -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 {
Expand Down Expand Up @@ -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) {
Expand Down Expand Up @@ -2466,7 +2475,7 @@ figcaption a {
--factor: 1.15;
}

.has-slab-title {
.has-mono-title {
--factor: 1.1;
}

Expand All @@ -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 {
Expand All @@ -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;
}

Expand All @@ -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;
}
Expand All @@ -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;
}

Expand Down Expand Up @@ -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 {
Expand All @@ -2599,7 +2607,7 @@ figcaption a {
/* ---------------------------------------------------------- */

.gh-footer {
margin-top: 6vw;
margin-top: 12vw;
font-size: 1.5rem;
color: var(--color-darker-gray);
}
Expand Down
Binary file added assets/fonts/jetbrains-mono-italic.woff2
Binary file not shown.
Binary file added assets/fonts/jetbrains-mono-roman.woff2
Binary file not shown.
Binary file removed assets/fonts/roboto-slab-roman.woff2
Binary file not shown.
4 changes: 2 additions & 2 deletions author.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -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">
Expand Down Expand Up @@ -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>
2 changes: 1 addition & 1 deletion default.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -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">

Expand Down
4 changes: 2 additions & 2 deletions home.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -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 changes: 1 addition & 1 deletion index.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -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 changes: 8 additions & 11 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -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"
},
Expand Down Expand Up @@ -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",
Expand All @@ -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"
}
}
Expand Down
4 changes: 2 additions & 2 deletions partials/components/header-content.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -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"}}
Expand Down
8 changes: 2 additions & 6 deletions partials/components/header.hbs
Original file line number Diff line number Diff line change
@@ -1,13 +1,9 @@
{{#match headerStyle "!=" "Off"}}

{{#match headerStyle "Highlight"}}
{{#match posts.length ">=" 7}}
{{> "components/header-content"}}
{{/match}}
{{> "components/header-content"}}
{{else match headerStyle "Magazine"}}
{{#match posts.length ">=" 7}}
{{> "components/header-content"}}
{{/match}}
{{> "components/header-content"}}
{{else}}
{{#match headerStyle "Landing"}}
{{#if @site.members_enabled}}
Expand Down
24 changes: 7 additions & 17 deletions partials/components/post-list.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -21,40 +21,30 @@
{{!-- 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}}
{{else}}
{{/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}}
{{/match}}
{{/if}}
{{else match @custom.header_style "Magazine"}}
{{#match posts.length ">=" 7}}
{{#get "posts" include="authors" limit="19"}}
{{#foreach posts from="8" limit="12"}}
{{> "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"}}
Expand Down
Loading

0 comments on commit 3c79301

Please sign in to comment.