diff --git a/assets/css/components/_app.scss b/assets/css/components/_app.scss index 35cd1ef9..8545205a 100644 --- a/assets/css/components/_app.scss +++ b/assets/css/components/_app.scss @@ -16,11 +16,14 @@ } .app-header-social { + display: flex; + align-items: center; + justify-content: center; font-size: 2em; color: $lightest-color; - a { - margin: 0 0.1em; + a:not(:last-child) { + margin-right: 0.4em; } } diff --git a/assets/css/components/_icon.scss b/assets/css/components/_icon.scss index 1af7c1b8..20178aa4 100644 --- a/assets/css/components/_icon.scss +++ b/assets/css/components/_icon.scss @@ -2,5 +2,5 @@ display: inline-block; width: 1em; height: 1em; - vertical-align: -0.125em; + margin-top: -0.125em; } diff --git a/assets/css/components/_pagination.scss b/assets/css/components/_pagination.scss index cc0d8a1e..2161c5fe 100644 --- a/assets/css/components/_pagination.scss +++ b/assets/css/components/_pagination.scss @@ -10,8 +10,11 @@ .page-item { display: inline-block; .page-link { - display: block; - padding: 0.285em 0.8em; + display: flex; + align-items: center; + justify-content:center; + width: 1.8rem; + height: 1.8rem; } &.active { diff --git a/assets/css/components/_post.scss b/assets/css/components/_post.scss index 8dd8102b..c10cb8c1 100644 --- a/assets/css/components/_post.scss +++ b/assets/css/components/_post.scss @@ -2,6 +2,16 @@ color: $lightest-color; } +.post-meta > div { + display: flex; + align-items: center; + font-size: 0.8em; + + > .icon { + margin-right: 0.4em; + } +} + .post-content { & > pre, .highlight { @@ -30,7 +40,3 @@ max-width: 100%; } } - -.post-meta { - font-size: 0.8em; -} diff --git a/assets/css/components/_posts_list.scss b/assets/css/components/_posts_list.scss index fd9eea73..49177c1a 100644 --- a/assets/css/components/_posts_list.scss +++ b/assets/css/components/_posts_list.scss @@ -12,6 +12,15 @@ } .posts-list-item-description { - display: block; + display: flex; + align-items: center; font-size: 0.8em; + + > .icon { + margin-right: 0.4em; + } +} + +.posts-list-item-separator { + margin: 0 0.4em; } diff --git a/assets/css/components/_tags_list.scss b/assets/css/components/_tags_list.scss index 0b8b3315..1dddc531 100644 --- a/assets/css/components/_tags_list.scss +++ b/assets/css/components/_tags_list.scss @@ -3,8 +3,14 @@ } .tags-list-item { + display: flex; + align-items: center; list-style: none; padding: 0.4em 0; + + > .icon { + margin-right: .4em; + } &:not(:last-child) { border-bottom: 1px dashed rgba(255, 255, 255, 0.3); } diff --git a/layouts/_default/list.html b/layouts/_default/list.html index 8a0c7c7a..40a41f8f 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -8,7 +8,7 @@

{{ .Title }}

{{ partial "icon.html" (dict "ctx" $ "name" "calendar") }} {{ .PublishDate.Format "Jan 2, 2006" }} - - + - {{ partial "icon.html" (dict "ctx" $ "name" "clock") }} {{ .ReadingTime }} min read diff --git a/layouts/partials/icon.html b/layouts/partials/icon.html index 06f8a421..20f4a30d 100644 --- a/layouts/partials/icon.html +++ b/layouts/partials/icon.html @@ -1,10 +1,10 @@ {{- if isset .ctx.Site.Data.m10c.icons .name -}} - + {{ .title | default .name }} {{ safeHTML (index .ctx.Site.Data.m10c.icons .name) }} {{- else -}} - +