diff --git a/_sass/addon/module.scss b/_sass/addon/module.scss index 64dc4a5..603554a 100644 --- a/_sass/addon/module.scss +++ b/_sass/addon/module.scss @@ -92,7 +92,7 @@ } %rounded { - border-radius: 6px; + border-radius: $base-radius; } %img-caption { diff --git a/_sass/addon/variables.scss b/_sass/addon/variables.scss index 7b1ae11..bc6f866 100644 --- a/_sass/addon/variables.scss +++ b/_sass/addon/variables.scss @@ -23,7 +23,7 @@ $footer-height: 5rem !default; $footer-height-mobile: 6rem !default; /* screen width: <= 576px */ $main-content-max-width: 1250px !default; $bottom-min-height: 35rem !default; -$card-radius: 0.5rem; +$base-radius: 0.5rem; /* syntax highlight */ diff --git a/_sass/jekyll-theme-chirpy.scss b/_sass/jekyll-theme-chirpy.scss index 1424a57..c72e4c3 100644 --- a/_sass/jekyll-theme-chirpy.scss +++ b/_sass/jekyll-theme-chirpy.scss @@ -6,19 +6,16 @@ * MIT Licensed */ -@import - "colors/light-typography", - "colors/dark-typography", - - "addon/variables", - "variables-hook", - "addon/module", - "addon/syntax", - "addon/commons", - - "layout/home", - "layout/post", - "layout/tags", - "layout/archives", - "layout/categories", - "layout/category-tag"; +@import 'colors/light-typography'; +@import 'colors/dark-typography'; +@import 'addon/variables'; +@import 'variables-hook'; +@import 'addon/module'; +@import 'addon/syntax'; +@import 'addon/commons'; +@import 'layout/home'; +@import 'layout/post'; +@import 'layout/tags'; +@import 'layout/archives'; +@import 'layout/categories'; +@import 'layout/category-tag'; diff --git a/_sass/layout/categories.scss b/_sass/layout/categories.scss index 31c8e8e..574f624 100644 --- a/_sass/layout/categories.scss +++ b/_sass/layout/categories.scss @@ -9,8 +9,14 @@ .categories { margin-bottom: 2rem; + &.card, + .list-group { + @extend %rounded; + } + .card-header { padding-right: 12px; + border-radius: $base-radius $base-radius 0 0; } i { @@ -42,9 +48,7 @@ position: relative; height: 0.7rem; width: 1rem; - transition: -webkit-transform 300ms ease; transition: transform 300ms ease; - transition: transform 300ms ease, -webkit-transform 300ms ease; } &:hover { @@ -62,6 +66,5 @@ } .rotate { - -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } diff --git a/_sass/layout/home.scss b/_sass/layout/home.scss index 1ebf312..801ec55 100644 --- a/_sass/layout/home.scss +++ b/_sass/layout/home.scss @@ -19,7 +19,7 @@ .card { %img-radius { - border-radius: $card-radius $card-radius 0 0; + border-radius: $base-radius $base-radius 0 0; } .preview-img { @@ -146,7 +146,7 @@ @media all and (min-width: 768px) { #post-list { %img-radius { - border-radius: 0 $card-radius $card-radius 0; + border-radius: 0 $base-radius $base-radius 0; } .card { diff --git a/_sass/layout/post.scss b/_sass/layout/post.scss index 3e29d34..203c69c 100644 --- a/_sass/layout/post.scss +++ b/_sass/layout/post.scss @@ -205,12 +205,12 @@ h1 + .post-meta { } &:first-child { - border-radius: $card-radius 0 0 $card-radius; + border-radius: $base-radius 0 0 $base-radius; left: 0.5px; } &:last-child { - border-radius: 0 $card-radius $card-radius 0; + border-radius: 0 $base-radius $base-radius 0; right: 0.5px; } }