Optimized typography.

This commit is contained in:
Cotes Chung 2020-04-07 20:23:57 +08:00
parent 3e8dc979c6
commit b393e12e30
10 changed files with 51 additions and 346 deletions

View file

@ -6,7 +6,7 @@
MIT License MIT License
--> -->
<div id="panel-wrapper" class="col-xl-3 pl-2 topbar-down"> <div id="panel-wrapper" class="col-xl-3 pl-2 text-muted topbar-down">
<div class="access"> <div class="access">
{% assign lastmod_list = "" | split: "" %} {% assign lastmod_list = "" | split: "" %}

View file

@ -8,7 +8,7 @@
--> -->
<div class="share-wrapper"> <div class="share-wrapper">
<span class="share-label mr-1">{{ site.data.share.label }}</span> <span class="share-label text-muted mr-1">{{ site.data.share.label }}</span>
<span class="share-icons"> <span class="share-icons">
{% capture title %}{{ page.title }} - {{ site.title }}{% endcapture %} {% capture title %}{{ page.title }} - {{ site.title }}{% endcapture %}
{% assign url = page.url | relative_url | prepend: site.url %} {% assign url = page.url | relative_url | prepend: site.url %}

View file

@ -19,7 +19,7 @@ layout: page
</p> </p>
</div> </div>
<div class="post-meta text-muted pt-1"> <div class="post-meta text-muted">
<!-- posted date --> <!-- posted date -->
<i class="far fa-clock fa-fw"></i> <i class="far fa-clock fa-fw"></i>
<span class="timeago" data-toggle="tooltip" data-placement="bottom" <span class="timeago" data-toggle="tooltip" data-placement="bottom"

View file

