diff --git a/README.md b/README.md index e29cb38..b7ebcb1 100644 --- a/README.md +++ b/README.md @@ -133,7 +133,6 @@ hasCJKLanguage = true summaryLength = 70 -googleAnalytics = "" copyright = "©{year}, All Rights Reserved" timeout = 10000 enableEmoji = true @@ -216,12 +215,12 @@ You shoud make your own menu. ```bash logoText = "Zzo" description = "The Zzo theme for Hugo example site." -custom_css = ["css/custom.css", "css/custom.css"] -custom_js = ["js/custom.js"] +custom_css = [] +custom_js = [] # header homeHeaderType = "slide" # text, img, slide -swiperCount = 3 # only works homeHeaderType = slide +swiperCount = 3 # only works when homeHeaderType = slide # body enableBreadcrumb = true @@ -231,9 +230,18 @@ enableMark = true enableGoToTop = true enableWhoami = true summaryShape = "card" # card, classic, compact -archiveGroupByDate = "2006-01" # "2006-01": group by month, "2006": group by year +archiveGroupByDate = "2006" # "2006-01": group by month, "2006": group by year +archivePaginate = 20 +paginateWindow = 1 + +# whoami myname = "zzossig" -whoami = "Let me introduce my self" +email = "zzossig@gmail.com" +whoami = "Web Developer" +useGravatar = false +location = "Seoul, Korea" +organization = "Hugo" +link = "https://github.com/zzossig/hugo-theme-zzo" # sidebar enableBio = true @@ -586,13 +594,15 @@ This project use swiper library for slider header component. ```toml data/grid.toml example -grid_max_width = "960px" +grid_max_width = "960" +grid_max_unit = "px" # "px", "\"%\"" Using% is limited to using full width. grid_main_main_width = "5" -grid_main_main_unit = "fr" +grid_main_main_unit = "fr" # "fr", "px" grid_main_side_width = "2" -grid_main_side_unit = "fr" -grid_navbar_height = "50px" -grid_column_gap = "1.5rem" +grid_main_side_unit = "fr" # "fr", "px" +grid_column_gap_width = "32" +grid_column_gap_unit = "px" # "px" +grid_navbar_height = "50px" # "px" grid_row_gap = "0" ``` diff --git a/assets/sass/abstracts/_functions.scss b/assets/sass/abstracts/_functions.scss index 6307e63..e9af098 100644 --- a/assets/sass/abstracts/_functions.scss +++ b/assets/sass/abstracts/_functions.scss @@ -13,5 +13,22 @@ } @function themed($key) { - @return map-get($theme-map, $key); + @return map-get($theme-map, $key); +} + +@function calcSideWidth() { + $grid_max: $grid_max_width + $grid_max_unit; + $grid_main_main: $grid_main_main_width + $grid_main_main_unit; + $grid_main_side: $grid_main_side_width + $grid_main_side_unit; + $grid_column_gap: $grid_column_gap_width + $grid_column_gap_unit; + + @if $grid_main_main_unit == fr and $grid_main_side_unit == fr { + @if $grid_max_unit == px { + @return #{($grid_main_side_width / ($grid_main_main_width + $grid_main_side_width)) * $grid_max_width - $grid_column_gap_width}px; + } @else if $grid_max_unit == "%" { + @return ($grid_main_side_width / ($grid_main_main_width + $grid_main_side_width) * 100)*1%; + } + } @else if $grid_main_side_unit == px { + @return $grid_main_side; + } } \ No newline at end of file diff --git a/assets/sass/base/_helpers.scss b/assets/sass/base/_helpers.scss index 8679b8b..296c32e 100644 --- a/assets/sass/base/_helpers.scss +++ b/assets/sass/base/_helpers.scss @@ -59,4 +59,4 @@ .hide { display: none; -} \ No newline at end of file +} diff --git a/assets/sass/base/_reset.scss b/assets/sass/base/_reset.scss index f79621f..2d9190d 100644 --- a/assets/sass/base/_reset.scss +++ b/assets/sass/base/_reset.scss @@ -70,6 +70,10 @@ ul { list-style: none; } +hr { + border: 0; +} + // Form button, input, diff --git a/assets/sass/components/_bio.scss b/assets/sass/components/_bio.scss index 2dc8f78..bbf4f77 100644 --- a/assets/sass/components/_bio.scss +++ b/assets/sass/components/_bio.scss @@ -1,42 +1,74 @@ .bio { @include flexbox(); @include justify-content(center); - @include align-items(center); + @include align-items(flex-start); @include flex-direction(column); width: 100%; - max-width: 200px; font-family: 'Montserrat', sans-serif; &__photo { - width: 100%; - height: 100%; + border-radius: 0.25rem; + @include box-shadow(0, 8px, 6px, -6px, black); - &-wrapper { - width: 128px; - height: 128px; - border-radius: 100%; - overflow: hidden; - margin: 1rem; - @include themify($themes) { - background-color: themed(''); - } + &-wrapper { + width: 100%; + height: 100%; + border-radius: 0.25rem; + margin: 1rem auto; + @include flexbox(); + @include align-items(center); + @include justify-content(center); + @include themify($themes) { + background-color: themed('avatar-background-color'); } + } } &__name { font-weight: 700; letter-spacing: 1px; font-family: inherit; + font-size: 26px; } &__desc { margin: 0.5rem 0; - text-align: center; + font-size: 14px; + } + + &__info { + font-size: 14px; + @include flexbox(); + @include align-items(center); + @include justify-content(center); + + &--icon { + margin-right: 0.25rem; + @include themify($themes) { + color: themed('social-icon-color'); + } + } + + a { + padding-right: 1rem; + @include truncate(calcSideWidth()); + } } &__social { - a { + width: 100%; + margin-top: 0.5rem; + + @include flexbox(); + a { text-decoration: none !important; + width: 100%; + padding: 0.5rem; + border-radius: 0.125rem; + + @include flexbox(); + @include align-items(center); + @include justify-content(space-around); @include themify($themes) { color: themed('social-icon-color'); @include on-event { @@ -45,4 +77,8 @@ } } } + + &__hr { + margin: 1rem 0; + } } \ No newline at end of file diff --git a/assets/sass/components/_features.scss b/assets/sass/components/_features.scss index b242d25..dc85fac 100644 --- a/assets/sass/components/_features.scss +++ b/assets/sass/components/_features.scss @@ -1,14 +1,20 @@ .features { max-width: $grid-max-width; + height: 200px; font-family: 'Montserrat', sans-serif; - padding: 1rem; - margin: 0 4rem; + padding: 0.5rem; + margin: 0 4rem; + + @include flexbox(); + @include flex-direction(column); + @include align-items(center); + @include justify-content(center); @include respond-to(sm) { margin: 0 1rem; } &__title { - font-size: 45px; + font-size: 32px; font-weight: 700; } @@ -20,7 +26,8 @@ li { padding: 0.125rem 0.5rem; - width: 43%; + width: 30%; + font-size: 16px; @include truncate(350px); &::before { @@ -32,12 +39,12 @@ .features-text { max-width: $grid-max-width; - height: 100%; + height: 200px; + padding: 0.5rem; + margin: 0 4rem; + text-align: center; font-family: 'Montserrat', sans-serif; - font-size: 45px; font-weight: 700; - padding-bottom: 3.2rem; - margin: 0 4rem; @include flexbox(); @include flex-direction(column); @@ -51,66 +58,35 @@ .features-intro { max-width: $grid-max-width; - margin-right: auto; - margin-left: auto; - height: 100%; - margin: 2rem 8rem; + height: 200px; + padding: 0.5rem; + margin: 0 4rem; + text-align: center; + font-family: 'Montserrat', sans-serif; + @include flexbox(); + @include flex-direction(column); + @include align-items(center); + @include justify-content(center); @include respond-to(sm) { margin: 1rem; } - &__logo { - width: 140px; - height: 140px; - border-radius: 100%; - margin: 0 auto; - display: block; - float: left; - transform-style: preserve-3d; - &-img { - width: 100%; - height: 100%; - } + &__title { + font-weight: 700; + line-height: 1; + margin-bottom: 1.5rem; } - &__titles { - margin-left: 160px; - text-align: left; - position: relative; - - .title { - margin: 25px 0 0; - font-family: 'Montserrat', sans-serif; - font-size: 65px; - font-weight: 700; - line-height: 1; - } - - .subtitle { - font-family: 'Montserrat', sans-serif; - font-size: 44px; - margin: 10px 0 40px 0; - font-weight: 700; - line-height: 1.2; - } - } - - &__links { - margin: 20px 0; - text-align: left; - font-size: 16px; - font-weight: 400; - + &__links { a { - margin-right: 0.4rem; + padding: 0.4rem; + font-size: 16px; } } &__release-info { - margin: 20px 160px 0; - font-weight: 400; - text-align: left; - font-size: 12px; + margin-top: 0.25rem; + font-size: 11px; } } \ No newline at end of file diff --git a/assets/sass/components/_gtt.scss b/assets/sass/components/_gtt.scss index e779bd8..af1e7d2 100644 --- a/assets/sass/components/_gtt.scss +++ b/assets/sass/components/_gtt.scss @@ -1,17 +1,17 @@ .gtt { - position: fixed; + position: absolute; right: 0.5rem; bottom: 0.5rem; width: 40px; height: 40px; - border-radius: 50%; + border-radius: 50%; cursor: pointer; @include flexbox(); @include align-items(center); @include justify-content(center); @include themify($themes) { - color: themed('gtt-color'); + color: themed('gtt-color'); background-color: themed('gtt-background-color'); @include on-event { diff --git a/assets/sass/components/_hr.scss b/assets/sass/components/_hr.scss new file mode 100644 index 0000000..23f636c --- /dev/null +++ b/assets/sass/components/_hr.scss @@ -0,0 +1,22 @@ +.fade-1 { + height: 1px; + $color: #595B5C; + color: $color; + background-image: linear-gradient( + 90deg, + rgba($color, 0), + rgba($color, 1) 50%, + rgba($color, 0) 100%); +} + +.fade-2 { + border-width: 0 0 1px; + $color: #595B5C; + color: $color; + border-image: linear-gradient( + 90deg, + rgba($color, 0), + rgba($color, 1) 50%, + rgba($color, 0) 100%) 0 0 100%; + border-style: solid; +} \ No newline at end of file diff --git a/assets/sass/components/_pagination.scss b/assets/sass/components/_pagination.scss index 5a849bf..5bb352e 100644 --- a/assets/sass/components/_pagination.scss +++ b/assets/sass/components/_pagination.scss @@ -1,3 +1,55 @@ +.pagination { + border-radius: 0.25rem; + margin: 2rem 1rem; + padding: 0.5rem 0; + + @include flexbox(); + @include align-items(center); + @include justify-content(center); + @include themify($themes) { + background-color: themed('pagination-background-color'); + } + + li { + border-radius: 0.25rem; + &.disabled { + a { + @include on-event { + @include themify($themes) { + color: themed('pagination-number-color'); + text-decoration: none; + } + } + } + } + + &.active { + a { + @include themify($themes) { + color: themed('link-hover'); + } + } + } + } + + a { + font-size: 1.25rem; + padding: 0.5rem 0.75rem; + @include themify($themes) { + color: themed('pagination-number-color'); + @include on-event { + color: themed('link-hover'); + } + } + } + + .active { + @include themify($themes) { + background-color: themed('pagination-background-color'); + } + } +} + .pagination-single { @include flexbox(); @include align-items(center); @@ -61,7 +113,7 @@ @include flexbox(); @include align-items(center); - @include justify-content(space-around); + @include justify-content(space-around); @include themify($themes) { background-color: themed('pagination-background-color'); } diff --git a/assets/sass/components/_summary.scss b/assets/sass/components/_summary.scss index f9d4ca6..25ebb8f 100644 --- a/assets/sass/components/_summary.scss +++ b/assets/sass/components/_summary.scss @@ -1,5 +1,7 @@ .summary-card { - padding: 0 1rem; + margin: 0 0.5rem; + padding: 0 0.5rem; + .title { a { font-family: $summary_title_font; diff --git a/assets/sass/components/_swiper.scss b/assets/sass/components/_swiper.scss index 9345947..615fa4e 100644 --- a/assets/sass/components/_swiper.scss +++ b/assets/sass/components/_swiper.scss @@ -2,7 +2,6 @@ background-color: transparent; width: 100%; height: auto; - min-height: 300px; } .swiper-slide { diff --git a/assets/sass/components/_taxo.scss b/assets/sass/components/_taxo.scss index b129774..e757288 100644 --- a/assets/sass/components/_taxo.scss +++ b/assets/sass/components/_taxo.scss @@ -3,6 +3,14 @@ margin: 2.5rem 0; z-index: z('taxo'); + &-root { + position: sticky; + top: $grid_navbar_height; + @include themify($themes) { + background-color: themed('body-background-color'); + } + } + &__title { font-weight: 700; font-family: $taxo_titie_font; diff --git a/assets/sass/components/_toc.scss b/assets/sass/components/_toc.scss index f3ec050..c873807 100644 --- a/assets/sass/components/_toc.scss +++ b/assets/sass/components/_toc.scss @@ -1,6 +1,6 @@ .toc { width: 100%; - max-width: 250px; + max-width: calcSideWidth(); position: fixed; top: 7rem; font-size: 0.85rem; @@ -54,7 +54,7 @@ } a { - color: themed('toc-title-color'); + color: themed('toc-title-color'); &.active { color: themed('toc-vertical-line-active'); } diff --git a/assets/sass/layout/_footer.scss b/assets/sass/layout/_footer.scss index 1753d7e..1d56566 100644 --- a/assets/sass/layout/_footer.scss +++ b/assets/sass/layout/_footer.scss @@ -1,5 +1,6 @@ .footer { padding: 0 0.5rem; + position: relative; @include themify($themes) { color: themed('footer-color'); diff --git a/assets/sass/layout/_grid.scss b/assets/sass/layout/_grid.scss index 9f8a6f9..42e61c8 100644 --- a/assets/sass/layout/_grid.scss +++ b/assets/sass/layout/_grid.scss @@ -1,14 +1,19 @@ +$grid_max: $grid_max_width + $grid_max_unit; $grid_main_main: $grid_main_main_width + $grid_main_main_unit; $grid_main_side: $grid_main_side_width + $grid_main_side_unit; +$grid_column_gap: $grid_column_gap_width + $grid_column_gap_unit; .wrapper { display: grid; - max-width: $grid_max_width; + max-width: $grid_max; justify-content: center; - grid-template-columns: minmax(350px, $grid_main_main) minmax(0PX, $grid_main_side); + grid-template-columns: minmax(350px, $grid_main_main) minmax(calcSideWidth(), $grid_main_side); grid-template-rows: $grid_navbar_height auto 1fr auto; grid-column-gap: $grid_column_gap; grid-row-gap: $grid_row_gap; + @include respond-to(sm) { + grid-template-columns: minmax(350px, $grid_main_main) minmax(0, $grid_main_side); + } } .header-main { diff --git a/assets/sass/layout/_sidebar.scss b/assets/sass/layout/_sidebar.scss index 7e3c39b..077d70f 100644 --- a/assets/sass/layout/_sidebar.scss +++ b/assets/sass/layout/_sidebar.scss @@ -61,4 +61,8 @@ } } } + + &-hr { + margin: 1.5rem 0; + } } \ No newline at end of file diff --git a/assets/sass/main.scss b/assets/sass/main.scss index 64d00a6..586a17d 100644 --- a/assets/sass/main.scss +++ b/assets/sass/main.scss @@ -4,12 +4,14 @@ {{- $scr := .Scratch -}} $grid_max_width: {{ $scr.Get "grid_max_width" }}; +$grid_max_unit: {{ $scr.Get "grid_max_unit" }}; $grid_main_main_width: {{ $scr.Get "grid_main_main_width" }}; $grid_main_main_unit: {{ $scr.Get "grid_main_main_unit" }}; $grid_main_side_width: {{ $scr.Get "grid_main_side_width" }}; $grid_main_side_unit: {{ $scr.Get "grid_main_side_unit" }}; +$grid_column_gap_width: {{ $scr.Get "grid_column_gap_width" }}; +$grid_column_gap_unit: {{ $scr.Get "grid_column_gap_unit" }}; $grid_navbar_height: {{ $scr.Get "grid_navbar_height" }}; -$grid_column_gap: {{ $scr.Get "grid_column_gap" }}; $grid_row_gap: {{ $scr.Get "grid_row_gap" }}; $search_placeholder_font: {{ $scr.Get "search_placeholder" }}; @@ -129,6 +131,7 @@ $subs_button_background_color: {{ $scr.Get "subs_button_background_color" }}; $subs_button_hover_background_color: {{ $scr.Get "subs_button_hover_background_color" }}; $gallery_mask_color: {{ $scr.Get "gallery_mask_color" }}; $gallery_mask_background_color: {{ $scr.Get "gallery_mask_background_color" }}; +$avatar_background_color: {{ $scr.Get "avatar_background_color" }}; @import 'abstracts/variables'; @import 'abstracts/mixins'; @@ -167,6 +170,7 @@ $gallery_mask_background_color: {{ $scr.Get "gallery_mask_background_color" }}; @import 'components/bio'; @import 'components/features'; @import 'components/mathjax'; +@import 'components/hr'; @import 'pages/body'; @import 'pages/home'; diff --git a/assets/sass/pages/_about.scss b/assets/sass/pages/_about.scss index e69de29..d3bc6f8 100644 --- a/assets/sass/pages/_about.scss +++ b/assets/sass/pages/_about.scss @@ -0,0 +1,3 @@ +.about{ + padding: 1rem; +} \ No newline at end of file diff --git a/assets/sass/pages/_archive.scss b/assets/sass/pages/_archive.scss index 5279ec1..b1045a8 100644 --- a/assets/sass/pages/_archive.scss +++ b/assets/sass/pages/_archive.scss @@ -1,11 +1,14 @@ .archive { position: relative; - margin-bottom: 5rem; - padding: 2rem; + padding: 2rem 2rem 0; width: 100%; @include flexbox(); @include justify-content(flex-start); + &__container { + width: 100%; + } + &__ul { position: relative; &::before { @@ -13,7 +16,7 @@ position: absolute; left: 2.25rem; top: 0; - width: 0.25rem; + width: 0.125rem; height: 100%; @include themify($themes) { background-color: themed('toc-vertical-line'); @@ -29,13 +32,44 @@ &__li { margin-bottom: 0.5rem; - margin-left: 4rem; + margin-left: 4rem; + z-index: 0; + @include transition(margin-left, 0.1s, ease); @include flexbox(); @include align-items(center); @include respond-to(sm) { margin-left: 0; - } + position: relative; + + &:not(:last-child) { + &::before { + content: ''; + left: 2.25rem; + top: -0.03rem; + height: 45px; + position: absolute; + z-index: -1; + @include themify($themes) { + border-left: 0.125rem solid themed('toc-vertical-line'); + } + } + } + + &:last-child { + &::before { + content: ''; + left: 2.25rem; + top: -0.03rem; + height: 28px; + position: absolute; + z-index: -1; + @include themify($themes) { + border-left: 0.125rem solid themed('toc-vertical-line'); + } + } + } + } } &__key { @@ -80,13 +114,14 @@ &__title { margin-right: 0.5rem; + @include truncate($grid-max-width); @include on-event { &::before { content: ''; position: absolute; left: 2.25rem; top: inherit; - width: 0.25rem; + width: 0.125rem; height: 23px; @include themify($themes) { background-color: themed('archive-hover-line-color'); diff --git a/assets/sass/pages/_body.scss b/assets/sass/pages/_body.scss index 92259aa..edfea07 100644 --- a/assets/sass/pages/_body.scss +++ b/assets/sass/pages/_body.scss @@ -1,5 +1,6 @@ #body { position: relative; + overflow-x: hidden; @include themify($themes) { color: themed('body-color'); background-color: themed('backdrop-background-color'); diff --git a/assets/sass/pages/_single.scss b/assets/sass/pages/_single.scss index 3e2ffd8..0933665 100644 --- a/assets/sass/pages/_single.scss +++ b/assets/sass/pages/_single.scss @@ -34,6 +34,7 @@ @include themify($themes) { color: themed("single-contents-title-color"); } + line-height: 1.25; } h1 { @@ -47,8 +48,7 @@ padding: 0; color: inherit; font-weight: 900; - text-rendering: optimizeLegibility; - line-height: 1.1; + text-rendering: optimizeLegibility; } h3 { diff --git a/assets/sass/themes/_custom.scss b/assets/sass/themes/_custom.scss index cd5ec57..c4ba734 100644 --- a/assets/sass/themes/_custom.scss +++ b/assets/sass/themes/_custom.scss @@ -99,4 +99,5 @@ $custom: ( subs-button-hover-background-color: $subs_button_hover_background_color, gallery-mask-color: $gallery_mask_color, gallery-mask-background-color: $gallery_mask_background_color, + avatar-background-color: $avatar_background_color, ) !default; \ No newline at end of file diff --git a/assets/sass/themes/_dark.scss b/assets/sass/themes/_dark.scss index 5ad6fdc..6541045 100644 --- a/assets/sass/themes/_dark.scss +++ b/assets/sass/themes/_dark.scss @@ -100,4 +100,5 @@ $dark: ( subs-button-hover-background-color: darken(#FF6188, 5%), gallery-mask-color: #FCFCFA, gallery-mask-background-color: rgba(0, 0, 0, 0.7), + avatar-background-color: #403E41, ); \ No newline at end of file diff --git a/assets/sass/themes/_hacker.scss b/assets/sass/themes/_hacker.scss index 6db6c94..c696c8d 100644 --- a/assets/sass/themes/_hacker.scss +++ b/assets/sass/themes/_hacker.scss @@ -103,4 +103,5 @@ $hacker: ( subs-button-hover-background-color: lighten(#252526, 5%), gallery-mask-color: #FCFCFA, gallery-mask-background-color: rgba(0, 0, 0, 0.7), + avatar-background-color: #E3CD26, ); \ No newline at end of file diff --git a/assets/sass/themes/_light.scss b/assets/sass/themes/_light.scss index aa5058d..132254c 100644 --- a/assets/sass/themes/_light.scss +++ b/assets/sass/themes/_light.scss @@ -100,4 +100,5 @@ $light: ( subs-button-hover-background-color: darken(#eeeeee, 5%), gallery-mask-color: #424242, gallery-mask-background-color: rgba(255, 255, 255, 0.7), + avatar-background-color: #dbdbdb, ); \ No newline at end of file diff --git a/assets/sass/themes/_solarized.scss b/assets/sass/themes/_solarized.scss index c4d0278..aff2cf1 100644 --- a/assets/sass/themes/_solarized.scss +++ b/assets/sass/themes/_solarized.scss @@ -103,4 +103,5 @@ $solarized: ( subs-button-hover-background-color: darken($secondary-color, 3%), gallery-mask-color: #424242, gallery-mask-background-color: rgba(253, 247, 227, 0.7), + avatar-background-color: darken(#FBF1D1, 5%), ); \ No newline at end of file diff --git a/data/_config/_default/config.toml b/data/_config/_default/config.toml index ba5fe9f..f8e94c6 100644 --- a/data/_config/_default/config.toml +++ b/data/_config/_default/config.toml @@ -8,7 +8,6 @@ hasCJKLanguage = true summaryLength = 70 -googleAnalytics = "" copyright = "©{year}, All Rights Reserved" timeout = 10000 enableEmoji = true diff --git a/data/_config/_default/params.toml b/data/_config/_default/params.toml index c1568a0..413238c 100644 --- a/data/_config/_default/params.toml +++ b/data/_config/_default/params.toml @@ -1,11 +1,11 @@ logoText = "Zzo" description = "The Zzo theme for Hugo example site." -custom_css = ["css/custom.css", "scss/custom.scss"] -custom_js = ["js/custom.js"] +custom_css = [] +custom_js = [] # header homeHeaderType = "slide" # text, img, slide -swiperCount = 3 # only works homeHeaderType = slide +swiperCount = 3 # only works when homeHeaderType = slide # body enableBreadcrumb = true @@ -15,9 +15,18 @@ enableMark = true enableGoToTop = true enableWhoami = true summaryShape = "card" # card, classic, compact -archiveGroupByDate = "2006-01" # "2006-01": group by month, "2006": group by year +archiveGroupByDate = "2006" # "2006-01": group by month, "2006": group by year +archivePaginate = 20 +paginateWindow = 1 + +# whoami myname = "zzossig" -whoami = "Let me introduce my self" +email = "zzossig@gmail.com" +whoami = "Web Developer" +useGravatar = false +location = "Seoul, Korea" +organization = "Hugo" +link = "https://github.com/zzossig/hugo-theme-zzo" # sidebar enableBio = true diff --git a/data/grid.toml b/data/grid.toml index d1b701e..d8a2f17 100644 --- a/data/grid.toml +++ b/data/grid.toml @@ -1,8 +1,10 @@ -grid_max_width = "960px" +grid_max_width = "960" +grid_max_unit = "px" # "px", "\"%\"" Using% is limited to using full width. grid_main_main_width = "5" -grid_main_main_unit = "fr" +grid_main_main_unit = "fr" # "fr", "px" grid_main_side_width = "2" -grid_main_side_unit = "fr" -grid_navbar_height = "50px" -grid_column_gap = "1.5rem" +grid_main_side_unit = "fr" # "fr", "px" +grid_column_gap_width = "32" +grid_column_gap_unit = "px" # "px" +grid_navbar_height = "50px" # "px" grid_row_gap = "0" \ No newline at end of file diff --git a/data/lib.toml b/data/lib.toml index 1de75c2..60fd1b4 100644 --- a/data/lib.toml +++ b/data/lib.toml @@ -23,7 +23,9 @@ sri = "sha256-3Fdoa5wQb+JYfEmTpQHx9sc/GuwpfC/0R9EpBki+mf8=" url = "https://cdn.jsdelivr.net/npm/mathjax@3.0.0/es5/tex-chtml.js" - +[js.swiper] + sri = "sha256-ZATCxHgcbalqi3AxHm7sPmwbfs3oZ4feGmCARVDmXig=" + url = "https://cdn.jsdelivr.net/npm/swiper@5.2.0/js/swiper.min.js" @@ -32,7 +34,9 @@ sri = "sha256-V8SV2MO1FUb63Bwht5Wx9x6PVHNa02gv8BgH/uH3ung=" url = "https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" - +[css.swiper] + sri = "sha256-s2QA0JtYEOOqRUyzKN+k2a/RxcimDuF2HZBdsosQRbM=" + url = "https://cdn.jsdelivr.net/npm/swiper@5.2.0/css/swiper.min.css" diff --git a/data/skin.toml b/data/skin.toml index 9cecd68..f62d970 100644 --- a/data/skin.toml +++ b/data/skin.toml @@ -98,4 +98,5 @@ subs_button_color = "inherit" subs_button_background_color = "inherit" subs_button_hover_background_color = "inherit" gallery_mask_color = "inherit" -gallery_mask_background_color = "inherit" \ No newline at end of file +gallery_mask_background_color = "inherit" +avatar_background_color = "inherit" \ No newline at end of file diff --git a/exampleSite/config.toml b/exampleSite/config.toml index 6e1a84d..373317c 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -8,7 +8,6 @@ hasCJKLanguage = true summaryLength = 70 -googleAnalytics = "" copyright = "©{year}, All Rights Reserved" timeout = 10000 enableEmoji = true @@ -26,12 +25,12 @@ rssLimit = 100 [params] logoText = "Zzo" description = "The Zzo theme for Hugo example site." - custom_css = ["css/custom.css", "scss/custom.scss"] - custom_js = ["js/custom.js"] + custom_css = [] + custom_js = [] # header homeHeaderType = "slide" # text, img, slide - swiperCount = 3 # only works homeHeaderType = slide + swiperCount = 3 # only works when homeHeaderType = slide # body enableBreadcrumb = true @@ -41,9 +40,18 @@ rssLimit = 100 enableGoToTop = true enableWhoami = true summaryShape = "card" # card, classic, compact - archiveGroupByDate = "2006-01" # "2006-01": group by month, "2006": group by year + archiveGroupByDate = "2006" # "2006-01": group by month, "2006": group by year + archivePaginate = 20 + paginateWindow = 1 + + # whoami myname = "zzossig" - whoami = "Let me introduce my self" + email = "zzossig@gmail.com" + whoami = "Web Developer" + useGravatar = false + location = "Seoul, Korea" + organization = "Hugo" + link = "https://github.com/zzossig/hugo-theme-zzo" # sidebar enableBio = true diff --git a/i18n/en.toml b/i18n/en.toml index 481e6ad..8beec0a 100644 --- a/i18n/en.toml +++ b/i18n/en.toml @@ -25,6 +25,9 @@ other = "Subscribe" [footer-social] other = "Social" +[archive-dateformat] +other = "Jan 2" + [single-dateformat] other = "Jan 2, 2006" diff --git a/i18n/ko.toml b/i18n/ko.toml index 238eaf0..d77607a 100644 --- a/i18n/ko.toml +++ b/i18n/ko.toml @@ -25,6 +25,9 @@ other = "구독" [footer-social] other = "소셜" +[archive-dateformat] +other = "01월 02일" + [single-dateformat] other = "2006년 01월 02일" diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 2675af3..30e3825 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -20,8 +20,7 @@ {{ block "main" . }}{{ end }} {{ partial "footer/site-footer" . }} - - {{ partial "etc/go-to-top" . }} + \ No newline at end of file diff --git a/layouts/_default/list.html b/layouts/_default/list.html index 54f854c..8091d5a 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -18,7 +18,7 @@ - {{ partial "pagination/pagination-list" . }} + {{ partial "pagination/pagination" . }} {{ if $.Param "enableSidebar" }} diff --git a/layouts/about/single.html b/layouts/about/single.html index cf99337..a3c18e8 100644 --- a/layouts/about/single.html +++ b/layouts/about/single.html @@ -3,12 +3,11 @@

