diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000..e69de29 diff --git a/README.md b/README.md index d939860..b428cf9 100644 --- a/README.md +++ b/README.md @@ -133,7 +133,7 @@ hasCJKLanguage = true summaryLength = 70 googleAnalytics = "" -copyright = "©yourcopyright" +copyright = "©{year}, All Rights Reserved" timeout = 10000 enableEmoji = true paginate = 7 @@ -218,10 +218,9 @@ description = "The Zzo theme for Hugo example site." custom_css = ["css/custom.css", "css/custom.css"] custom_js = ["js/custom.js"] -# home -myname = "zzossig" -whoami = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sit amet cursus massa. Vestibulum eu posuere est. Suspendisse erat purus, mollis in leo quis, hendrerit fringilla felis." -swiperCount = 3 +# header +homeHeaderType = "slide" # text, img, slide +swiperCount = 3 # only works homeHeaderType = slide # body enableBreadcrumb = true @@ -232,8 +231,11 @@ enableGoToTop = true enableWhoami = true summaryShape = "card" # card, classic, compact archiveGroupByDate = "2006-01" # "2006-01": group by month, "2006": group by year +myname = "zzossig" +whoami = "Let me introduce my self" # sidebar +enableBio = true enableSidebar = true enableSidebarTags = true enableSidebarSeries = true diff --git a/assets/sass/base/_reset.scss b/assets/sass/base/_reset.scss index eab0bc3..f79621f 100644 --- a/assets/sass/base/_reset.scss +++ b/assets/sass/base/_reset.scss @@ -136,4 +136,4 @@ figcaption { color: themed("mark-color"); background: themed("mark-background-color"); } -} +} \ No newline at end of file diff --git a/assets/sass/components/_bio.scss b/assets/sass/components/_bio.scss new file mode 100644 index 0000000..2dc8f78 --- /dev/null +++ b/assets/sass/components/_bio.scss @@ -0,0 +1,48 @@ +.bio { + @include flexbox(); + @include justify-content(center); + @include align-items(center); + @include flex-direction(column); + width: 100%; + max-width: 200px; + font-family: 'Montserrat', sans-serif; + + &__photo { + width: 100%; + height: 100%; + + &-wrapper { + width: 128px; + height: 128px; + border-radius: 100%; + overflow: hidden; + margin: 1rem; + @include themify($themes) { + background-color: themed(''); + } + } + } + + &__name { + font-weight: 700; + letter-spacing: 1px; + font-family: inherit; + } + + &__desc { + margin: 0.5rem 0; + text-align: center; + } + + &__social { + a { + text-decoration: none !important; + @include themify($themes) { + color: themed('social-icon-color'); + @include on-event { + color: themed('social-icon-hover-color'); + } + } + } + } +} \ No newline at end of file diff --git a/assets/sass/components/_features.scss b/assets/sass/components/_features.scss new file mode 100644 index 0000000..b242d25 --- /dev/null +++ b/assets/sass/components/_features.scss @@ -0,0 +1,116 @@ +.features { + max-width: $grid-max-width; + font-family: 'Montserrat', sans-serif; + padding: 1rem; + margin: 0 4rem; + @include respond-to(sm) { + margin: 0 1rem; + } + + &__title { + font-size: 45px; + font-weight: 700; + } + + ul { + @include flexbox(); + @include flex-wrap(wrap); + padding: 1.5rem 0.5rem; + } + + li { + padding: 0.125rem 0.5rem; + width: 43%; + @include truncate(350px); + + &::before { + content: '✔️'; + z-index: 1; + } + } +} + +.features-text { + max-width: $grid-max-width; + height: 100%; + font-family: 'Montserrat', sans-serif; + font-size: 45px; + font-weight: 700; + padding-bottom: 3.2rem; + margin: 0 4rem; + + @include flexbox(); + @include flex-direction(column); + @include align-items(center); + @include justify-content(center); + + &__item { + margin-bottom: 1.5rem; + } +} + +.features-intro { + max-width: $grid-max-width; + margin-right: auto; + margin-left: auto; + height: 100%; + margin: 2rem 8rem; + + @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%; + } + } + + &__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; + + a { + margin-right: 0.4rem; + } + } + + &__release-info { + margin: 20px 160px 0; + font-weight: 400; + text-align: left; + font-size: 12px; + } +} \ No newline at end of file diff --git a/assets/sass/components/_mathjax.scss b/assets/sass/components/_mathjax.scss new file mode 100644 index 0000000..5ef2307 --- /dev/null +++ b/assets/sass/components/_mathjax.scss @@ -0,0 +1,7 @@ +code.has-jax { + font: inherit; + font-size: 100%; + background: inherit; + border: inherit; + color: #515151; +} \ No newline at end of file diff --git a/assets/sass/components/_swiper.scss b/assets/sass/components/_swiper.scss index 8c670a9..9345947 100644 --- a/assets/sass/components/_swiper.scss +++ b/assets/sass/components/_swiper.scss @@ -1,22 +1,21 @@ .swiper-container { - width: $grid_max_width; - height: 200px; background-color: transparent; + width: 100%; + height: auto; + min-height: 300px; +} + +.swiper-slide { + background-position: center; + background-size: cover; } .swiper-pagination-bullet { opacity: .5; } + .swiper-pagination-bullet-active { @include themify($themes) { background: themed('navbar-title-active-color') !important; } } - -.swiper-button-prev { - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23424242'%2F%3E%3C%2Fsvg%3E") !important; -} - -.swiper-button-next { - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23424242'%2F%3E%3C%2Fsvg%3E") !important; -} \ No newline at end of file diff --git a/assets/sass/components/_toc.scss b/assets/sass/components/_toc.scss index bae449d..f3ec050 100644 --- a/assets/sass/components/_toc.scss +++ b/assets/sass/components/_toc.scss @@ -55,6 +55,9 @@ a { color: themed('toc-title-color'); + &.active { + color: themed('toc-vertical-line-active'); + } } } } diff --git a/assets/sass/layout/_header.scss b/assets/sass/layout/_header.scss index 54b1561..8c4e73b 100644 --- a/assets/sass/layout/_header.scss +++ b/assets/sass/layout/_header.scss @@ -9,23 +9,13 @@ font-weight: 900; } - &__whoami { - @include flexbox(); - @include justify-content(center); - @include align-items(center); + &__image { + background-image: url("../images/header/background.jpg"); width: 100%; - - &--image { - max-width: 64px; - max-height: 64px; - } - - &--name { - - } - - &--desc { - margin: 0.25rem 0; - } + height: 300px; + background-size: cover; + background-repeat: no-repeat; + position: relative; + margin-bottom: 2rem; } } \ No newline at end of file diff --git a/assets/sass/main.scss b/assets/sass/main.scss index 5fc24eb..64d00a6 100644 --- a/assets/sass/main.scss +++ b/assets/sass/main.scss @@ -164,6 +164,9 @@ $gallery_mask_background_color: {{ $scr.Get "gallery_mask_background_color" }}; @import 'components/subs'; @import 'components/mermaid'; @import 'components/swiper'; +@import 'components/bio'; +@import 'components/features'; +@import 'components/mathjax'; @import 'pages/body'; @import 'pages/home'; diff --git a/data/_config/_default/config.toml b/data/_config/_default/config.toml index 3f267ae..ba5fe9f 100644 --- a/data/_config/_default/config.toml +++ b/data/_config/_default/config.toml @@ -9,7 +9,7 @@ hasCJKLanguage = true summaryLength = 70 googleAnalytics = "" -copyright = "©yourcopyright" +copyright = "©{year}, All Rights Reserved" timeout = 10000 enableEmoji = true paginate = 7 diff --git a/data/_config/_default/params.toml b/data/_config/_default/params.toml index 7dc9582..c1568a0 100644 --- a/data/_config/_default/params.toml +++ b/data/_config/_default/params.toml @@ -3,10 +3,9 @@ description = "The Zzo theme for Hugo example site." custom_css = ["css/custom.css", "scss/custom.scss"] custom_js = ["js/custom.js"] -# home -myname = "zzossig" -whoami = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sit amet cursus massa. Vestibulum eu posuere est. Suspendisse erat purus, mollis in leo quis, hendrerit fringilla felis." -swiperCount = 3 +# header +homeHeaderType = "slide" # text, img, slide +swiperCount = 3 # only works homeHeaderType = slide # body enableBreadcrumb = true @@ -17,8 +16,11 @@ enableGoToTop = true enableWhoami = true summaryShape = "card" # card, classic, compact archiveGroupByDate = "2006-01" # "2006-01": group by month, "2006": group by year +myname = "zzossig" +whoami = "Let me introduce my self" # sidebar +enableBio = true enableSidebar = true enableSidebarTags = true enableSidebarSeries = true diff --git a/data/lib.toml b/data/lib.toml index d80f1cb..1de75c2 100644 --- a/data/lib.toml +++ b/data/lib.toml @@ -19,6 +19,9 @@ sri = "sha256-TabprKdeNXbSesCWLMrcbWSDzUhpAdcNPe5Q53rn9Yg=" url = "https://cdn.jsdelivr.net/npm/raphael@2.3.0/raphael.min.js" +[js.mathjax] + sri = "sha256-3Fdoa5wQb+JYfEmTpQHx9sc/GuwpfC/0R9EpBki+mf8=" + url = "https://cdn.jsdelivr.net/npm/mathjax@3.0.0/es5/tex-chtml.js" diff --git a/data/swiper.json b/data/swiper.json index 060458b..9444e8f 100644 --- a/data/swiper.json +++ b/data/swiper.json @@ -1,14 +1,11 @@ { "direction": "horizontal", "loop": true, + "preventClicks": false, "pagination": { "el": ".swiper-pagination" - }, - "navigation": { - "nextEl": ".swiper-button-next", - "prevEl": ".swiper-button-prev" }, "autoplay": { - "delay": 5000 + "delay": 10000 } } \ No newline at end of file diff --git a/exampleSite/config.toml b/exampleSite/config.toml index 1eaf2ee..6e1a84d 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -9,7 +9,7 @@ hasCJKLanguage = true summaryLength = 70 googleAnalytics = "" -copyright = "MIT©zzossig" +copyright = "©{year}, All Rights Reserved" timeout = 10000 enableEmoji = true paginate = 7 @@ -29,10 +29,9 @@ rssLimit = 100 custom_css = ["css/custom.css", "scss/custom.scss"] custom_js = ["js/custom.js"] - # home - myname = "zzossig" - whoami = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sit amet cursus massa. Vestibulum eu posuere est. Suspendisse erat purus, mollis in leo quis, hendrerit fringilla felis." - swiperCount = 3 + # header + homeHeaderType = "slide" # text, img, slide + swiperCount = 3 # only works homeHeaderType = slide # body enableBreadcrumb = true @@ -43,8 +42,11 @@ rssLimit = 100 enableWhoami = true summaryShape = "card" # card, classic, compact archiveGroupByDate = "2006-01" # "2006-01": group by month, "2006": group by year + myname = "zzossig" + whoami = "Let me introduce my self" # sidebar + enableBio = true enableSidebar = true enableSidebarTags = true enableSidebarSeries = true diff --git a/layouts/partials/body/lib.html b/layouts/partials/body/lib.html index bc4826f..b523b8e 100644 --- a/layouts/partials/body/lib.html +++ b/layouts/partials/body/lib.html @@ -59,4 +59,21 @@ }); +{{ end }} + +{{ if in .Params.Libraries "mathjax" }} + {{ printf "" $js.mathjax.url $js.mathjax.sri | safeHTML }} + {{ end }} \ No newline at end of file diff --git a/layouts/partials/footer/site-footer.html b/layouts/partials/footer/site-footer.html index 35dd5e7..688f39c 100644 --- a/layouts/partials/footer/site-footer.html +++ b/layouts/partials/footer/site-footer.html @@ -26,7 +26,9 @@ {{ if $.Param "showPoweredBy" }}
{{ if $.Site.Copyright }} -

