Bug fixes

This commit is contained in:
Sodbileg Gansukh 2023-08-07 19:58:36 +08:00
parent 57fcc2ce3e
commit d64ced927f
7 changed files with 94 additions and 62 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

@ -63,6 +63,7 @@ production stylesheet in assets/built/screen.css
--color-border: rgb(0 0 0 / 0.08);
--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;
--container-width: 1320px;
@ -303,8 +304,7 @@ a:hover {
.gh-navigation-logo {
position: relative;
font-size: 2.6rem;
font-weight: 750;
font-size: calc(2.6rem * var(--factor, 1));
letter-spacing: -0.015em;
white-space: nowrap;
}
@ -778,8 +778,7 @@ Search LOGO Login Subscribe
}
.gh-card-title {
font-size: 2.1rem;
font-weight: 800;
font-size: calc(2.1rem * var(--factor, 1));
letter-spacing: -0.014em;
}
@ -1025,7 +1024,8 @@ Search LOGO Login Subscribe
.gh-header.is-classic {
display: flex;
min-height: calc(100vh - 100px - 240px);
margin-top: 0;
padding-block: 160px;
}
.gh-header.is-classic .gh-header-inner {
@ -1039,8 +1039,7 @@ Search LOGO Login Subscribe
}
.gh-header.is-classic .gh-header-title {
font-size: clamp(3.2rem, 3.18vw + 1.93rem, 6rem);
font-weight: 750;
font-size: calc(clamp(3.2rem, 3.18vw + 1.93rem, 6rem) * var(--factor, 1));
line-height: 1.1;
letter-spacing: -0.022em;
}
@ -1212,10 +1211,6 @@ Search LOGO Login Subscribe
font-weight: 600;
}
.gh-header.is-classic ~ .gh-cta {
display: none;
}
/* 10. Featured posts
/* ---------------------------------------------------------- */
@ -1300,11 +1295,15 @@ Search LOGO Login Subscribe
margin-top: 100px;
}
.gh-header.is-classic:not(.has-image) ~ .gh-container {
margin-top: 0;
}
.gh-more {
display: none;
grid-column: 1 / -1;
margin-top: 48px;
font-size: 2.4rem;
font-size: calc(2.4rem * var(--factor, 1));
font-weight: 750;
letter-spacing: -0.019em;
}
@ -1340,7 +1339,7 @@ Search LOGO Login Subscribe
/* 11.2. Without sidebar */
.gh-container:not(.has-sidebar) .gh-main {
.gh-container:not(.has-sidebar) :is(.gh-container-title, .gh-main, .gh-more) {
grid-column: 3 / span 12;
}
@ -1358,6 +1357,10 @@ Search LOGO Login Subscribe
border-bottom: 1px solid var(--color-border);
}
.gh-container-title:has(+ .gh-main:not(:has(.gh-card))) {
display: none;
}
.gh-container .gh-feed {
gap: var(--grid-gap);
}
@ -1466,8 +1469,7 @@ Search LOGO Login Subscribe
}
.gh-about-title {
font-size: 2.4rem;
font-weight: 800;
font-size: calc(2.4rem * var(--factor, 1));
letter-spacing: -0.019em;
}
@ -1493,7 +1495,7 @@ Search LOGO Login Subscribe
}
.gh-article-header {
margin: 40px 0;
margin: 72px 0 40px;
}
.gh-article-tag {
@ -1506,8 +1508,7 @@ Search LOGO Login Subscribe
}
.gh-article-title {
font-size: clamp(3.2rem, 1.59vw + 2.56rem, 4.6rem);
font-weight: 750;
font-size: calc(clamp(3.2rem, 1.59vw + 2.56rem, 4.6rem) * var(--factor, 1));
line-height: 1.05;
letter-spacing: -0.022em;
}
@ -1813,6 +1814,10 @@ 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);
}
/* Callout */
.kg-callout-card.kg-card {
@ -1848,6 +1853,10 @@ 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-serif-body .kg-header-card h3.kg-header-card-subheader {
font-family: var(--font-serif);
}
@ -1858,6 +1867,10 @@ blockquote.kg-blockquote-alt {
border-radius: 0.25em !important;
}
.kg-bookmark-card .kg-bookmark-container:hover {
opacity: 1;
}
.kg-bookmark-card .kg-bookmark-content {
padding: 1.15em;
}
@ -1891,12 +1904,18 @@ blockquote.kg-blockquote-alt {
margin-top: 12px;
}
.is-font-serif .kg-product-card.kg-card .kg-product-card-title,
.is-font-serif .kg-product-card.kg-card .kg-product-card-description :is(p, ul, ol),
.is-font-serif .kg-product-card.kg-card .kg-product-card-button {
.has-serif-title .kg-product-card.kg-card .kg-product-card-title {
font-family: var(--font-serif);
}
.has-slab-title .kg-product-card.kg-card .kg-product-card-title {
font-family: var(--font-slab);
}
.has-serif-body .kg-product-card-description :is(p, ul, ol) {
font-family: var(--font-serif-alt);
}
/* File */
.kg-file-card.kg-card .kg-file-card-container {
@ -1920,7 +1939,7 @@ blockquote.kg-blockquote-alt {
figcaption {
margin-top: 12px;
font-size: calc(1.4rem * var(--font-multiplier, 1));
font-size: 1.4rem;
text-align: center;
}
@ -2039,16 +2058,27 @@ figcaption a {
/* 20.1. Typography */
.has-serif-title {
--factor: 1.15;
}
.has-slab-title {
--factor: 1.1;
}
.has-sans-title .is-title {
font-family: var(--font-sans);
font-weight: 800;
}
.has-serif-title .is-title {
font-family: var(--font-serif);
font-weight: 600;
}
.has-slab-title .is-title {
font-family: var(--font-slab);
font-weight: 650;
}
.has-sans-body .is-body {
@ -2056,12 +2086,7 @@ figcaption a {
}
.has-serif-body .is-body {
font-family: Georgia;
}
.has-serif-title :is(.gh-navigation-logo, .gh-footer-logo) {
font-size: 2.8rem;
font-weight: 600;
font-family: var(--font-serif-alt);
}
.has-serif-title .gh-header.is-classic .gh-header-title {
@ -2069,30 +2094,24 @@ figcaption a {
letter-spacing: -0.015em;
}
.has-serif-title .gh-header.is-classic .gh-header-form {
border-radius: 0;
}
.has-serif-title .gh-card-title {
font-size: 2.3rem;
font-weight: 600;
line-height: 1.1;
letter-spacing: -0.006em;
}
.has-serif-title .gh-featured-feed .gh-card-title {
font-size: 2.1rem;
}
.has-serif-title .gh-about-title {
font-size: 2.6rem;
font-weight: 600;
letter-spacing: -0.009em;
}
.has-serif-title .gh-footer-signup-header {
font-weight: 550;
letter-spacing: -0.019em;
}
.has-serif-title .gh-article-title {
font-weight: 600;
letter-spacing: -0.019em;
}
@ -2123,12 +2142,12 @@ figcaption a {
letter-spacing: 0;
}
.has-slab-title :is(.gh-button, .gh-header-form) {
border-radius: 8px;
.has-serif-title :is(.gh-button, .gh-header.is-classic .gh-header-form) {
border-radius: 0;
}
.has-serif-title :is(.gh-button, .gh-header-form) {
border-radius: 0;
.has-slab-title :is(.gh-button, .gh-header.is-classic .gh-header-form) {
border-radius: 8px;
}
/* 20.2. Colors */
@ -2141,7 +2160,7 @@ figcaption a {
/* ---------------------------------------------------------- */
.gh-footer {
margin-top: 120px;
margin-top: 160px;
font-size: 1.6rem;
color: var(--color-darker-gray);
}
@ -2188,12 +2207,15 @@ figcaption a {
.gh-footer-logo {
position: relative;
font-size: 2.6rem;
font-weight: 750;
font-size: calc(2.6rem * var(--factor, 1));
letter-spacing: -0.015em;
white-space: nowrap;
}
.gh-footer-logo img {
max-height: 40px;
}
.gh-footer-menu .nav {
display: flex;
gap: 28px;
@ -2220,7 +2242,7 @@ figcaption a {
}
.gh-footer-signup-header {
font-size: clamp(3.2rem, 2.5vw + 2.2rem, 5.4rem);
font-size: calc(clamp(3.2rem, 2.5vw + 2.2rem, 5.4rem) * var(--factor, 1));
font-weight: 750;
letter-spacing: -0.03em;
}

View File

@ -7,6 +7,12 @@
{{> "components/featured" showFeatured=@custom.show_featured limit=4}}
{{/match}}
{{#match @custom.header_style "!=" "Landing"}}
{{#match @custom.header_style "!=" "Search"}}
{{#match @custom.header_style "!=" "Off"}}
{{> "components/cta"}}
{{/match}}
{{/match}}
{{/match}}
{{> "components/post-list" postListStyle=@custom.post_list_style}}

View File

@ -6,6 +6,7 @@
<main class="gh-main">
<article class="gh-article {{post_class}}">
{{#match @page.show_title_and_feature_image}}
<header class="gh-article-header gh-canvas">
<h1 class="gh-article-title is-title">{{title}}</h1>
{{#if custom_excerpt}}
@ -13,6 +14,7 @@
{{/if}}
{{> "feature-image"}}
</header>
{{/match}}
<section class="gh-content gh-canvas is-body">
{{content}}

View File

@ -1,5 +1,5 @@
{{#match headerStyle "!=" "Off"}}
<section class="gh-header is-{{#match headerStyle "Magazine"}}magazine{{else match headerStyle "Highlight"}}highlight{{else}}classic{{/match}}{{#if @custom.use_publication_cover_as_background}} has-image{{/if}} gh-outer">
<section class="gh-header is-{{#match headerStyle "Magazine"}}magazine{{else match headerStyle "Highlight"}}highlight{{else}}classic{{/match}}{{#if @custom.use_publication_cover_as_background}}{{#if @site.cover_image}} has-image{{/if}}{{/if}} gh-outer">
{{!-- Background image --}}
{{#if @custom.use_publication_cover_as_background}}
@ -55,7 +55,7 @@
{{!-- Landing layout --}}
{{#match headerStyle "Landing"}}
<h1 class="gh-header-title is-title">Founded by Australian journalist Claire Lehmann, Quillette publishes high quality long reads on diverse topics, daily.</h1>
<h1 class="gh-header-title is-title">{{@site.description}}</h1>
<form class="gh-header-form">
<input class="gh-header-input" type="email" placeholder="jamie@example.com">
<button class="gh-button" type="submit">Subscribe</button>
@ -64,7 +64,7 @@
{{!-- Search layout --}}
{{#match headerStyle "Search"}}
<h1 class="gh-header-title is-title">Founded by Australian journalist Claire Lehmann, Quillette publishes high quality long reads on diverse topics, daily.</h1>
<h1 class="gh-header-title is-title">{{@site.description}}</h1>
<form class="gh-header-form">
{{> "icons/search"}}
<button class="gh-header-input" data-ghost-search>Search posts, tags and authors</button>

View File

@ -40,9 +40,11 @@
</aside>
{{/if}}
{{#match pagination.pages ">" 1}}
<div class="gh-more is-title">
<a href="/page/2">See all →</a>
</div>
{{/match}}
</div>
</section>