@ -1,312 +1,8 @@
/* /*
* The field 'font-display' is added for Google-fonts. * The field 'font-display' is added for Google-fonts.
* *
* See https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700,900|Oswald|Lato * See: <https://fonts.google.com/>
* *
*/ */
/* latin-ext */
@font-face { @import url('https://fonts.googleapis.com/css?family=Lato|Roboto+Condensed:400,700|Source+Sans+Pro:400,600,700,900&display=swap');
font-family: 'Lato';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v14/S6uyw4BMUTPHjxAwXjeu.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v14/S6uyw4BMUTPHjx4wXg.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;
}
/* cyrillic */
@font-face {
font-family: 'Oswald';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Oswald Regular'), local('Oswald-Regular'), url(https://fonts.gstatic.com/s/oswald/v16/TK3iWkUHHAIjg752HT8Ghe4.woff2) format('woff2');
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
font-family: 'Oswald';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Oswald Regular'), local('Oswald-Regular'), url(https://fonts.gstatic.com/s/oswald/v16/TK3iWkUHHAIjg752Fj8Ghe4.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Oswald';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Oswald Regular'), local('Oswald-Regular'), url(https://fonts.gstatic.com/s/oswald/v16/TK3iWkUHHAIjg752Fz8Ghe4.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Oswald';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Oswald Regular'), local('Oswald-Regular'), url(https://fonts.gstatic.com/s/oswald/v16/TK3iWkUHHAIjg752GT8G.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;
}
/* cyrillic-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xK3dSBYKcSV-LCoeQqfX1RYOo3qNa7lqDY.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xK3dSBYKcSV-LCoeQqfX1RYOo3qPK7lqDY.woff2) format('woff2');
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xK3dSBYKcSV-LCoeQqfX1RYOo3qNK7lqDY.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xK3dSBYKcSV-LCoeQqfX1RYOo3qO67lqDY.woff2) format('woff2');
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xK3dSBYKcSV-LCoeQqfX1RYOo3qN67lqDY.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xK3dSBYKcSV-LCoeQqfX1RYOo3qNq7lqDY.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xK3dSBYKcSV-LCoeQqfX1RYOo3qOK7l.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;
}
/* cyrillic-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 600;
font-display: swap;
src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwmhduz8A.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 600;
font-display: swap;
src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwkxduz8A.woff2) format('woff2');
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 600;
font-display: swap;
src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwmxduz8A.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 600;
font-display: swap;
src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwlBduz8A.woff2) format('woff2');
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 600;
font-display: swap;
src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwmBduz8A.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 600;
font-display: swap;
src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwmRduz8A.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 600;
font-display: swap;
src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwlxdu.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;
}
/* cyrillic-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 700;
font-display: swap;
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3ig4vwmhduz8A.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 700;
font-display: swap;
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3ig4vwkxduz8A.woff2) format('woff2');
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 700;
font-display: swap;
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3ig4vwmxduz8A.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 700;
font-display: swap;
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3ig4vwlBduz8A.woff2) format('woff2');
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 700;
font-display: swap;
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3ig4vwmBduz8A.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 700;
font-display: swap;
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3ig4vwmRduz8A.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 700;
font-display: swap;
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3ig4vwlxdu.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;
}
/* cyrillic-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 900;
font-display: swap;
src: local('Source Sans Pro Black'), local('SourceSansPro-Black'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3iu4nwmhduz8A.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 900;
font-display: swap;
src: local('Source Sans Pro Black'), local('SourceSansPro-Black'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3iu4nwkxduz8A.woff2) format('woff2');
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 900;
font-display: swap;
src: local('Source Sans Pro Black'), local('SourceSansPro-Black'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3iu4nwmxduz8A.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 900;
font-display: swap;
src: local('Source Sans Pro Black'), local('SourceSansPro-Black'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3iu4nwlBduz8A.woff2) format('woff2');
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 900;
font-display: swap;
src: local('Source Sans Pro Black'), local('SourceSansPro-Black'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3iu4nwmBduz8A.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 900;
font-display: swap;
src: local('Source Sans Pro Black'), local('SourceSansPro-Black'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3iu4nwmRduz8A.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 900;
font-display: swap;
src: local('Source Sans Pro Black'), local('SourceSansPro-Black'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xKydSBYKcSV-LCoeQqfX1RYOo3iu4nwlxdu.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;
}

View file

@ -37,6 +37,10 @@
border-bottom: none; border-bottom: none;
} }
%heading {
font-family: 'Lato', 'Microsoft Yahei', sans-serif;
}
%section { %section {
#post-wrapper & { #post-wrapper & {
line-height: 1.2; line-height: 1.2;
@ -45,19 +49,13 @@
} }
%anchor { %anchor {
#post-wrapper &, .post-content &,
#page & { #page & {
padding-top: 3.5rem; padding-top: 3.5rem;
margin-top: -2.5rem; margin-top: -2.5rem;
} }
} }
%footer-content {
font-weight: 600;
color: var(---footer-link);
}
/*---------- scss mixin ---------*/ /*---------- scss mixin ---------*/
@mixin no-text-decoration { @mixin no-text-decoration {
@ -91,3 +89,14 @@
@mixin input-placeholder { @mixin input-placeholder {
opacity: 0.6; opacity: 0.6;
} }
@mixin semi-bold {
font-weight: 600;
}
@mixin label($font-size: 1rem, $font-weight: 600, $color: var(--label-color)) {
color: $color;
font-size: $font-size;
font-weight: $font-weight;
font-family: 'Roboto Condensed', 'Microsoft Yahei', sans-serif;
}

View file

@ -34,7 +34,7 @@
--card-bg: rgb(39, 40, 33); --card-bg: rgb(39, 40, 33);
--card-header-bg: rgb(51, 50, 50); --card-header-bg: rgb(51, 50, 50);
--label-relate-post: rgb(164, 175, 181); --label-color: rgb(108, 117, 125);
/* Sidebar */ /* Sidebar */
--nav-cursor-color: rgb(183, 182, 182); --nav-cursor-color: rgb(183, 182, 182);

View file

@ -18,7 +18,7 @@
--btn-border-color: #e9ecef; --btn-border-color: #e9ecef;
--text-color: #343a40; --text-color: #333333;
--blockquote-border-color: #eee; --blockquote-border-color: #eee;
@ -32,7 +32,7 @@
--tb-odd-bg: #fbfcfd; --tb-odd-bg: #fbfcfd;
--tb-border-color: #f2f3f3; --tb-border-color: #eaeaea;
--button-bg: #fff; --button-bg: #fff;
@ -89,7 +89,7 @@
--card-box-shadow: rgba(234, 234, 234, 0.7686274509803922); --card-box-shadow: rgba(234, 234, 234, 0.7686274509803922);
--label-relate-post: #353a3d; --label-color: #808080;
--relate-post-date: rgba(30, 55, 70, .4); --relate-post-date: rgba(30, 55, 70, .4);

View file

@ -18,6 +18,10 @@
background-color: var(--timeline-color); background-color: var(--timeline-color);
} }
%date-font {
font-family: 'Roboto Condensed', sans-serif;
}
#archives { #archives {
letter-spacing: 0.03rem; letter-spacing: 0.03rem;
li { li {
@ -37,7 +41,7 @@
span.lead { span.lead {
font-size: 1.5rem; font-size: 1.5rem;
font-family: 'Oswald', sans-serif; @extend %date-font;
position: relative; position: relative;
left: 8px; left: 8px;
@ -75,7 +79,7 @@
&.month { &.month {
width: 1.4rem; width: 1.4rem;
text-align: center; text-align: center;
font-family: 'Oswald', sans-serif; @extend %date-font;
~a::before { ~a::before {
/* A dot for Month and Day */ /* A dot for Month and Day */
content: ""; content: "";
@ -96,7 +100,7 @@
} }
&.day { &.day {
font-size: 85%; font-size: 85%;
font-family: sans-serif; font-family: 'Lato', sans-serif;
text-align: center; text-align: center;
margin-right: -2px; margin-right: -2px;
width: 1.2rem; width: 1.2rem;

View file

@ -398,8 +398,8 @@ $tab-count: {{ site.data.tabs | size }};
a { a {
@extend %link-color; @extend %link-color;
@extend %no-bottom-border; @extend %no-bottom-border;
@extend %heading;
font-size: 1.4rem; font-size: 1.4rem;
font-weight: 400;
line-height: 2.5rem; line-height: 2.5rem;
&:hover { &:hover {
@extend %link-hover; @extend %link-hover;
@ -513,6 +513,8 @@ footer {
} }
} }
a { a {
@include semi-bold;
color: var(---footer-link);
&:link { &:link {
@include no-text-decoration; @include no-text-decoration;
} }
@ -521,14 +523,8 @@ footer {
@include no-text-decoration; @include no-text-decoration;
} }
} }
.footer-left a {
@extend %footer-content;
}
.footer-right { .footer-right {
text-align: right; text-align: right;
a {
@extend %footer-content;
}
} }
} }
@ -540,7 +536,6 @@ footer {
margin-right: 1.5rem; margin-right: 1.5rem;
margin-top: 3rem; margin-top: 3rem;
margin-bottom: 4rem; margin-bottom: 4rem;
color: #6c757d;
&:only-child { &:only-child {
position: -webkit-sticky; /* Safari */ position: -webkit-sticky; /* Safari */
position: sticky; position: sticky;
@ -561,8 +556,7 @@ footer {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
letter-spacing: -0.02em; letter-spacing: -0.02em;
font-size: 1rem; @include label(inherit, 600);
font-family: 'Oswald', sans-serif;
} }
.post-content { .post-content {
font-size: .9rem; font-size: .9rem;
@ -641,29 +635,35 @@ footer {
/*--- Typography ---*/ /*--- Typography ---*/
h1 { h1 {
@extend %heading;
font-size: 1.8rem; font-size: 1.8rem;
font-weight: 400;
} }
h2 { h2 {
@extend %heading;
@extend %section; @extend %section;
@extend %anchor; @extend %anchor;
font-size: 1.35rem; font-size: 1.4rem;
} }
h3 { h3 {
@extend %heading;
@extend %section; @extend %section;
@extend %anchor; @extend %anchor;
font-size: 1.25rem; font-size: 1.25rem;
} }
h4 { h4 {
@extend %heading;
@extend %section; @extend %section;
@extend %anchor; @extend %anchor;
font-size: 1.15rem; font-size: 1.15rem;
} }
h5 { h5 {
@extend %heading;
@extend %section;
@extend %anchor;
font-size: 1.1rem; font-size: 1.1rem;
} }
@ -856,7 +856,7 @@ table {
background: var(--tag-bg); background: var(--tag-bg);
border-radius: .3rem; border-radius: .3rem;
padding: 0 .4rem; padding: 0 .4rem;
color: #818182; color: inherit;
line-height: 1.3rem; line-height: 1.3rem;
&:not(:last-child) { &:not(:last-child) {
margin-right: .2rem; margin-right: .2rem;

View file

@ -28,7 +28,7 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
} }
.author { .author {
font-weight: 600; @include semi-bold;
} }
.post img { .post img {
@ -137,9 +137,7 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
top: 6rem; top: 6rem;
} }
>h3 { >h3 {
font-size: 1rem; @include label(inherit, 600);
font-family: 'Oswald', sans-serif;
color: gray;
} }
} }
@ -154,9 +152,7 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
#related-posts { #related-posts {
>h3 { >h3 {
color: gray; @include label(1.1rem, 600);
font-size: 1.1rem;
font-family: 'Oswald', sans-serif;
} }
.card { .card {
border: 1px solid var(--card-border-color); border: 1px solid var(--card-border-color);
@ -166,7 +162,7 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
-moz-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out;
transition: all .3s ease-in-out; transition: all .3s ease-in-out;
h3 { h3 {
color: var(--label-relate-post); color: var(--text-color);
} }
&:hover { &:hover {
-webkit-transform: translate3d(0, -3px, 0); -webkit-transform: translate3d(0, -3px, 0);
@ -269,7 +265,7 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
.share-label { .share-label {
font-family: 'Oswald', sans-serif; @include label(inherit, 400, inherit);
&::after { &::after {
content: ":"; content: ":";
} }