davejansen/Ghost-Theme-Source
1
0
Fork 0
Code Issues Pull Requests Activity

Various improvements

Browse Source 
- new mono font
- copy updates
- simpler logic for header section
This commit is contained in:
Sodbileg Gansukh
2023-09-18 17:50:05 +08:00
parent d120bf0006
commit 3c79301108
15 changed files with 66 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
assets/css/screen.css
View File

@@ -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);
}