diff --git a/sass/_comments.scss b/sass/_comments.scss index dfc6d9a..0157ba3 100644 --- a/sass/_comments.scss +++ b/sass/_comments.scss @@ -144,6 +144,10 @@ section#comments { padding: 1rem; text-align: left; + p { + color: var(--fg60); + } + * { display: inline-block; margin: 0; diff --git a/sass/_main.scss b/sass/_main.scss index 3492cef..5f447a2 100644 --- a/sass/_main.scss +++ b/sass/_main.scss @@ -141,7 +141,7 @@ strong { } small { - // color: var(--fg50); + color: var(--fg60); font-size: 0.8rem; } @@ -162,30 +162,23 @@ dl { } hr { - border: 0.125rem solid var(--fg50); + border: 0.125rem solid var(--fg20); margin: 3rem auto; width: 40%; border-radius: 9999px; } blockquote { - padding: 0 0.75em; border-left: 0.25rem solid var(--primary-color); + border-radius: var(--rounded-corner-small); + color: var(--fg60); margin: 0; - border-radius: 2.5px; + padding: 0 0.75rem; - > :first-child { - margin-top: 0; + // make border slightly transparent for nested blockquote + > blockquote { + border-left: 0.3rem solid var(--primary-color-alpha); } - - > :last-child { - margin-bottom: 0; - } - - // // make border slightly transparent for nested blockquote - // > blockquote { - // border-left: 0.3rem solid var(--primary-color-alpha); - // } } abbr { @@ -202,7 +195,7 @@ code { code:not(pre code) { padding: 2px 6px; border-radius: var(--rounded-corner-small); - background-color: var(--fg05); + background-color: var(--fg10); color: var(--red-fg); } @@ -303,7 +296,7 @@ table { th, td { padding: 0.5rem 1rem; - border: 1px solid var(--fg50); + border: 1px solid var(--fg20); } } @@ -363,7 +356,7 @@ img { background-color: var(--nav-bg); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); - // position: sticky; + position: sticky; top: 1rem; z-index: 1; @@ -621,8 +614,14 @@ img { .heading { text-align: center; - // &::after { - // content: "."; - // color: var(--primary-color); - // } + &::after { + content: "."; + color: var(--primary-color); + } +} + +.date-row { + display: flex; + justify-content: center; + text-align: center; } diff --git a/sass/_variables.scss b/sass/_variables.scss index aaba39a..6e0b081 100644 --- a/sass/_variables.scss +++ b/sass/_variables.scss @@ -26,14 +26,16 @@ $glow: 0 0 0 1px color.scale($primary-color, $alpha: -95%), --fg-color: rgba(0, 0, 0, 0.8); --primary-color-alpha: #{$primary-color-alpha}; --primary-color: #{$primary-color}; - --rounded-corner-big: 1.2rem; - --rounded-corner-small: 0.5rem; - --rounded-corner: 0.75rem; + --rounded-corner-big: 18px; + --rounded-corner-small: 8px; + --rounded-corner: 12px; // CUSTOM COLOR PALETTE --fg05: rgba(0, 0, 0, 0.05); --fg10: rgba(0, 0, 0, 0.1); + --fg20: rgba(0, 0, 0, 0.2); --fg50: rgba(0, 0, 0, 0.5); + --fg60: rgba(0, 0, 0, 0.6); --nav-bg: #{$nav-bg-l}; --orange-bg: rgba(255, 120, 0, 0.1); @@ -71,7 +73,9 @@ $glow: 0 0 0 1px color.scale($primary-color, $alpha: -95%), // CUSTOM COLOR PALETTE --fg05: rgba(255, 255, 255, 0.05); --fg10: rgba(255, 255, 255, 0.1); + --fg20: rgba(255, 255, 255, 0.1); --fg50: rgba(255, 255, 255, 0.5); + --fg60: rgba(255, 255, 255, 0.6); --nav-bg: #{$nav-bg-d}; --orange-bg: rgba(255, 190, 111, 0.1); diff --git a/templates/blog.html b/templates/blog.html index 5d59954..4370cd2 100644 --- a/templates/blog.html +++ b/templates/blog.html @@ -4,23 +4,25 @@

{{ page.title }}

{%- if page.date %} - - - {%- if page.taxonomies %} - {%- for name, taxon in page.taxonomies %} - - {%- endfor %} - {%- endif %} - + {%- endif %} + + {%- endif %} {% if page.extra.archive %} diff --git a/templates/blog_list.html b/templates/blog_list.html index ed16c73..011a064 100644 --- a/templates/blog_list.html +++ b/templates/blog_list.html @@ -26,8 +26,8 @@ {%- if page.taxonomies %} {%- for name, taxon in page.taxonomies %} +