{{ .Title }}

- -
- {{ .Content }} -
+
- about page +
+ {{ .Content }} +
{{ end }} \ No newline at end of file diff --git a/layouts/archive/list.html b/layouts/archive/list.html index 04f5d54..b1bdf5f 100644 --- a/layouts/archive/list.html +++ b/layouts/archive/list.html @@ -9,19 +9,23 @@
-
- {{ range (and (where .Site.RegularPages "Type" "!=" "about") (where .Site.RegularPages "Type" "!=" "archive")).GroupByDate (.Site.Params.archiveGroupByDate | default "2006") }} +
+ {{ $paginator := .Paginate (.Site.RegularPages.GroupByDate (.Site.Params.archiveGroupByDate | default "2006")) .Site.Params.archivePaginate }} + + {{ range ($paginator).PageGroups }} {{ .Key }}
    {{ range .Pages }}
  • {{ .Type }} {{ .Title }} - {{ .Date.Format (i18n "single-dateformat") }} + {{ .Date.Format (i18n "archive-dateformat") }}
  • {{ end }}
{{ end }} + + {{ partial "pagination/pagination-list" . }}
{{ end }} \ No newline at end of file diff --git a/layouts/index.html b/layouts/index.html index db9d04c..85d5a5b 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -13,8 +13,7 @@ {{ .Render "summary" }} {{ end }} - - {{ partial "pagination/pagination-list" . }} + {{ partial "pagination/pagination" . }} {{ if $.Param "enableSidebar" }} diff --git a/layouts/index.webmanifest b/layouts/index.webmanifest new file mode 100644 index 0000000..2f6dec6 --- /dev/null +++ b/layouts/index.webmanifest @@ -0,0 +1,19 @@ +{{- $scr := .Scratch -}} +{ + "name": "{{site.Title}}", + "short_name": "{{site.Title}}", + "lang": "{{site.Language.Lang}}", + "theme_color": "#FF6188", + "background_color": "#2D2A2E", + "icons": [{ + "src": "{{ "logo-192.png" | relURL }}", + "sizes": "192x192", + "type": "image/png" + }, { + "src": "{{ "logo-512.png" | relURL }}", + "sizes": "512x512", + "type": "image/png" + }], + "display": "standalone", + "start_url": "{{ "/" | relLangURL }}?utm_source=web_app_manifest" +} diff --git a/layouts/partials/body/whoami.html b/layouts/partials/body/whoami.html index 06adf43..dd0f275 100644 --- a/layouts/partials/body/whoami.html +++ b/layouts/partials/body/whoami.html @@ -2,7 +2,7 @@
- {{ .Site.Params.myname }} + {{ .Site.Params.myname }}
diff --git a/layouts/partials/etc/go-to-top.html b/layouts/partials/footer/go-to-top.html similarity index 81% rename from layouts/partials/etc/go-to-top.html rename to layouts/partials/footer/go-to-top.html index 2be4a0f..4cca53e 100644 --- a/layouts/partials/etc/go-to-top.html +++ b/layouts/partials/footer/go-to-top.html @@ -6,8 +6,7 @@
" $js.swiper.url $js.swiper.sri | safeHTML }} + + \ No newline at end of file diff --git a/layouts/partials/header/site-header.html b/layouts/partials/header/site-header.html index 557177f..c2b4208 100644 --- a/layouts/partials/header/site-header.html +++ b/layouts/partials/header/site-header.html @@ -9,15 +9,4 @@ {{ else }} {{ end }} - - - - - - {{ end }} \ No newline at end of file diff --git a/layouts/partials/header/slide-1.html b/layouts/partials/header/slide-1.html index 5a48649..a5cf3d2 100644 --- a/layouts/partials/header/slide-1.html +++ b/layouts/partials/header/slide-1.html @@ -1,21 +1,13 @@
- -
-
- Zzo -
-
- Blog theme for Hugo -
- +
+ Zzo
+
- MIT Licensed, v1.0.0 | Changelog + MIT Licensed, v1.0.0, Blog theme powered by Hugo
\ No newline at end of file diff --git a/layouts/partials/header/slide-2.html b/layouts/partials/header/slide-2.html index 82efdd9..a4a732b 100644 --- a/layouts/partials/header/slide-2.html +++ b/layouts/partials/header/slide-2.html @@ -19,25 +19,19 @@ Responsive
  • - Highly Customizable + Customizable
  • Code Highlighting
  • - Swiper support + Diagram
  • - Mermaid support + Math
  • - Flowchart.js support -
  • -
  • - Katex support -
  • -
  • - Comment(Disqus, Commento) + Comment
  • diff --git a/layouts/partials/header/slide-3.html b/layouts/partials/header/slide-3.html index f4129b4..024487b 100644 --- a/layouts/partials/header/slide-3.html +++ b/layouts/partials/header/slide-3.html @@ -1,8 +1,8 @@
    -
    +
    Start Using It Now
    -
    +
    Zzo theme is completely free and open-source
    \ No newline at end of file diff --git a/layouts/partials/pagination/pagination.html b/layouts/partials/pagination/pagination.html new file mode 100644 index 0000000..20d91e7 --- /dev/null +++ b/layouts/partials/pagination/pagination.html @@ -0,0 +1,31 @@ +{{ $pag := $.Paginator }} +{{ $window := $.Site.Params.paginateWindow | default 1 }} +{{ if gt $pag.TotalPages 1 }} + {{ $total := $pag.TotalPages }} + {{ $size := add 5 (add $window $window) }} + {{ $cur := $pag.PageNumber }} + {{ if gt $total $size }} + {{ if lt $cur (sub $size (add $window 1)) }} + {{ $.Scratch.Set "show" (seq 1 (sub $size 2)) }} + {{ else if lt (sub $total $cur) (sub $size (add $window 2)) }} + {{ $.Scratch.Set "show" (seq (add (sub $total $size) 3) $total) }} + {{ else }} + {{ $.Scratch.Set "show" (seq (sub $cur $window) (add $cur $window)) }} + {{ end }} + {{ $.Scratch.Add "show" 1 }} + {{ $.Scratch.Add "show" $total }} + {{ else }} + {{ $.Scratch.Set "show" (seq 1 $total) }} + {{ end }} +
      + {{ range $pag.Pagers }} + {{ $cur := .PageNumber }} + {{ if in ($.Scratch.Get "show") $cur }} +
    • {{ .PageNumber }}
    • + {{ else if in (slice 2 (sub $total 1)) $cur }} +
    • + {{ end }} + {{ end }} +
    +{{ end }} \ No newline at end of file diff --git a/layouts/partials/sidebar/sidebar-home.html b/layouts/partials/sidebar/sidebar-home.html index 7d252d6..51ecdbc 100644 --- a/layouts/partials/sidebar/sidebar-home.html +++ b/layouts/partials/sidebar/sidebar-home.html @@ -2,10 +2,7 @@ + +
    {{ partial "taxonomy/taxonomy-tags" . }} {{ partial "taxonomy/taxonomy-categories" . }} {{ partial "taxonomy/taxonomy-series" . }} +
    + {{ partial "sidebar/site-subs" . }} {{ end }} \ No newline at end of file diff --git a/layouts/partials/sidebar/sidebar-list.html b/layouts/partials/sidebar/sidebar-list.html index 7629994..f624755 100644 --- a/layouts/partials/sidebar/sidebar-list.html +++ b/layouts/partials/sidebar/sidebar-list.html @@ -10,7 +10,7 @@
    +
    {{ partial "taxonomy/taxonomy-tags" . }} {{ partial "taxonomy/taxonomy-categories" . }} {{ partial "taxonomy/taxonomy-series" . }} +
    {{ end }} \ No newline at end of file diff --git a/layouts/partials/sidebar/sidebar-single.html b/layouts/partials/sidebar/sidebar-single.html index d30c5d5..41dbe51 100644 --- a/layouts/partials/sidebar/sidebar-single.html +++ b/layouts/partials/sidebar/sidebar-single.html @@ -11,7 +11,7 @@ {{ end }}
    -
    +
      diff --git a/layouts/partials/sidebar/site-bio.html b/layouts/partials/sidebar/site-bio.html index e360d57..90e9238 100644 --- a/layouts/partials/sidebar/site-bio.html +++ b/layouts/partials/sidebar/site-bio.html @@ -1,23 +1,72 @@ +{{ if $.Param "enableBio" }}
      - {{ if .Site.Params.myname }}{{ .Site.Params.myname }}{{ end }} + {{ $src := "" }} + {{ if site.Params.useGravatar }} + {{ $src = printf "https://s.gravatar.com/avatar/%s?s=200" (md5 .Site.Params.email) }} + {{ if .Site.Params.myname }}{{ .Site.Params.myname }}{{ else }}Avatar{{ end }} + {{ else }} + {{ if (fileExists "static/images/whoami/avatar.png") }} + {{ if .Site.Params.myname }}{{ .Site.Params.myname }}{{ else }}Avatar{{ end }} + {{ else if (fileExists "static/images/whoami/avatar.jpg") }} + {{ if .Site.Params.myname }}{{ .Site.Params.myname }}{{ else }}Avatar{{ end }} + {{ else }} + {{ if .Site.Params.myname }}{{ .Site.Params.myname }}{{ else }}Avatar{{ end }} + {{ end }} + {{ end }}
      -
      +
      {{ .Site.Params.myname }}
      -
      +
      {{ .Site.Params.whoami }}
      + + {{ if .Site.Params.organization }} +
      +
      + {{ partial "svgs/etc/people.svg" (dict "width" 20 "height" 20) }} +
      + {{ .Site.Params.organization }} +
      + {{ end }} + + {{ if .Site.Params.organization }} +
      +
      + {{ partial "svgs/etc/location.svg" (dict "width" 20 "height" 20) }} +
      + {{ .Site.Params.location }} +
      + {{ end }} + + {{ if .Site.Params.email }} +
      +
      + {{ partial "svgs/social/email.svg" (dict "width" 20 "height" 20) }} +
      + {{ .Site.Params.email }} +
      + {{ end }} + + {{ if .Site.Params.link }} +
      +
      + {{ partial "svgs/etc/link.svg" (dict "width" 20 "height" 20) }} +
      + {{ .Site.Params.link }} +
      + {{ end }} + -
      \ No newline at end of file +
      + +{{ end }} \ No newline at end of file diff --git a/layouts/partials/svgs/etc/link.svg b/layouts/partials/svgs/etc/link.svg index e21590e..6ba5f05 100644 --- a/layouts/partials/svgs/etc/link.svg +++ b/layouts/partials/svgs/etc/link.svg @@ -1,4 +1 @@ - - - - + \ No newline at end of file diff --git a/layouts/partials/svgs/etc/location.svg b/layouts/partials/svgs/etc/location.svg new file mode 100644 index 0000000..7823b80 --- /dev/null +++ b/layouts/partials/svgs/etc/location.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/layouts/partials/svgs/etc/people.svg b/layouts/partials/svgs/etc/people.svg new file mode 100644 index 0000000..6f95719 --- /dev/null +++ b/layouts/partials/svgs/etc/people.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/swiper/logo.png b/static/images/swiper/logo.png deleted file mode 100644 index a54f20f..0000000 Binary files a/static/images/swiper/logo.png and /dev/null differ diff --git a/static/images/whoami/avatar.jpg b/static/images/whoami/avatar.jpg new file mode 100644 index 0000000..0da1a19 Binary files /dev/null and b/static/images/whoami/avatar.jpg differ diff --git a/static/images/whoami/photo.png b/static/images/whoami/photo.png deleted file mode 100644 index 8a765eb..0000000 Binary files a/static/images/whoami/photo.png and /dev/null differ diff --git a/static/logo-192.png b/static/logo-192.png new file mode 100644 index 0000000..49cffa3 Binary files /dev/null and b/static/logo-192.png differ diff --git a/static/logo-512.png b/static/logo-512.png new file mode 100644 index 0000000..aa1353e Binary files /dev/null and b/static/logo-512.png differ diff --git a/static/logo@2x.png b/static/logo@2x.png deleted file mode 100644 index 3ca428a..0000000 Binary files a/static/logo@2x.png and /dev/null differ diff --git a/static/robots.txt b/static/robots.txt deleted file mode 100644 index 2d653cb..0000000 --- a/static/robots.txt +++ /dev/null @@ -1,18 +0,0 @@ -# -# robots.txt -# -# This file is to prevent the crawling and indexing of certain parts -# of your site by web crawlers and spiders run by sites like Yahoo! -# and Google. By telling these "robots" where not to go on your site, -# you save bandwidth and server resources. -# -# This file will be ignored unless it is at the root of your host: -# Used: http://example.com/robots.txt -# Ignored: http://example.com/site/robots.txt -# -# For more information about the robots.txt standard, see: -# http://www.robotstxt.org/robotstxt.html - -User-agent: * -Crawl-delay: 10 -Disallow: