From 6a65ce2db2ddbf34a7a3539fe640b049edafbf78 Mon Sep 17 00:00:00 2001 From: Cotes Chung <11371340+cotes2020@users.noreply.github.com> Date: Sat, 16 Nov 2019 00:01:33 +0800 Subject: [PATCH] Split the CSS to save load time. --- _includes/head.html | 35 +- assets/css/{_src => _typograph}/fonts.scss | 0 assets/css/{_src => _typograph}/syntax.scss | 2 +- assets/css/archives.scss | 148 ++++++ assets/css/categories.scss | 57 +++ assets/css/category-tag.scss | 64 +++ assets/css/home.scss | 115 +++++ assets/css/{_src => }/main.scss | 495 +------------------- assets/css/post.scss | 95 ++++ assets/css/styles.scss | 9 - assets/css/tags.scss | 28 ++ 11 files changed, 555 insertions(+), 493 deletions(-) rename assets/css/{_src => _typograph}/fonts.scss (100%) rename assets/css/{_src => _typograph}/syntax.scss (99%) create mode 100644 assets/css/archives.scss create mode 100644 assets/css/categories.scss create mode 100644 assets/css/category-tag.scss create mode 100644 assets/css/home.scss rename assets/css/{_src => }/main.scss (72%) create mode 100644 assets/css/post.scss delete mode 100644 assets/css/styles.scss create mode 100644 assets/css/tags.scss diff --git a/_includes/head.html b/_includes/head.html index f6c9fcd..7aeda16 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -28,8 +28,28 @@ integrity="sha256-+N4/V/SbAFiW1MPBCXnfnP9QSN3+Keu+NlB+0ev/YKQ=" crossorigin="anonymous"> - + + + {% if page.layout == 'home' %} + + {% endif %} + + {% if page.title == 'Categories' and page.layout == 'page' %} + + {% endif %} + + {% if page.title == 'Tags' and page.layout == 'page' %} + + {% endif %} + + {% if page.layout == 'category' or page.layout == 'tag' %} + + {% endif %} + + {% if page.title == 'Archives' and page.layout == 'page' %} + + {% endif %} + @@ -58,10 +78,13 @@ {% endif %} {% endif %} - {% if page.layout == 'post' and site.toc and page.toc %} - - - + {% if page.layout == 'post' %} + + {% if site.toc and page.toc %} + + + + {% endif %} {% endif %} \ No newline at end of file diff --git a/assets/css/_src/fonts.scss b/assets/css/_typograph/fonts.scss similarity index 100% rename from assets/css/_src/fonts.scss rename to assets/css/_typograph/fonts.scss diff --git a/assets/css/_src/syntax.scss b/assets/css/_typograph/syntax.scss similarity index 99% rename from assets/css/_src/syntax.scss rename to assets/css/_typograph/syntax.scss index d4a3224..b61ae44 100644 --- a/assets/css/_src/syntax.scss +++ b/assets/css/_typograph/syntax.scss @@ -1,4 +1,4 @@ -/*! +/* * The syntax highlight. * © 2018-2019 Cotes Chung * MIT Licensed diff --git a/assets/css/archives.scss b/assets/css/archives.scss new file mode 100644 index 0000000..105abc4 --- /dev/null +++ b/assets/css/archives.scss @@ -0,0 +1,148 @@ +--- +--- +/*! + Style for Archives + © 2019 Cotes Chung + MIT License +*/ + +#archives { + letter-spacing: 0.03rem; +} + +#archives li { + font-size: 1.1rem; + line-height: 3rem; +} + +#archives li:nth-child(odd) { + background-color: #fff; + background-image: linear-gradient(to left, #fff, #fbfbfb, #fbfbfb, #fbfbfb, #fff); +} + +#archives li>div { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +#archives span.lead { + font-size: 1.5rem; + font-family: 'Oswald', sans-serif; + position: relative; + left: 8px; +} + +#archives span.lead:not(:first-child) { + position: relative; + left: 4px; +} + +#archives span.lead:not(:first-child)::after { + left: 67px; +} + +#archives span.lead::after { /* Year dot */ + content: ""; + display: block; + position: relative; + -webkit-border-radius: 50%; + -moz-border-radius: 50%; + border-radius: 50%; + width: 12px; + height: 12px; + top: -26px; + left: 63px; + border: 3px solid; + background-color: #ffffff; + border-color: #c2c6cc; + box-shadow: 0 0 2px 0 #c2c6cc; + z-index: 1; +} + +#archives .date { + white-space: nowrap; + display: inline-block; +} + +#archives .date.month { + width: 1.4rem; + text-align: center; + font-family: 'Oswald', sans-serif; +} + +#archives .date.day { + font-size: 85%; + font-family: sans-serif; + text-align: center; + margin-right: -2px; + width: 1.2rem; + position: relative; + left: -.15rem; +} + +#archives ul>li>div>a { +/* post title in Archvies */ + margin-left: 2.5rem; + position: relative; + top: .1rem; +} + +#archives .date.month ~ a::before { + /* A dot for Month and Day */ + content: ""; + display: inline-block; + position: relative; + -webkit-border-radius: 50%; + -moz-border-radius: 50%; + border-radius: 50%; + width: 8px; + height: 8px; + float: left; + top: 1.35rem; + left: 69px; + background-color: #c2c6cc; + box-shadow: 0 0 3px 0 #c2c6cc; + z-index: 1; +} + +/* timeline for date */ +#archives ul>li::after, +#archives ul>li:first-child::before { + content: ""; + width: 4px; + left: 75px; + display: inline-block; + float: left; + position: relative; + background-color: rgba(0, 0, 0, 0.075); +} + +#archives ul>li::after { + height: 2.8rem; + top: -1.3rem; +} + +#archives ul>li:first-child::before { + height: 3.06rem; + top: -1.61rem; +} + +#archives ul:not(:last-child)>li:last-child::after { + height: 3.4rem; +} + +#archives ul:last-child>li:last-child::after { + display: none; +} + +@media all and (max-width: 576px) { + + #archives { + margin-top: -1rem; + } + + #archives ul { + letter-spacing: 0; + } +} diff --git a/assets/css/categories.scss b/assets/css/categories.scss new file mode 100644 index 0000000..5b02295 --- /dev/null +++ b/assets/css/categories.scss @@ -0,0 +1,57 @@ +--- +--- +/*! + Style for Tab Categories + © 2019 Cotes Chung + MIT License +*/ + +.categories { + margin-bottom: 2rem; +} + +.categories .card-header { + padding-right: 12px; +} + +.categories .card-header>span>i:first-child, +.categories .list-group-item>i { + color: gray; +} + +.categories .list-group-item { + border-left: none; + border-right: none; + padding-left: 2rem; +} + +.categories .collapsing .list-group-item:first-child, +.categories .collapse .list-group-item:first-child { + border-top-left-radius: 0; + border-top-right-radius: 0; +} + +.categories i.far, +.categories i.fas { // fontawesome icons + font-size: 86%; +} + +.category-trigger { + width: 1.7rem; + height: 1.7rem; + border-radius: 50%; + text-align: center; + color: #6c757d!important; +} + +@media (hover: hover) { // only works on desktop + .category-trigger:hover { + background-color: #e9ecef; + } +} + +.category-trigger>i.fas.fa-angle-up { + position: relative; + bottom: 8%; + transition: 300ms ease all; +} \ No newline at end of file diff --git a/assets/css/category-tag.scss b/assets/css/category-tag.scss new file mode 100644 index 0000000..0ae01fe --- /dev/null +++ b/assets/css/category-tag.scss @@ -0,0 +1,64 @@ +--- +--- +/*! + Style for page Category and Tag + © 2019 Cotes Chung + MIT License +*/ + +#page-category ul>li, +#page-tag ul>li { + line-height: 1.5rem; + padding: .6rem 0; +} + +#page-category ul>li::before, +#page-tag ul>li::before { + background: #999; + width: 5px; + height: 5px; + border-radius: 50%; + display: block; + content: ""; + position: relative; + top: .6rem; + margin-right: .5rem; +} + +#page-tag ul>li>a, +#page-category ul>li>a, { /* post's title */ + font-size: 1.1rem; +} + +#page-category ul>li>span:last-child, +#page-tag ul>li>span:last-child { /* post's date */ + white-space: nowrap; +} + +#page-tag h1>i { // tag icon + font-size: 1.2rem; +} + +#page-category h1>i { + font-size: 1.25rem; +} + +#page-category a:hover, +#page-tag a:hover, +#access-lastmod a:hover { + margin-bottom: -1px; // Avoid jumping +} + +.dash { + margin: 0 .5rem .6rem .5rem; + border-bottom: 2px dotted silver; +} + +@media all and (max-width: 576px) { + #page-tag ul>li>a, + #page-category ul>li>a { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } +} \ No newline at end of file diff --git a/assets/css/home.scss b/assets/css/home.scss new file mode 100644 index 0000000..4471cb2 --- /dev/null +++ b/assets/css/home.scss @@ -0,0 +1,115 @@ +--- +--- + +/*! + Style for Homepage + © 2019 Cotes Chung + MIT License +*/ + +#post-list { + margin-top: 1rem; + padding-right: .5rem; +} + +.pagination { + font-size: 1rem; +} + +.pagination a:hover { + text-decoration: none; +} + +.post-preview { + padding-top: 1.5rem; + padding-bottom: 1rem; + border-bottom: 1px solid rgba(158, 158, 158, 0.17); +} + +.post-preview>h1 { + font-size: 1.4rem; + margin: 0; +} + +.post-preview i.far { + /* fontawesome icons */ + font-size: 86%; +} + +.post-preview .post-content { + margin-top: .6rem; + margin-bottom: .6rem; + color: dimgray; +} + +/* Make preview shorter in Home page*/ +.post-preview .post-content>p { + margin: 0; + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; +} + +.page-item .page-link { + color: #555555; + width: 2.5rem; + height: 2.5rem; + padding: 0; + text-align: center; + display: -webkit-box; + display: flex; + -webkit-box-pack: center; + justify-content: center; + -webkit-box-align: center; + align-items: center; + border-radius: 50%; + border: 1px solid #f1f1f1; + font-family: 'Lato', sans-serif; +} + +.page-item.active .page-link { + background-color: #2a408e; + box-shadow: 0 0 8px 0 #4b92d2 !important; + color: #f8f8f8; +} + +.page-item.disabled .page-link { + color: rgba(108, 117, 125, 0.57); + border-color: #f1f1f1; +} + +.page-item.disabled { + cursor: not-allowed; +} + +.page-item:first-child .page-link, +.page-item:last-child .page-link { + border-radius: 50%; +} + +.page-item:not(:last-child) { + margin-right: 0.6rem; +} + +#post-list .post-meta i:not(:first-child) { // post-meta icons on HOME + margin-left: 1.5rem; +} + +@media all and (max-width: 576px) { + #post-list .post-meta>span i:not(:first-child) { + margin-left: 1rem; + } +} + +/* Pannel hidden */ +@media all and (max-width: 1200px) { + #post-list { + padding-right: 0; + } + + .pagination { + justify-content: center; + } +} \ No newline at end of file diff --git a/assets/css/_src/main.scss b/assets/css/main.scss similarity index 72% rename from assets/css/_src/main.scss rename to assets/css/main.scss index 60e0b17..6fae46b 100644 --- a/assets/css/_src/main.scss +++ b/assets/css/main.scss @@ -1,9 +1,16 @@ +--- +--- + /*! * The main styles. * © 2018-2019 Cotes Chung * MIT Licensed */ +@import "_typograph/syntax"; +@import "_typograph/fonts"; + + html, body { height: 100%; font-size: 16px; @@ -657,95 +664,6 @@ table tbody td { font-size: 95%; } - -/*--- Home page ---*/ - -#post-list { - margin-top: 1rem; - padding-right: .5rem; -} - -.pagination { - font-size: 1rem; -} - -.pagination a:hover { - text-decoration: none; -} - -.post-preview { - padding-top: 1.5rem; - padding-bottom: 1rem; - border-bottom: 1px solid rgba(158, 158, 158, 0.17); -} - -.post-preview>h1 { - font-size: 1.4rem; - margin: 0; -} - -.post-preview i.far { - /* fontawesome icons */ - font-size: 86%; -} - -.post-preview .post-content { - margin-top: .6rem; - margin-bottom: .6rem; - color: dimgray; -} - -/* Make preview shorter in Home page*/ -.post-preview .post-content>p { - margin: 0; - overflow: hidden; - text-overflow: ellipsis; - display: -webkit-box; - -webkit-line-clamp: 2; - -webkit-box-orient: vertical; -} - -.page-item .page-link { - color: #555555; - width: 2.5rem; - height: 2.5rem; - padding: 0; - text-align: center; - display: -webkit-box; - display: flex; - -webkit-box-pack: center; - justify-content: center; - -webkit-box-align: center; - align-items: center; - border-radius: 50%; - border: 1px solid #f1f1f1; - font-family: 'Lato', sans-serif; -} - -.page-item.active .page-link { - background-color: #2a408e; - box-shadow: 0 0 8px 0 #4b92d2 !important; - color: #f8f8f8; -} - -.page-item.disabled .page-link { - color: rgba(108, 117, 125, 0.57); - border-color: #f1f1f1; -} - -.page-item.disabled { - cursor: not-allowed; -} - -.page-item:first-child .page-link, -.page-item:last-child .page-link { - border-radius: 50%; -} - -.page-item:not(:last-child) { - margin-right: 0.6rem; -} - /*--- post ---*/ .post-meta { @@ -770,10 +688,6 @@ table tbody td { word-wrap: break-word; } -#post-list .post-meta i:not(:first-child) { // post-meta icons on HOME - margin-left: 1.5rem; -} - .post-tail { margin-top: 3.5rem; border-bottom: 1px double #e9ecef; @@ -832,362 +746,6 @@ table tbody td { filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.08)); } -#toc-wrap { - border-left: 1px solid rgba(158, 158, 158, 0.17); - position: -webkit-sticky; - position: sticky; - top: 2rem; - transition: top 0.2s ease-in-out; -} - -#toc-wrap.topbar-down { - top: 6rem; -} - -#toc-wrap>h3 { - font-size: 1rem; - font-family: 'Oswald', sans-serif; - color: gray; -} - -#toc li>a { - padding-top: 0; -} - - -/*--- Related Posts ---*/ - -#related-posts { - border-bottom: 1px double #e9ecef; -} - -#related-posts>h3 { - color: gray; - font-size: 1.1rem; - font-family: 'Oswald', sans-serif; -} - -#related-posts .card { - border: 1px solid #f1f1f1; - box-shadow: 0 0 5px 0 rgba(234, 234, 234, 0.7686274509803922); - -webkit-transition: all .3s ease-in-out;; - -moz-transition: all .3s ease-in-out;; - transition: all .3s ease-in-out; -} - -#related-posts .card:hover { - -webkit-transform: translate3d(0, -8px, 0); - transform: translate3d(0, -8px, 0); -} - -#related-posts .card h3 { - color: #353a3d; -} - -#related-posts .timeago { - color: rgba(30,55,70,.4); -} - -#related-posts p { - font-size: .9rem; - margin-bottom: .5rem; - overflow: hidden; - text-overflow: ellipsis; - display: -webkit-box; - -webkit-line-clamp: 2; - -webkit-box-orient: vertical; -} - -#related-posts a:hover { - text-decoration: none; -} - -#related-posts ul { - list-style-type: none; - padding-inline-start: 1.5rem; -} - -#related-posts ul>li::before { - background: #c2c9d4; - width: 5px; - height: 5px; - border-radius: 1px; - display: block; - content: ""; - position: relative; - top: 1rem; - right: 1rem; -} - - -/*--- Tab Categories ---*/ - -.categories { - margin-bottom: 2rem; -} - -.categories .card-header { - padding-right: 12px; -} - -.categories .card-header>span>i:first-child, -.categories .list-group-item>i { - color: gray; -} - -.categories .list-group-item { - border-left: none; - border-right: none; - padding-left: 2rem; -} - -.categories .collapsing .list-group-item:first-child, -.categories .collapse .list-group-item:first-child { - border-top-left-radius: 0; - border-top-right-radius: 0; -} - -.categories i.far, -.categories i.fas { // fontawesome icons - font-size: 86%; -} - -.category-trigger { - width: 1.7rem; - height: 1.7rem; - border-radius: 50%; - text-align: center; - color: #6c757d!important; -} - -@media (hover: hover) { // only works on desktop - .category-trigger:hover { - background-color: #e9ecef; - } -} - -.category-trigger>i.fas.fa-angle-up { - position: relative; - bottom: 8%; - transition: 300ms ease all; -} - -.disabled { - color: rgb(206, 196, 196); - pointer-events: auto; - cursor: not-allowed; -} - -.hide-border-bottom { - border-bottom: none!important; -} - - -/*--- Tab Tags and Tag-Page ---*/ - -.tag { - border-radius: 0.7em; - padding: 6px 8px 7px; - margin-right: .8rem; - line-height: 3rem; - letter-spacing: 0; - border: 1px solid #dee2e6 !important; - box-shadow: 0 0 3px 0 #e9ecef; -} - -.tag span { - margin-left: 0.6em; - font-size: 0.7em; - font-family: 'Oswald', sans-serif; -} - -a.tag:hover { - text-decoration: none; -} - -/*--- Tab Archives --*/ - -#archives { - letter-spacing: 0.03rem; -} - -#archives li { - font-size: 1.1rem; - line-height: 3rem; -} - -#archives li:nth-child(odd) { - background-color: #fff; - background-image: linear-gradient(to left, #fff, #fbfbfb, #fbfbfb, #fbfbfb, #fff); -} - -#archives li>div { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; -} - -#archives span.lead { - font-size: 1.5rem; - font-family: 'Oswald', sans-serif; - position: relative; - left: 8px; -} - -#archives span.lead:not(:first-child) { - position: relative; - left: 4px; -} - -#archives span.lead:not(:first-child)::after { - left: 67px; -} - -#archives span.lead::after { /* Year dot */ - content: ""; - display: block; - position: relative; - -webkit-border-radius: 50%; - -moz-border-radius: 50%; - border-radius: 50%; - width: 12px; - height: 12px; - top: -26px; - left: 63px; - border: 3px solid; - background-color: #ffffff; - border-color: #c2c6cc; - box-shadow: 0 0 2px 0 #c2c6cc; - z-index: 1; -} - -#archives .date { - white-space: nowrap; - display: inline-block; -} - -#archives .date.month { - width: 1.4rem; - text-align: center; - font-family: 'Oswald', sans-serif; -} - -#archives .date.day { - font-size: 85%; - font-family: sans-serif; - text-align: center; - margin-right: -2px; - width: 1.2rem; - position: relative; - left: -.15rem; -} - -#archives ul>li>div>a { -/* post title in Archvies */ - margin-left: 2.5rem; - position: relative; - top: .1rem; -} - -#archives .date.month ~ a::before { - /* A dot for Month and Day */ - content: ""; - display: inline-block; - position: relative; - -webkit-border-radius: 50%; - -moz-border-radius: 50%; - border-radius: 50%; - width: 8px; - height: 8px; - float: left; - top: 1.35rem; - left: 69px; - background-color: #c2c6cc; - box-shadow: 0 0 3px 0 #c2c6cc; - z-index: 1; -} - -/* timeline for date */ -#archives ul>li::after, -#archives ul>li:first-child::before { - content: ""; - width: 4px; - left: 75px; - display: inline-block; - float: left; - position: relative; - background-color: rgba(0, 0, 0, 0.075); -} - -#archives ul>li::after { - height: 2.8rem; - top: -1.3rem; -} - -#archives ul>li:first-child::before { - height: 3.06rem; - top: -1.61rem; -} - -#archives ul:not(:last-child)>li:last-child::after { - height: 3.4rem; -} - -#archives ul:last-child>li:last-child::after { - display: none; -} - - -/*--- Page Category and Tag ---*/ - -#page-category ul>li, -#page-tag ul>li { - line-height: 1.5rem; - padding: .6rem 0; -} - -#page-category ul>li::before, -#page-tag ul>li::before { - background: #999; - width: 5px; - height: 5px; - border-radius: 50%; - display: block; - content: ""; - position: relative; - top: .6rem; - margin-right: .5rem; -} - -#page-tag ul>li>a, -#page-category ul>li>a, { /* post's title */ - font-size: 1.1rem; -} - -#page-category ul>li>span:last-child, -#page-tag ul>li>span:last-child { /* post's date */ - white-space: nowrap; -} - -#page-tag h1>i { // tag icon - font-size: 1.2rem; -} - -#page-category h1>i { - font-size: 1.25rem; -} - -#page-category a:hover, -#page-tag a:hover, -#access-lastmod a:hover { - margin-bottom: -1px; // Avoid jumping -} - -.dash { - margin: 0 .5rem .6rem .5rem; - border-bottom: 2px dotted silver; -} - /* --- Effects classes --- */ @@ -1232,6 +790,16 @@ div.tooltip-inner { /* Overrided BS4 Tooltip */ max-width: 220px; } +.disabled { + color: rgb(206, 196, 196); + pointer-events: auto; + cursor: not-allowed; +} + +.hide-border-bottom { + border-bottom: none!important; +} + /*--- Responsive Design ---*/ @@ -1260,10 +828,6 @@ div.tooltip-inner { /* Overrided BS4 Tooltip */ font-size: 1.55rem; } - #post-list .post-meta>span i:not(:first-child) { - margin-left: 1rem; - } - .post-content { font-size: 1.08rem; } @@ -1275,21 +839,6 @@ div.tooltip-inner { /* Overrided BS4 Tooltip */ word-wrap: break-word; } - #archives { - margin-top: -1rem; - } - - #archives ul { - letter-spacing: 0; - } - - #page-tag ul>li>a, - #page-category ul>li>a { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } - /* footer and #main-wrap expand vertical */ footer { height: 10rem; @@ -1520,14 +1069,6 @@ div.tooltip-inner { /* Overrided BS4 Tooltip */ display: none; } - #post-list { - padding-right: 0; - } - - .pagination { - justify-content: center; - } - #topbar-main { padding: 0; } @@ -1694,4 +1235,4 @@ div.tooltip-inner { /* Overrided BS4 Tooltip */ width: 88%; } -} +} \ No newline at end of file diff --git a/assets/css/post.scss b/assets/css/post.scss new file mode 100644 index 0000000..0f60a49 --- /dev/null +++ b/assets/css/post.scss @@ -0,0 +1,95 @@ +--- +--- + +/*! + Individual styles for Post + © 2019 Cotes Chung + MIT License +*/ + +#toc-wrap { + border-left: 1px solid rgba(158, 158, 158, 0.17); + position: -webkit-sticky; + position: sticky; + top: 2rem; + transition: top 0.2s ease-in-out; +} + +#toc-wrap.topbar-down { + top: 6rem; +} + +#toc-wrap>h3 { + font-size: 1rem; + font-family: 'Oswald', sans-serif; + color: gray; +} + +#toc li>a { + padding-top: 0; +} + + +/*--- Related Posts ---*/ + +#related-posts { + border-bottom: 1px double #e9ecef; +} + +#related-posts>h3 { + color: gray; + font-size: 1.1rem; + font-family: 'Oswald', sans-serif; +} + +#related-posts .card { + border: 1px solid #f1f1f1; + box-shadow: 0 0 5px 0 rgba(234, 234, 234, 0.7686274509803922); + -webkit-transition: all .3s ease-in-out;; + -moz-transition: all .3s ease-in-out;; + transition: all .3s ease-in-out; +} + +#related-posts .card:hover { + -webkit-transform: translate3d(0, -8px, 0); + transform: translate3d(0, -8px, 0); +} + +#related-posts .card h3 { + color: #353a3d; +} + +#related-posts .timeago { + color: rgba(30,55,70,.4); +} + +#related-posts p { + font-size: .9rem; + margin-bottom: .5rem; + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; +} + +#related-posts a:hover { + text-decoration: none; +} + +#related-posts ul { + list-style-type: none; + padding-inline-start: 1.5rem; +} + +#related-posts ul>li::before { + background: #c2c9d4; + width: 5px; + height: 5px; + border-radius: 1px; + display: block; + content: ""; + position: relative; + top: 1rem; + right: 1rem; +} \ No newline at end of file diff --git a/assets/css/styles.scss b/assets/css/styles.scss deleted file mode 100644 index 354a8b1..0000000 --- a/assets/css/styles.scss +++ /dev/null @@ -1,9 +0,0 @@ ---- -# Aggregation of CSS files. -# © 2018-2019 Cotes Chung -# MIT License ---- - -@import "_src/main"; -@import "_src/syntax"; -@import "_src/fonts"; \ No newline at end of file diff --git a/assets/css/tags.scss b/assets/css/tags.scss new file mode 100644 index 0000000..592108e --- /dev/null +++ b/assets/css/tags.scss @@ -0,0 +1,28 @@ +--- +--- + +/*! + Styles for Tab Tags + © 2019 Cotes Chung + MIT License +*/ + +.tag { + border-radius: 0.7em; + padding: 6px 8px 7px; + margin-right: .8rem; + line-height: 3rem; + letter-spacing: 0; + border: 1px solid #dee2e6 !important; + box-shadow: 0 0 3px 0 #e9ecef; +} + +.tag span { + margin-left: 0.6em; + font-size: 0.7em; + font-family: 'Oswald', sans-serif; +} + +a.tag:hover { + text-decoration: none; +} \ No newline at end of file