mirror of
https://github.com/aljazceru/Journal-ghost.git
synced 2025-12-28 18:44:22 +01:00
Typography update for Journal theme
This commit is contained in:
Sodbileg Gansukh
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,18 +1,9 @@
|
||||
@import "shared/assets/css/screen.css";
|
||||
|
||||
@font-face {
|
||||
font-family: Mulish;
|
||||
font-style: normal;
|
||||
font-weight: 100 900;
|
||||
font-display: optional;
|
||||
src: url("/fonts/mulish-var.woff2") format("woff2");
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
:root {
|
||||
--font-sans: Mulish, -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif; /* stylelint-disable-line value-keyword-case */
|
||||
--content-font-name: var(--font-sans);
|
||||
--content-font-size: 1.9rem;
|
||||
--h1-size: 6.8rem;
|
||||
}
|
||||
|
||||
.tag-template .gh-main,
|
||||
@@ -20,14 +11,10 @@
|
||||
padding-top: 8vmin;
|
||||
}
|
||||
|
||||
.gh-head-logo {
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.gh-head-menu,
|
||||
.gh-head-actions {
|
||||
font-size: 1.4rem;
|
||||
font-weight: 600;
|
||||
font-weight: 500;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
@@ -41,6 +28,7 @@
|
||||
|
||||
.gh-latest .gh-card-meta {
|
||||
flex-direction: column;
|
||||
margin-top: 1.2rem;
|
||||
font-size: 1.4rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
@@ -71,13 +59,14 @@
|
||||
}
|
||||
|
||||
.gh-latest .gh-card-title {
|
||||
font-size: 3.6rem;
|
||||
font-weight: 800;
|
||||
font-size: var(--h1-size);
|
||||
font-weight: 600;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.gh-latest .gh-card-excerpt {
|
||||
margin-top: 1.6rem;
|
||||
font-size: 1.8rem;
|
||||
margin-top: 2.4rem;
|
||||
font-size: 2.2rem;
|
||||
}
|
||||
|
||||
.gh-latest .gh-card-footer {
|
||||
@@ -88,7 +77,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -114,6 +103,7 @@
|
||||
align-items: center;
|
||||
margin-bottom: 4.8rem;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
@@ -123,11 +113,11 @@
|
||||
height: 1px;
|
||||
margin-left: 1.6rem;
|
||||
content: "";
|
||||
background-color: var(--color-darker-gray);
|
||||
background-color: var(--color-light-gray);
|
||||
}
|
||||
|
||||
.gh-card + .gh-card {
|
||||
margin-top: 4.8rem;
|
||||
margin-top: 6.4rem;
|
||||
}
|
||||
|
||||
.gh-card-link {
|
||||
@@ -139,8 +129,8 @@
|
||||
}
|
||||
|
||||
.gh-card-title {
|
||||
font-size: 2.5rem;
|
||||
font-weight: 800;
|
||||
font-size: 3.4rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.gh-card-link:hover .gh-card-title {
|
||||
@@ -149,13 +139,13 @@
|
||||
|
||||
.gh-card-excerpt {
|
||||
margin-top: 1.2rem;
|
||||
font-size: 1.8rem;
|
||||
font-size: 1.9rem;
|
||||
}
|
||||
|
||||
.gh-card-meta {
|
||||
display: flex;
|
||||
font-size: 1.3rem;
|
||||
font-weight: 600;
|
||||
font-weight: 500;
|
||||
line-height: 1;
|
||||
color: var(--color-secondary-text);
|
||||
text-transform: uppercase;
|
||||
@@ -183,7 +173,8 @@
|
||||
}
|
||||
|
||||
.gh-sidebar {
|
||||
font-size: 1.7rem;
|
||||
padding-left: 1.6rem;
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
.gh-sidebar .gh-section + .gh-section {
|
||||
@@ -202,7 +193,8 @@
|
||||
|
||||
.gh-about-title {
|
||||
font-size: 2.2rem;
|
||||
letter-spacing: -0.02em;
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
.gh-about-description {
|
||||
@@ -223,14 +215,22 @@
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.gh-featured .gh-card + .gh-card {
|
||||
margin-top: 4rem;
|
||||
}
|
||||
|
||||
.gh-featured .gh-card-title {
|
||||
font-size: 2.2rem;
|
||||
font-weight: 700;
|
||||
font-size: 1.8rem;
|
||||
font-weight: 600;
|
||||
line-height: 1.25;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
.gh-featured .gh-card-excerpt {
|
||||
margin-top: 0.8rem;
|
||||
font-size: inherit;
|
||||
line-height: 1.55;
|
||||
color: var(--color-secondary-text);
|
||||
}
|
||||
|
||||
.gh-topic-item {
|
||||
@@ -245,7 +245,8 @@
|
||||
|
||||
.gh-topic-name {
|
||||
font-size: 1.8rem;
|
||||
letter-spacing: -0.02em;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
.gh-topic-count {
|
||||
@@ -269,8 +270,8 @@
|
||||
}
|
||||
|
||||
.gh-subscribe-title {
|
||||
font-size: 3.6rem;
|
||||
font-weight: 800;
|
||||
font-size: 4rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.gh-subscribe-description {
|
||||
@@ -325,10 +326,8 @@
|
||||
}
|
||||
|
||||
.gh-subscribe-btn {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
color: var(--ghost-accent-color);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -342,11 +341,16 @@
|
||||
}
|
||||
|
||||
.gh-article-meta a {
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.gh-article-title {
|
||||
font-weight: 800;
|
||||
font-weight: 600;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.gh-article-excerpt {
|
||||
margin-top: 3.2rem;
|
||||
}
|
||||
|
||||
.gh-article-footer {
|
||||
@@ -393,7 +397,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 2.1rem;
|
||||
font-weight: 800;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -410,26 +414,27 @@
|
||||
grid-column: wide-start/main-start;
|
||||
max-width: 200px;
|
||||
height: max-content;
|
||||
padding-top: 0.4rem;
|
||||
font-size: 1.5rem;
|
||||
padding-top: 0.8rem;
|
||||
font-size: 1.4rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.gh-pagehead-title {
|
||||
font-size: 2.1rem;
|
||||
font-weight: 800;
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
|
||||
.gh-pagehead-description {
|
||||
margin-top: 0.8rem;
|
||||
line-height: 1.3;
|
||||
line-height: 1.45;
|
||||
color: var(--color-secondary-text);
|
||||
}
|
||||
|
||||
.gh-tag-label {
|
||||
margin-bottom: 1.2rem;
|
||||
font-size: 1.3rem;
|
||||
font-weight: 600;
|
||||
font-weight: 500;
|
||||
color: var(--ghost-accent-color);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -457,12 +462,12 @@
|
||||
}
|
||||
|
||||
.gh-author-website {
|
||||
margin-top: 0.8rem;
|
||||
margin-top: 1.2rem;
|
||||
}
|
||||
|
||||
.gh-author-social {
|
||||
display: flex;
|
||||
margin-top: 1.6rem;
|
||||
margin-top: 2.4rem;
|
||||
}
|
||||
|
||||
.gh-author-facebook {
|
||||
@@ -506,8 +511,4 @@
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
.gh-topic-count {
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>{{meta_title}}</title>
|
||||
<link rel="preload" href="/fonts/mulish-var.woff2" as="font" type="font/woff2" crossOrigin="anonymous">
|
||||
<link rel="preload" href="/fonts/inter-var-latin.woff2" as="font" type="font/woff2" crossOrigin="anonymous">
|
||||
<link rel="stylesheet" href="{{asset "built/screen.css"}}">
|
||||
|
||||
{{ghost_head}}
|
||||
|
||||
16
index.hbs
16
index.hbs
@@ -12,22 +12,6 @@
|
||||
|
||||
<div class="gh-card-wrapper">
|
||||
<header class="gh-card-header">
|
||||
{{#if feature_image}}
|
||||
<a class="gh-card-image-link" href="{{url}}">
|
||||
<img class="gh-card-image"
|
||||
srcset="{{img_url feature_image size="s"}} 300w,
|
||||
{{img_url feature_image size="m"}} 720w,
|
||||
{{img_url feature_image size="l"}} 960w,
|
||||
{{img_url feature_image size="xl"}} 1200w,
|
||||
{{img_url feature_image size="xxl"}} 2000w"
|
||||
sizes="calc((1200px - 2.4rem) / 4 * 3)"
|
||||
src="{{img_url feature_image size="m"}}"
|
||||
alt="{{title}}"
|
||||
loading="lazy"
|
||||
>
|
||||
</a>
|
||||
{{/if}}
|
||||
|
||||
<h2 class="gh-card-title"><a href="{{url}}">{{title}}</a></h2>
|
||||
</header>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user