Various fixes and improvements

This commit is contained in:
Sodbileg Gansukh committed 2023-08-14 09:10:22 +08:00
1 parent ef5a043e45
commit 52992bd678
17 files changed
+342 -242

No files matched your search

+1 -1
View File
@@ -1,2 +1,2 @@
:root{--color-white:#fff;--color-lighter-gray:rgba(0,0,0,.05);--color-light-gray:#e6e6e6;--color-mid-gray:#ccc;--color-dark-gray:#444;--color-darker-gray:#15171a;--color-black:#000;--color-primary-text:var(--color-darker-gray);--color-secondary-text:rgba(0,0,0,.4);--color-border:rgba(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;--container-gap:clamp(24px,1.7032rem + 1.9355vw,48px);--grid-gap:48px}:is(.gh-navigation,.gh-footer).has-accent-color,:root.has-light-text{--color-lighter-gray:rgba(0,0,0,.15);--color-darker-gray:#fff;--color-secondary-text:hsla(0,0%,100%,.64);--color-border:hsla(0,0%,100%,.15)}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:100 900;src:url(/assets/fonts/inter-roman.woff2) format("woff2");unicode-range:u+00??,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-display:swap;font-family:EB Garamond;font-style:normal;font-weight:400 800;src:url(/assets/fonts/eb-garamond-roman.woff2) format("woff2");unicode-range:u+00??,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-display:swap;font-family:EB Garamond;font-style:italic;font-weight:400 800;src:url(/assets/fonts/eb-garamond-italic.woff2) format("woff2");unicode-range:u+00??,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-display:swap;font-family:Roboto Slab;font-style:normal;font-weight:100 900;src:url(/assets/fonts/roboto-slab-roman.woff2) format("woff2");unicode-range:u+00??,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}*,:after,:before{box-sizing:border-box}*{margin:0}html{font-size:62.5%}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6}canvas,img,picture,svg,video{display:block;height:auto;max-width:100%}iframe{display:block}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}h1,h2,h3,h4,h5,h6{line-height:1.2}body{background-color:var(--background-color);color:var(--color-primary-text);font-family:var(--font-sans);font-size:1.6rem}a{color:var(--color-darker-gray);text-decoration:none}a:hover{opacity:.8}.gh-button{align-items:center;background-color:var(--ghost-accent-color);border:0;border-radius:100px;color:var(--color-white);cursor:pointer;display:inline-flex;font-size:1.6rem;font-weight:600;gap:.4em;justify-content:center;letter-spacing:-.004em;line-height:1;padding:.8em 1.4em}.gh-button:hover{opacity:.95}.gh-icon-button{align-items:center;background-color:transparent;border:0;color:var(--color-darker-gray);cursor:pointer;display:inline-flex;height:32px;justify-content:center;outline:none;padding:0;width:32px}.gh-icon-button:hover :is(svg,span){opacity:.8}.gh-icon-button svg{height:20px;width:20px}.gh-viewport{display:flex;flex-direction:column;min-height:100vh;position:relative}.gh-outer{padding:0 max(4vmin,20px)}.gh-inner{margin:0 auto;max-width:var(--container-width);width:100%}.gh-main{flex-grow:1}.gh-canvas,.kg-width-full.kg-content-wide{--main:min(var(--content-width,720px),100% - var(--container-gap) * 2);--wide:minmax(0,calc((var(--container-width, 1200px) - var(--content-width, 720px))/2));--full:minmax(var(--container-gap),1fr);display:grid;grid-template-columns:[full-start] var(--full) [wide-start] var(--wide) [main-start] var(--main) [main-end] var(--wide) [wide-end] var(--full) [full-end]}.gh-canvas>*{grid-column:main}.kg-content-wide>div,.kg-width-wide{grid-column:wide}.kg-width-full{grid-column:full}.gh-navigation{color:var(--color-darker-gray);font-size:1.6rem;font-weight:550;height:100px}.gh-navigation :is(.gh-navigation-logo,a:not(.gh-button),.gh-icon-button){color:inherit}.gh-navigation-inner{align-items:center;-moz-column-gap:24px;column-gap:24px;display:grid;grid-auto-flow:row dense;height:100%}.gh-navigation-brand{line-height:1}.gh-navigation-logo{font-size:calc(2.6rem*var(--factor, 1));letter-spacing:-.015em;position:relative;white-space:nowrap}.gh-navigation-logo img{max-height:40px}.gh-navigation-menu{align-items:center;display:flex;gap:24px}.gh-navigation .nav{align-items:center;display:inline-flex;gap:28px;list-style:none;margin:0;padding:0;white-space:nowrap}.gh-navigation .gh-more-toggle{font-size:inherit;margin:0 -6px;position:relative;text-transform:inherit}.gh-navigation .gh-more-toggle svg{height:24px;width:24px}.gh-navigation-actions{align-items:centeLine truncated
:root{--color-white:#fff;--color-lighter-gray:rgba(0,0,0,.05);--color-light-gray:#e6e6e6;--color-mid-gray:#ccc;--color-dark-gray:#444;--color-darker-gray:#15171a;--color-black:#000;--color-primary-text:var(--color-darker-gray);--color-secondary-text:rgba(0,0,0,.4);--color-border:rgba(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;--container-gap:clamp(24px,1.7032rem + 1.9355vw,48px);--grid-gap:48px}:is(.gh-navigation,.gh-footer).has-accent-color,:root.has-light-text{--color-lighter-gray:rgba(0,0,0,.15);--color-darker-gray:#fff;--color-secondary-text:hsla(0,0%,100%,.64);--color-border:hsla(0,0%,100%,.15)}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:100 900;src:url(/assets/fonts/inter-roman.woff2) format("woff2");unicode-range:u+00??,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-display:swap;font-family:EB Garamond;font-style:normal;font-weight:400 800;src:url(/assets/fonts/eb-garamond-roman.woff2) format("woff2");unicode-range:u+00??,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-display:swap;font-family:EB Garamond;font-style:italic;font-weight:400 800;src:url(/assets/fonts/eb-garamond-italic.woff2) format("woff2");unicode-range:u+00??,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-display:swap;font-family:Roboto Slab;font-style:normal;font-weight:100 900;src:url(/assets/fonts/roboto-slab-roman.woff2) format("woff2");unicode-range:u+00??,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}*,:after,:before{box-sizing:border-box}*{margin:0}html{font-size:62.5%}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6}canvas,img,picture,svg,video{display:block;height:auto;max-width:100%}iframe{display:block}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}h1,h2,h3,h4,h5,h6{line-height:1.2}body{background-color:var(--background-color);color:var(--color-primary-text);font-family:var(--font-sans);font-size:1.6rem}a{color:var(--color-darker-gray);text-decoration:none}a:hover{opacity:.8}.gh-button{align-items:center;background-color:var(--ghost-accent-color);border:0;border-radius:100px;color:var(--color-white);cursor:pointer;display:inline-flex;font-size:1.6rem;font-weight:600;gap:.4em;justify-content:center;letter-spacing:-.004em;line-height:1;padding:.8em 1.4em}.gh-button:hover{opacity:.95}.gh-icon-button{align-items:center;background-color:transparent;border:0;color:var(--color-darker-gray);cursor:pointer;display:inline-flex;height:32px;justify-content:center;outline:none;padding:0;width:32px}.gh-icon-button:hover :is(svg,span){opacity:.8}.gh-icon-button svg{height:20px;width:20px}.gh-form{align-items:center;background-color:var(--color-lighter-gray);border-radius:40px;display:flex;font-size:1.8rem;font-weight:450;height:64px;letter-spacing:-.008em;max-width:640px;overflow:hidden;position:relative;transition:background-color .2s ease;width:100%}.gh-form:hover{background-color:rgba(0,0,0,.05)}.gh-form-input{background-color:transparent;border:0;font-size:inherit;height:100%;inset:0;letter-spacing:inherit;padding-inline:28px;position:absolute;width:100%}button.gh-form-input{-webkit-padding-start:56px;color:var(--color-secondary-text);cursor:pointer;padding-inline-start:56px;text-align:left}.gh-form .gh-button{font-size:inherit;font-weight:600;height:52px;padding-inline:32px;position:absolute;right:6px}.gh-form svg{color:var(--color-secondary-text);height:24px;left:22px;position:relative;width:24px}.gh-viewport{display:flex;flex-direction:column;min-height:100vh;position:relative}.gh-outer{padding:0 max(4vmin,20px)}.gh-inner{margin:0 auto;max-width:var(--container-width);width:100%}.gh-main{flex-grow:1}.gh-canvas,.kg-width-full.kg-content-wide{--main:min(var(--content-width,720px),100% - var(--container-gap) * 2);--wide:minmax(0,calc((var(--container-width, 1200px) - var(--content-width, 720px))/2));--full:minmax(var(--container-gap),1fr);display:grid;grid-template-columns:[full-start] var(--full) [wide-start] var(--wide) [main-start] var(--main) [main-end] var(--wide) [wide-end] var(--full) [full-end]}.gh-canvas>*{grid-column:main}.kg-content-wide>div,.kg-width-wide{grid-column:wide}.kg-width-full{grid-column:full}.gh-navigation{color:var(--color-darker-gray);font-size:Line truncated
/*# sourceMappingURL=screen.css.map */
+1 -1
View File
@@ -1 +1 @@
{"version":3,"sources":["screen.css"],"names":[],"mappings":"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 truncated
{"version":3,"sources":["screen.css"],"names":[],"mappings":"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 truncated
+258 -163
View File
@@ -41,9 +41,8 @@ production stylesheet in assets/built/screen.css
20. Design settings
21. Footer
21.1. Footer styles
21.2. With recent posts
21.3. Footer bar
21.4. Footer signup
21.2. Footer bar
21.3. Footer signup
*/
@@ -224,6 +223,62 @@ a:hover {
height: 20px;
}
.gh-form {
display: flex;
align-items: center;
position: relative;
overflow: hidden;
max-width: 640px;
width: 100%;
height: 64px;
font-size: 1.8rem;
font-weight: 450;
letter-spacing: -0.008em;
border-radius: 40px;
background-color: var(--color-lighter-gray);
transition: background-color 0.2s ease;
}
.gh-form:hover {
background-color: rgb(0 0 0 / 0.05);
}
.gh-form-input {
position: absolute;
inset: 0;
padding-inline: 28px;
width: 100%;
height: 100%;
font-size: inherit;
letter-spacing: inherit;
border: 0;
background-color: transparent;
}
button.gh-form-input {
padding-inline-start: 56px;
text-align: left;
color: var(--color-secondary-text);
cursor: pointer;
}
.gh-form .gh-button {
position: absolute;
right: 6px;
padding-inline: 32px;
height: 52px;
font-size: inherit;
font-weight: 600;
}
.gh-form svg {
position: relative;
left: 22px;
width: 24px;
height: 24px;
color: var(--color-secondary-text);
}
/* 5. Layout
/* ---------------------------------------------------------- */
@@ -305,6 +360,7 @@ a:hover {
.gh-navigation-logo {
position: relative;
font-size: calc(2.6rem * var(--factor, 1));
font-weight: 725;
letter-spacing: -0.015em;
white-space: nowrap;
}
@@ -463,6 +519,7 @@ Search LOGO Login Subscribe
.gh-navigation.is-stacked .gh-navigation-brand {
display: flex;
align-items: center;
grid-row-start: 1;
grid-column-start: 2;
min-height: 80px;
@@ -483,7 +540,7 @@ Search LOGO Login Subscribe
grid-row-start: 2;
grid-column: 1 / 4;
justify-content: center;
height: 56px;
height: 60px;
margin: 0 48px;
}
@@ -499,7 +556,7 @@ Search LOGO Login Subscribe
}
.gh-navigation.is-stacked .gh-navigation-menu::after {
top: 136px;
top: 140px;
}
.gh-navigation.is-stacked .gh-navigation-actions {
@@ -778,7 +835,8 @@ Search LOGO Login Subscribe
}
.gh-card-title {
font-size: calc(2.1rem * var(--factor, 1));
font-size: calc(1.9rem * var(--factor, 1));
font-weight: 725;
letter-spacing: -0.014em;
}
@@ -789,7 +847,7 @@ Search LOGO Login Subscribe
.gh-card-excerpt {
display: -webkit-box;
overflow-y: hidden;
margin-top: 10px;
margin-top: 8px;
max-width: 720px;
font-size: 1.5rem;
line-height: 1.4;
@@ -879,7 +937,7 @@ Search LOGO Login Subscribe
}
.gh-header.is-magazine .gh-header-inner > .gh-card .gh-card-excerpt {
margin-top: 20px;
margin-top: 16px;
font-size: 1.8rem;
}
@@ -921,6 +979,56 @@ Search LOGO Login Subscribe
background-color: var(--color-border);
}
@media (max-width: 1199px) {
.gh-header.is-magazine .gh-header-inner {
grid-template-columns: repeat(12, 1fr);
}
.gh-header.is-magazine .gh-header-inner > .gh-card {
grid-column: 1 / span 8;
}
.gh-header.is-magazine .gh-header-left {
grid-column: 9 / -1;
}
.gh-header.is-magazine .gh-header-inner > div.gh-header-right {
grid-column: 1 / -1;
grid-row: 2;
flex-direction: row;
}
.gh-header.is-magazine .gh-header-right .gh-card {
flex: 1;
}
.gh-header.is-magazine .gh-header-right .gh-card:last-child .gh-card-image {
display: block;
}
}
@media (max-width: 991px) {
.gh-header.is-magazine .gh-header-left .gh-card:nth-child(2) .gh-card-image {
display: none;
}
}
@media (max-width: 767px) {
.gh-header.is-magazine .gh-header-inner {
display: flex;
flex-direction: column;
gap: var(--grid-gap);
}
.gh-header.is-magazine .gh-header-inner > div.gh-header-right {
flex-direction: column;
}
.gh-header.is-magazine .gh-card-image {
display: block !important;
}
}
/* 8.2. Highlight layout */
.gh-header.is-highlight .gh-header-inner {
@@ -954,12 +1062,13 @@ Search LOGO Login Subscribe
.gh-header.is-highlight .gh-header-left .gh-card .gh-card-title {
font-size: clamp(2.4rem, 2.73vw + 1.31rem, 4.8rem);
font-weight: 750;
line-height: 1;
letter-spacing: -0.022em;
}
.gh-header.is-highlight .gh-header-left .gh-card .gh-card-excerpt {
margin-top: 20px;
margin-top: 16px;
font-size: 1.8rem;
}
@@ -1018,6 +1127,10 @@ Search LOGO Login Subscribe
background-color: var(--color-border);
}
.gh-header.is-highlight .gh-featured .gh-card:first-child::before {
display: none;
}
@media (max-width: 1024px) {
.gh-header.is-highlight .gh-header-inner {
grid-template-columns: repeat(9, 1fr);
@@ -1107,63 +1220,7 @@ Search LOGO Login Subscribe
.gh-header.is-classic .gh-header-title {
font-size: calc(clamp(3.2rem, 3.18vw + 1.93rem, 6rem) * var(--factor, 1));
line-height: 1.1;
letter-spacing: -0.022em;
}
.gh-header.is-classic .gh-header-form {
display: flex;
align-items: center;
position: relative;
overflow: hidden;
max-width: 640px;
width: 100%;
height: 64px;
font-size: 1.8rem;
font-weight: 450;
letter-spacing: -0.008em;
border-radius: 40px;
background-color: var(--color-lighter-gray);
transition: background-color 0.2s ease;
}
.gh-header.is-classic .gh-header-form:hover {
background-color: rgb(0 0 0 / 0.05);
}
.gh-header.is-classic .gh-header-input {
position: absolute;
inset: 0;
padding-inline: 28px;
width: 100%;
height: 100%;
font-size: inherit;
letter-spacing: inherit;
border: 0;
background-color: transparent;
}
.gh-header.is-classic button.gh-header-input {
padding-inline-start: 56px;
text-align: left;
color: var(--color-secondary-text);
cursor: pointer;
}
.gh-header.is-classic .gh-button {
position: absolute;
right: 6px;
padding-inline: 40px;
height: 52px;
font-size: inherit;
font-weight: 600;
}
.gh-header.is-classic svg {
position: relative;
left: 22px;
width: 24px;
height: 24px;
color: var(--color-secondary-text);
letter-spacing: -0.028em;
}
.gh-header.is-classic.has-image {
@@ -1192,7 +1249,7 @@ Search LOGO Login Subscribe
object-fit: cover;
}
.gh-header.is-classic.has-image .gh-header-form {
.gh-header.is-classic.has-image .gh-form {
background-color: #fff;
}
@@ -1200,84 +1257,50 @@ Search LOGO Login Subscribe
/* ---------------------------------------------------------- */
.gh-cta {
margin-top: calc(var(--grid-gap) / 2);
margin-top: 120px;
}
.gh-cta-inner {
position: relative;
overflow: hidden;
display: flex;
flex-direction: column;
align-items: center;
gap: 24px;
padding-top: 100px;
gap: 28px;
padding: 80px 64px;
background-color: var(--color-lighter-gray);
}
.gh-header + .gh-cta .gh-cta-inner {
/* .gh-header + .gh-cta .gh-cta-inner {
border-top: 1px solid var(--color-border);
} */
.gh-cta-inner::before {
position: absolute;
top: -240px;
right: -200px;
content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='800' fill='rgba(0,0,0,0.02)' viewBox='0 0 256 256'%3E%3Cpath d='M224,50H32a6,6,0,0,0-6,6V192a14,14,0,0,0,14,14H216a14,14,0,0,0,14-14V56A6,6,0,0,0,224,50Zm-96,85.86L47.42,62H208.58ZM101.67,128,38,186.36V69.64Zm8.88,8.14L124,148.42a6,6,0,0,0,8.1,0l13.4-12.28L208.58,194H47.43ZM154.33,128,218,69.64V186.36Z'%3E%3C/path%3E%3C/svg%3E");
transform: rotate(-24deg);
}
.gh-cta-content {
max-width: 560px;
}
.gh-cta-title {
max-width: 720px;
font-size: 4.4rem;
font-weight: 800;
font-size: 3.6rem;
font-weight: 750;
line-height: 1.1;
letter-spacing: -0.026em;
letter-spacing: -0.021em;
}
.gh-cta-description {
margin-top: 8px;
font-size: 2rem;
font-weight: 450;
line-height: 1.4;
letter-spacing: -.017em;
color: var(--color-secondary-text);
}
.gh-cta .gh-header-form {
display: flex;
align-items: center;
position: relative;
overflow: hidden;
max-width: 520px;
width: 100%;
height: 64px;
margin-top: 10px;
font-size: 1.8rem;
font-weight: 450;
letter-spacing: -0.008em;
border-radius: 40px;
background-color: var(--color-lighter-gray);
transition: background-color 0.2s ease;
line-height: 1.4;
}
.gh-cta .gh-header-form:hover {
background-color: rgb(0 0 0 / 0.05);
}
.gh-cta .gh-header-input {
position: absolute;
inset: 0;
padding-inline: 26px;
width: 100%;
height: 100%;
font-size: inherit;
letter-spacing: inherit;
border: 0;
background-color: transparent;
}
.gh-cta button.gh-header-input {
padding-inline-start: 56px;
text-align: left;
color: var(--color-secondary-text);
cursor: pointer;
}
.gh-cta .gh-button {
position: absolute;
right: 6px;
padding-inline: 32px;
height: 52px;
font-size: inherit;
font-weight: 600;
.gh-cta .gh-form {
max-width: 560px;
}
/* 10. Featured posts
@@ -1291,6 +1314,14 @@ Search LOGO Login Subscribe
margin-top: 64px;
}
.gh-header.is-classic:not(.has-image) + .gh-featured {
margin-top: 0;
}
.gh-featured-inner {
overflow: hidden;
}
.gh-featured-title {
margin-bottom: 20px;
padding-bottom: 12px;
@@ -1329,12 +1360,29 @@ Search LOGO Login Subscribe
}
}
@container featured-card (240px <= width <= 270px) {
.gh-featured-feed .gh-card-image {
width: 64px;
}
}
.gh-featured-feed .gh-card-wrapper {
container-type: inline-size;
container-name: featured-card-wrapper;
}
.gh-featured-feed .gh-card-title {
font-size: 1.7rem;
font-weight: 725;
font-size: 1.6rem;
font-weight: 650;
letter-spacing: -0.011em;
}
@container featured-card-wrapper (width < 170px) {
.gh-featured-feed .gh-card-title {
font-size: 1.6rem;
}
}
.gh-featured-feed .gh-card-excerpt {
display: none;
}
@@ -1365,13 +1413,14 @@ Search LOGO Login Subscribe
display: grid;
grid-template-columns: repeat(16, 1fr);
column-gap: var(--grid-gap);
overflow: hidden;
}
:is(.gh-featured, .gh-cta) + .gh-container {
margin-top: 100px;
}
.gh-header.is-classic:not(.has-image) ~ .gh-container {
.gh-header.is-classic:not(.has-image) + .gh-container {
margin-top: 0;
}
@@ -1380,7 +1429,7 @@ Search LOGO Login Subscribe
grid-column: 1 / -1;
margin-top: 48px;
font-size: calc(2.4rem * var(--factor, 1));
font-weight: 750;
font-weight: 725;
letter-spacing: -0.019em;
}
@@ -1419,6 +1468,24 @@ Search LOGO Login Subscribe
grid-column: 3 / span 12;
}
.gh-container:not(.has-sidebar) .gh-container-title {
display: none;
}
@media (max-width: 1199px) {
.gh-container-inner {
grid-template-columns: repeat(12, 1fr);
}
.gh-container.has-sidebar .gh-main {
grid-column: 1 / -1;
}
.gh-container.has-sidebar .gh-sidebar {
display: none;
}
}
/* 12. Post list
/* ---------------------------------------------------------- */
@@ -1450,6 +1517,8 @@ Search LOGO Login Subscribe
.gh-container.is-list .gh-feed {
display: flex;
flex-direction: column;
container-type: inline-size;
container-name: list-feed;
}
.gh-container.is-list .gh-card-link {
@@ -1458,16 +1527,34 @@ Search LOGO Login Subscribe
gap: 24px;
}
.gh-container.is-list .no-image .gh-card-link {
padding-block: 20px;
}
.gh-container.is-list .gh-card-image {
flex-shrink: 0;
width: 220px;
aspect-ratio: 1.618033;
}
@container list-feed (width < 600px) {
.gh-container.is-list .gh-card-image {
width: 160px;
}
}
.gh-container.is-list .gh-card-wrapper {
max-width: 600px;
}
.gh-container.is-list .gh-card-title {
--factor: 1.05;
}
.gh-container.is-list .no-image .gh-card-title {
--factor: 1.2;
}
.gh-container.is-list .gh-card-excerpt {
margin-top: 6px;
}
@@ -1495,10 +1582,6 @@ Search LOGO Login Subscribe
overflow: hidden;
}
.gh-container.is-grid .gh-card-excerpt {
-webkit-line-clamp: 4;
}
.gh-container.is-grid .gh-card::before {
position: absolute;
top: calc(var(--grid-gap) / -2);
@@ -1531,8 +1614,10 @@ Search LOGO Login Subscribe
.gh-about {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 48px 24px;
min-height: 400px;
text-align: center;
background-color: var(--color-lighter-gray);
}
@@ -1546,6 +1631,7 @@ Search LOGO Login Subscribe
.gh-about-title {
font-size: calc(2.4rem * var(--factor, 1));
font-weight: 750;
letter-spacing: -0.019em;
}
@@ -1556,7 +1642,7 @@ Search LOGO Login Subscribe
}
.gh-about .gh-button {
margin-top: 24px;
margin-top: 32px;
}
/* 14. Post/page
@@ -2039,17 +2125,15 @@ figcaption a {
/* ---------------------------------------------------------- */
.post-template .gh-container {
padding-block: 64px 80px;
background-color: var(--color-lighter-gray);
margin-top: 120px;
}
.post-template .gh-container-inner {
display: block;
max-width: 950px;
}
.post-template .gh-container.is-list .gh-card:first-child:before {
display: none;
.post-template .gh-container.is-grid .gh-feed {
grid-template-columns: repeat(4, 1fr);
}
/* 19. Archive
@@ -2144,7 +2228,6 @@ figcaption a {
.has-sans-title .is-title {
font-family: var(--font-sans);
font-weight: 800;
}
.has-serif-title .is-title {
@@ -2170,7 +2253,7 @@ figcaption a {
letter-spacing: -0.015em;
}
.has-serif-title .gh-header.is-classic .gh-header-form {
.has-serif-title .gh-form {
border-radius: 0;
}
@@ -2218,17 +2301,17 @@ figcaption a {
letter-spacing: 0;
}
.has-serif-title :is(.gh-button, :is(.gh-header.is-classic, .gh-cta) .gh-header-form) {
.has-serif-title :is(.gh-button, .gh-form) {
border-radius: 0;
}
.has-slab-title :is(.gh-button, :is(.gh-header.is-classic, .gh-cta) .gh-header-form) {
.has-slab-title :is(.gh-button, .gh-form) {
border-radius: 8px;
}
/* 20.2. Colors */
.has-light-text .gh-header.is-classic .gh-header-form:hover {
.has-light-text .gh-form:hover {
background-color: rgb(0 0 0 / 0.2);
}
@@ -2236,7 +2319,7 @@ figcaption a {
/* ---------------------------------------------------------- */
.gh-footer {
margin-top: 160px;
margin-top: 120px;
font-size: 1.6rem;
color: var(--color-darker-gray);
}
@@ -2260,22 +2343,14 @@ figcaption a {
color: #15171a;
}
/* 21.2. With recent posts */
.post-template .gh-container + .gh-footer {
margin-top: 0;
}
.post-template .gh-container + .gh-footer:not(.has-accent-color) {
background-color: var(--color-lighter-gray);
}
/* 21.3. Footer bar */
/* 21.2. Footer bar */
.gh-footer-bar {
display: grid;
grid-template-columns: 1fr auto 1fr;
align-items: center;
column-gap: 32px;
margin-bottom: 100px;
padding-block: 28px;
font-weight: 550;
border-block: 1px solid var(--color-border);
@@ -2284,6 +2359,7 @@ figcaption a {
.gh-footer-logo {
position: relative;
font-size: calc(2.6rem * var(--factor, 1));
font-weight: 725;
letter-spacing: -0.015em;
white-space: nowrap;
}
@@ -2294,7 +2370,9 @@ figcaption a {
.gh-footer-menu .nav {
display: flex;
gap: 28px;
justify-content: center;
gap: 8px 28px;
flex-wrap: wrap;
margin: 0;
padding: 0;
list-style-type: none;
@@ -2302,19 +2380,21 @@ figcaption a {
.gh-footer-copyright {
text-align: right;
white-space: nowrap;
}
.gh-footer-copyright a {
text-decoration: underline;
}
/* 21.4. Footer signup */
/* 21.3. Footer signup */
.gh-footer-signup {
display: flex;
flex-direction: column;
align-items: center;
padding-block: 80px 120px;
padding-bottom: 120px;
text-align: center;
}
.gh-footer-signup-header {
@@ -2325,15 +2405,30 @@ figcaption a {
.gh-footer-signup-subhead {
margin-top: 8px;
max-width: 720px;
font-size: clamp(1.6rem, 0.68vw + 1.33rem, 2.2rem);
font-weight: 450;
line-height: 1.5;
letter-spacing: -0.018em;
opacity: 0.6;
}
.gh-footer-signup .gh-button {
margin-top: 28px;
.gh-footer-signup .gh-form {
margin-top: 40px;
max-width: 560px;
}
/* .gh-footer-signup .gh-button {
margin-top: 32px;
padding: 16px 32px;
font-size: 1.9rem;
letter-spacing: -0.01em;
} */
@media (max-width: 991px) {
.gh-footer-bar {
display: flex;
flex-direction: column;
gap: 20px;
}
}
+1 -1
View File
@@ -36,7 +36,7 @@
</section>
{{/author}}
<section class="gh-container is-{{#match @custom.post_list_style "List"}}list{{else}}grid{{/match}}{{#if @custom.show_sidebar}} has-sidebar{{/if}}{{#if @custom.hide_images}} no-image{{/if}}">
<section class="gh-container is-{{#match @custom.post_feed_style "List"}}list{{else}}grid{{/match}}{{#if @custom.show_sidebar}} has-sidebar{{/if}}{{#unless @custom.show_images_in_feed}} no-image{{/unless}}">
<div class="gh-container-inner gh-inner">
<main class="gh-main">
+1 -1
View File
@@ -17,7 +17,7 @@
{{!-- Custom background color --}}
<style>
:root {
--background-color: {{@custom.page_background_color}}
--background-color: {{@custom.site_background_color}}
}
</style>
+5 -9
View File
@@ -4,15 +4,11 @@
{{> "components/header" headerStyle=@custom.header_style}}
{{#match @custom.header_style "!=" "Highlight"}}
{{> "components/featured" showFeatured=@custom.show_featured limit=4}}
{{> "components/featured" showFeatured=@custom.highlight_featured_posts 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}}
{{> "components/cta"}}
{{> "components/post-list" postListStyle=@custom.post_feed_style}}
+1 -1
View File
@@ -3,7 +3,7 @@
<main class="gh-main gh-outer">
<section class="gh-container is-{{#match @custom.post_list_style "List"}}list{{else}}grid{{/match}}{{#if @custom.show_sidebar}} has-sidebar{{/if}}{{#if @custom.hide_images}} no-image{{/if}}">
<section class="gh-container is-{{#match @custom.post_feed_style "List"}}list{{else}}grid{{/match}}{{#if @custom.show_sidebar}} has-sidebar{{/if}}{{#unless @custom.show_images_in_feed}} no-image{{/unless}}">
<div class="gh-container-inner gh-inner">
<h2 class="gh-container-title">Latest</h2>
+11 -19
View File
@@ -87,21 +87,21 @@
"navigation_layout": {
"type": "select",
"options": [
"Logo on the left",
"Logo in the middle",
"Logo on the left",
"Stacked"
],
"default": "Logo in the middle"
},
"page_background_color": {
"site_background_color": {
"type": "color",
"default": "#ffffff"
},
"header_and_footer_color": {
"type": "select",
"options": [
"Background color",
"Accent color"
"Accent color",
"Background color"
],
"default": "Accent color"
},
@@ -122,20 +122,12 @@
],
"default": "Modern sans-serif"
},
"footer_signup_header": {
"type": "text",
"default": ""
},
"footer_signup_subhead": {
"type": "text",
"default": "New content delivered to your inbox."
},
"header_style": {
"type": "select",
"options": [
"Landing",
"Highlight",
"Magazine",
"Landing",
"Search",
"Off"
],
@@ -147,23 +139,23 @@
"default": false,
"group": "homepage"
},
"show_featured": {
"highlight_featured_posts": {
"type": "boolean",
"default": true,
"group": "homepage"
},
"post_list_style": {
"post_feed_style": {
"type": "select",
"options": [
"Grid",
"List"
"List",
"Grid"
],
"default": "List",
"group": "homepage"
},
"hide_images": {
"show_images_in_feed": {
"type": "boolean",
"default": false,
"default": true,
"group": "homepage"
},
"show_author": {
+21 -17
View File
@@ -1,17 +1,21 @@
<section class="gh-cta gh-outer">
<div class="gh-cta-inner gh-inner">
<div class="gh-cta-content">
<h2 class="gh-cta-title is-title">
{{#if @custom.footer_signup_header}}
{{@custom.footer_signup_header}}
{{else}}
Subscribe to {{@site.title}}
{{/if}}
</h2>
</div>
<form class="gh-header-form">
<input class="gh-header-input" type="email" placeholder="jamie@example.com">
<button class="gh-button" type="submit">Subscribe</button>
</form>
</div>
</section>
{{#if @site.members_enabled}}
{{#unless @member}}
{{#match @custom.header_style "!=" "Landing"}}
{{#match @custom.header_style "!=" "Search"}}
{{#match @custom.header_style "!=" "Off"}}
<section class="gh-cta gh-outer">
<div class="gh-cta-inner gh-inner">
<div class="gh-cta-content">
<h2 class="gh-cta-title is-title">{{@site.title}}</h2>
{{#if @site.description}}
<p class="gh-cta-description is-body">{{@site.description}}</p>
{{/if}}
</div>
{{> "email-subscription"}}
</div>
</section>
{{/match}}
{{/match}}
{{/match}}
{{/unless}}
{{/if}}
+12 -14
View File
@@ -16,20 +16,18 @@
Powered by <a href="https://ghost.org/" target="_blank" rel="noopener">Ghost</a>
</div>
</div>
<section class="gh-footer-signup">
<h2 class="gh-footer-signup-header is-title">
{{#if @custom.footer_signup_header}}
{{@custom.footer_signup_header}}
{{else}}
Subscribe to {{@site.title}}
{{/if}}
</h2>
{{#if @custom.footer_signup_subhead}}
<p class="gh-footer-signup-subhead is-body">{{@custom.footer_signup_subhead}}</p>
{{/if}}
<button class="gh-button">Subscribe</button>
</section>
{{#if @site.members_enabled}}
{{#unless @member}}
<section class="gh-footer-signup">
<h2 class="gh-footer-signup-header is-title">{{@site.title}}</h2>
{{#if @site.description}}
<p class="gh-footer-signup-subhead is-body">{{@site.description}}</p>
{{/if}}
{{> "email-subscription"}}
</section>
{{/unless}}
{{/if}}
</div>
</footer>
+5 -8
View File
@@ -26,8 +26,8 @@
{{/foreach}}
</div>
<div class="gh-header-right">
{{#if @custom.show_featured}}
{{> "components/featured" showFeatured=@custom.show_featured limit=6}}
{{#if @custom.highlight_featured_posts}}
{{> "components/featured" showFeatured=@custom.highlight_featured_posts limit=6}}
{{else}}
<div class="gh-featured-feed">
{{#foreach posts from="5" limit="6"}}
@@ -60,18 +60,15 @@
{{!-- Landing layout --}}
{{#match headerStyle "Landing"}}
<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>
</form>
{{> "email-subscription"}}
{{/match}}
{{!-- Search layout --}}
{{#match headerStyle "Search"}}
<h1 class="gh-header-title is-title">{{@site.description}}</h1>
<form class="gh-header-form">
<form class="gh-form">
{{> "icons/search"}}
<button class="gh-header-input" data-ghost-search>Search posts, tags and authors</button>
<button class="gh-form-input" data-ghost-search>Search posts, tags and authors</button>
</form>
{{/match}}
+9 -1
View File
@@ -9,7 +9,15 @@
{{> "components/header-content"}}
{{/match}}
{{else}}
{{> "components/header-content"}}
{{#match headerStyle "Landing"}}
{{#if @site.members_enabled}}
{{#unless @member}}
{{> "components/header-content"}}
{{/unless}}
{{/if}}
{{else}}
{{> "components/header-content"}}
{{/match}}
{{/match}}
{{/match}}
+8 -2
View File
@@ -1,4 +1,4 @@
<section class="gh-container is-{{#match @custom.post_list_style "List"}}list{{else}}grid{{/match}}{{#if @custom.show_sidebar}} has-sidebar{{/if}}{{#if @custom.hide_images}} no-image{{/if}} gh-outer">
<section class="gh-container is-{{#match @custom.post_feed_style "List"}}list{{else}}grid{{/match}}{{#if @custom.show_sidebar}} has-sidebar{{/if}}{{#unless @custom.show_images_in_feed}} no-image{{/unless}} gh-outer">
<div class="gh-container-inner gh-inner">
<h2 class="gh-container-title">Latest</h2>
@@ -45,7 +45,13 @@
{{/if}}
{{#if @site.members_enabled}}
{{#unless @member}}
<button class="gh-button">Subscribe</button>
<button class="gh-button" data-portal="signup">Subscribe</button>
{{else}}
{{#if @site.paid_members_enabled}}
{{#unless @member.paid}}
<button class="gh-button" data-portal="upgrade">Subscribe</button>
{{/unless}}
{{/if}}
{{/unless}}
{{/if}}
</section>
+4
View File
@@ -0,0 +1,4 @@
<form class="gh-form">
<input class="gh-form-input" type="email" placeholder="jamie@example.com">
<button class="gh-button" type="submit">Subscribe</button>
</form>
+1 -1
View File
@@ -1,4 +1,4 @@
<article class="gh-card {{post_class}}">
<article class="gh-card {{post_class}}{{#unless @custom.show_images_in_feed}} no-image{{/unless}}">
<a class="gh-card-link" href="{{url}}">
{{#if feature_image}}
<figure class="gh-card-image">
+2 -2
View File
@@ -1,8 +1,8 @@
<section class="gh-container is-{{#match @custom.post_list_style "List"}}list{{else}}grid{{/match}}{{#if @custom.hide_images}} no-image{{/if}} gh-outer">
<section class="gh-container is-{{#match @custom.post_feed_style "List"}}grid{{else}}grid{{/match}}{{#unless @custom.show_images_in_feed}} no-image{{/unless}} gh-outer">
<div class="gh-container-inner gh-inner">
<h2 class="gh-container-title">Read more</h2>
<div class="gh-feed">
{{#get "posts" include="authors" filter="id:-{{post.id}}" limit="3" as |next|}}
{{#get "posts" include="authors" filter="id:-{{post.id}}" limit="4" as |next|}}
{{#foreach next}}
{{> "post-card"}}
{{/foreach}}
+1 -1
View File
@@ -15,7 +15,7 @@
</section>
{{/tag}}
<section class="gh-container is-{{#match @custom.post_list_style "List"}}list{{else}}grid{{/match}}{{#if @custom.show_sidebar}} has-sidebar{{/if}}{{#if @custom.hide_images}} no-image{{/if}}">
<section class="gh-container is-{{#match @custom.post_feed_style "List"}}list{{else}}grid{{/match}}{{#if @custom.show_sidebar}} has-sidebar{{/if}}{{#unless @custom.show_images_in_feed}} no-image{{/unless}}">
<div class="gh-container-inner gh-inner">
<main class="gh-main">