diff options
| author | Matthew Rhone <matthew.rhone@outlook.com> | 2017-01-08 21:49:52 +0300 |
|---|---|---|
| committer | Matthew Rhone <matthew.rhone@outlook.com> | 2017-01-08 21:49:52 +0300 |
| commit | 7da890601ea9651f4f9b39e222feff8b47d846a6 (patch) | |
| tree | d6cbed4ec5fb30a527272739001a6f53d6b1e99f | |
| parent | f1fe5d299d75a163d31c9f2b8942dfd50dd6a545 (diff) | |
Start incorporating more rusksack font sizes, add meta properties for sites like facebook.
| -rw-r--r-- | layouts/partials/header.html | 3 | ||||
| -rw-r--r-- | postcss/src/style.min.css | 9 | ||||
| -rw-r--r-- | static/css/style.min.css | 35 |
3 files changed, 40 insertions, 7 deletions
diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 532f557..6b00759 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -3,6 +3,9 @@ <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta property="og:title" content="{{ if ne .URL "/" }} {{ .Title }} · {{ end }} {{ .Site.Title }}" /> + <meta property="og:site_name" content="{{ .Site.Title }}" /> + <meta property="og:url" content="{{ .Permalink }}" /> <meta name="theme" content="darksimplicity"> {{ .Hugo.Generator }} {{ with .Site.Params.name }}<meta name="author" content="{{ . }}">{{ end }} diff --git a/postcss/src/style.min.css b/postcss/src/style.min.css index cc03c74..5c271fd 100644 --- a/postcss/src/style.min.css +++ b/postcss/src/style.min.css @@ -59,8 +59,10 @@ a {color: $linkTextColor;} } .copyright{ lost-column: 12/12; - font-size:small; color: $copyrightTextColor; + color: $copyrightTextColor; } +.copyright p { + font-size: responsive 12px 15px;} .content-tags, .post-title { lost-column: 7/12 0; } @@ -70,6 +72,7 @@ a {color: $linkTextColor;} .pagination{ lost-column: 12/12; text-align:center; + font-size: responsive 16px 19px; } .tags { lost-column: 2/12; @@ -86,13 +89,13 @@ color: $linkHoverColor; text-decoration: underline; } p { margin-top: 5px; -font-size: responsive;} +font-size: responsive 16px 21px;} .empty { lost-column: 12/12; } .post-title-link { font-weight: 700; -font-size: 30px; +font-size: responsive 30px 36px;; color: $linkTextColor; text-decoration: none; } diff --git a/static/css/style.min.css b/static/css/style.min.css index d09843c..027206f 100644 --- a/static/css/style.min.css +++ b/static/css/style.min.css @@ -71,7 +71,7 @@ a {color: #676767;} flex-shrink: 0; flex-basis: calc(99.9% * 12/12 - (30px - 30px * 12/12)); width: calc(99.9% * 12/12 - (30px - 30px * 12/12)); - font-size:small; color: #676767; + color: #676767; } .copyright:nth-child(1n) { margin-right: 30px; margin-left: 0; } @@ -79,6 +79,16 @@ a {color: #676767;} } .copyright:nth-child(12n) { margin-right: 0; margin-left: auto; } +.copyright p { + font-size: calc(12px + 3 * ((100vw - 420px) / 860));} +@media screen and (min-width: 1280px) { + .copyright p { font-size: 15px; + } +} +@media screen and (max-width: 420px) { + .copyright p { font-size: 12px; + } +} .content-tags, .post-title { flex-grow: 0; flex-shrink: 0; @@ -109,6 +119,15 @@ a {color: #676767;} flex-basis: calc(99.9% * 12/12 - (30px - 30px * 12/12)); width: calc(99.9% * 12/12 - (30px - 30px * 12/12)); text-align:center; + font-size: calc(16px + 3 * ((100vw - 420px) / 860)); +} +@media screen and (min-width: 1280px) { + .pagination { font-size: 19px; + } +} +@media screen and (max-width: 420px) { + .pagination { font-size: 16px; + } } .pagination:nth-child(1n) { margin-right: 30px; margin-left: 0; } @@ -140,13 +159,13 @@ color: #aeaeae; text-decoration: underline; } p { margin-top: 5px; -font-size: calc(12px + 9 * ((100vw - 420px) / 860));} +font-size: calc(16px + 5 * ((100vw - 420px) / 860));} @media screen and (min-width: 1280px) { p { font-size: 21px; } } @media screen and (max-width: 420px) { - p { font-size: 12px; + p { font-size: 16px; } } .empty { @@ -163,10 +182,18 @@ font-size: calc(12px + 9 * ((100vw - 420px) / 860));} } .post-title-link { font-weight: 700; -font-size: 30px; +font-size: calc(30px + 6 * ((100vw - 420px) / 860));; color: #676767; text-decoration: none; } +@media screen and (min-width: 1280px) { + .post-title-link { font-size: 36px; + } +} +@media screen and (max-width: 420px) { + .post-title-link { font-size: 30px; + } +} .post-title-link:hover { color: #aeaeae; } |