{{ $.Site.Copyright }}

+

+ {{ with $.Site.Copyright }}{{ replace . "{year}" now.Year | markdownify}}{{ end }} +

{{ end }}

Powered by Hugo and the Zzo theme

diff --git a/layouts/partials/header/header-img-content.html b/layouts/partials/header/header-img-content.html new file mode 100644 index 0000000..3517eec --- /dev/null +++ b/layouts/partials/header/header-img-content.html @@ -0,0 +1 @@ +{{ partial "header/slide-1" . }} \ No newline at end of file diff --git a/layouts/partials/header/header-img.html b/layouts/partials/header/header-img.html new file mode 100644 index 0000000..f6b9852 --- /dev/null +++ b/layouts/partials/header/header-img.html @@ -0,0 +1,3 @@ +
+ {{ partial "header/header-img-content" . }} +
\ No newline at end of file diff --git a/layouts/partials/header/header-slide.html b/layouts/partials/header/header-slide.html new file mode 100644 index 0000000..b3071d6 --- /dev/null +++ b/layouts/partials/header/header-slide.html @@ -0,0 +1,12 @@ +
+
+ {{ if .Site.Params.swiperCount }} + {{ range $idx, $seq := (seq .Site.Params.swiperCount) }} +
+ {{ partial (print "header/slide-" $seq) . }} +
+ {{ end }} + {{ end }} +
+
+
\ No newline at end of file diff --git a/layouts/partials/header/header-text.html b/layouts/partials/header/header-text.html new file mode 100644 index 0000000..12f76ab --- /dev/null +++ b/layouts/partials/header/header-text.html @@ -0,0 +1,5 @@ +
+
+ {{ .Site.Params.Title }} +
+
\ No newline at end of file diff --git a/layouts/partials/header/site-header.html b/layouts/partials/header/site-header.html index c95cf66..557177f 100644 --- a/layouts/partials/header/site-header.html +++ b/layouts/partials/header/site-header.html @@ -1,21 +1,13 @@ {{ if .IsHome }}
- -
- -
- - {{ if .Site.Params.swiperCount }} - {{ range $idx, $seq := (seq .Site.Params.swiperCount) }} -
- {{ partial (print "header/slide-" $seq) . }} -
- {{ end }} - {{ end }} -
- -
-
+ {{ if and .Site.Params.homeHeaderType (eq .Site.Params.homeHeaderType "slide") }} + {{ partial "header/header-slide" . }} + {{ else if and .Site.Params.homeHeaderType (eq .Site.Params.homeHeaderType "img") }} + {{ partial "header/header-img" . }} + {{ else if and .Site.Params.homeHeaderType (eq .Site.Params.homeHeaderType "text") }} + {{ partial "header/header-text" . }} + {{ else }} + {{ end }}
diff --git a/layouts/partials/header/slide-1.html b/layouts/partials/header/slide-1.html index cbdd9f9..5a48649 100644 --- a/layouts/partials/header/slide-1.html +++ b/layouts/partials/header/slide-1.html @@ -1 +1,21 @@ -
slide 111
\ No newline at end of file +
+ +
+
+ Zzo +
+
+ Blog theme for Hugo +
+
+ Download + Demo + Homepage +
+
+
+ MIT Licensed, v1.0.0 | Changelog +
+
\ No newline at end of file diff --git a/layouts/partials/header/slide-2.html b/layouts/partials/header/slide-2.html index 7a322b1..82efdd9 100644 --- a/layouts/partials/header/slide-2.html +++ b/layouts/partials/header/slide-2.html @@ -1 +1,43 @@ -
slide 222
\ No newline at end of file +
+
+ Top Notch Features +
+ +
diff --git a/layouts/partials/header/slide-3.html b/layouts/partials/header/slide-3.html index 0efe243..f4129b4 100644 --- a/layouts/partials/header/slide-3.html +++ b/layouts/partials/header/slide-3.html @@ -1 +1,8 @@ -
slide 333
\ No newline at end of file +
+
+ Start Using It Now +
+
+ Zzo theme is completely free and open-source +
+
\ No newline at end of file diff --git a/layouts/partials/sidebar/sidebar-home.html b/layouts/partials/sidebar/sidebar-home.html index 7707994..7d252d6 100644 --- a/layouts/partials/sidebar/sidebar-home.html +++ b/layouts/partials/sidebar/sidebar-home.html @@ -1,10 +1,12 @@ {{ if $.Param "enableSidebar" }} -{{ $currentSection := .Section }} -{{ $currentID := "" }} -{{ with .File }}{{ $currentID = .UniqueID }}{{ end }}
{{ partial "sidebar/site-search" . }} + + {{ if $.Param "enableBio" }} + {{ partial "sidebar/site-bio" . }} + {{ end }} + {{ range (and (where .Site.Sections "Type" "!=" "about") (where .Site.Sections "Type" "!=" "archive")) }}
{{ .Title }} diff --git a/layouts/partials/sidebar/site-bio.html b/layouts/partials/sidebar/site-bio.html new file mode 100644 index 0000000..e360d57 --- /dev/null +++ b/layouts/partials/sidebar/site-bio.html @@ -0,0 +1,23 @@ +
+
+ {{ if .Site.Params.myname }}{{ .Site.Params.myname }}{{ end }} +
+
+ {{ .Site.Params.myname }} +
+
+ {{ .Site.Params.whoami }} +
+ +
\ No newline at end of file diff --git a/layouts/partials/summary/card.html b/layouts/partials/summary/card.html index 6c0ef57..3a7dce8 100644 --- a/layouts/partials/summary/card.html +++ b/layouts/partials/summary/card.html @@ -1,7 +1,7 @@
{{ .Title }}
-
🕓 {{ .Date.Format (i18n "summary-dateformat") }} · ☕{{ .ReadingTime }} min read
+
🕓 {{ .Date.Format (i18n "summary-dateformat") }} · ☕{{ .ReadingTime }} min read
{{ $params := .Params }}
@@ -14,9 +14,9 @@
{{ if $params.featured_image }}
- {{ with (print "images/" $params.featured_image) }} - {{ print $params.featured_image }} - {{ end }} + + {{ print $params.featured_image }} +
{{ else if $params.featured_video }} {{ with print ("videos/poster/" | relURL) $params.featured_video_poster }} diff --git a/layouts/partials/summary/classic.html b/layouts/partials/summary/classic.html index 104ce82..f0e83a0 100644 --- a/layouts/partials/summary/classic.html +++ b/layouts/partials/summary/classic.html @@ -3,15 +3,16 @@ {{ $params := .Params }} {{ if $params.featured_image }}
- {{ with (print "images/" $params.featured_image) }} - {{ print $params.featured_image }} - {{ end }} + + {{ print $params.featured_image }} +
{{ end }}
{{ .Title }}
-
🕓 {{ .Date.Format (i18n "summary-dateformat") }} · ☕{{ .ReadingTime }} min read +
🕓 {{ .Date.Format (i18n "summary-dateformat") }} · ☕{{ .ReadingTime }} min read
diff --git a/layouts/partials/summary/compact.html b/layouts/partials/summary/compact.html index 65eb3d4..0cf300f 100644 --- a/layouts/partials/summary/compact.html +++ b/layouts/partials/summary/compact.html @@ -4,7 +4,7 @@
{{ .Title }}
-
🕓 {{ .Date.Format (i18n "summary-dateformat") }} · ☕{{ .ReadingTime }} min read +
🕓 {{ .Date.Format (i18n "summary-dateformat") }} · ☕{{ .ReadingTime }} min read
diff --git a/static/images/clippy.svg b/static/images/clippy.svg deleted file mode 100644 index 66845ac..0000000 --- a/static/images/clippy.svg +++ /dev/null @@ -1,2 +0,0 @@ - - diff --git a/static/images/header/background.jpg b/static/images/header/background.jpg new file mode 100644 index 0000000..6da07f4 Binary files /dev/null and b/static/images/header/background.jpg differ diff --git a/static/images/swiper/logo.png b/static/images/swiper/logo.png new file mode 100644 index 0000000..a54f20f Binary files /dev/null and b/static/images/swiper/logo.png differ