From 19cde2c2f5bb56f41cce6e3caa6e3056e81e6077 Mon Sep 17 00:00:00 2001 From: zzossig Date: Fri, 8 Nov 2019 11:15:12 +0900 Subject: [PATCH] custom font support, google service added, comment in progress, --- README.md | 26 ++++++++++++++++++- assets/sass/components/_notice.scss | 1 - assets/sass/components/_search.scss | 2 +- assets/sass/components/_summary.scss | 10 +++---- assets/sass/components/_taxo.scss | 2 +- assets/sass/layout/_footer.scss | 3 +-- assets/sass/layout/_header.scss | 2 +- assets/sass/layout/_navigation.scss | 2 +- assets/sass/layout/_sidebar.scss | 19 ++++++++++---- assets/sass/main.scss | 18 +++++++++++++ assets/sass/pages/_404.scss | 2 +- assets/sass/pages/_gallery.scss | 2 +- assets/sass/pages/_list.scss | 4 +-- assets/sass/pages/_single.scss | 4 +-- assets/sass/prism/_hacker.scss | 2 +- data/font.toml | 16 ++++++++++++ layouts/_default/baseof.html | 3 ++- layouts/partials/comments/commento.html | 2 ++ layouts/partials/comments/disqus.html | 6 +++++ layouts/partials/functions/parse_fonts.html | 19 ++++++++++++++ layouts/partials/head/service.html | 2 ++ .../partials/marketing/google_analytics.html | 6 +++++ .../marketing/google_tag_manager.html | 9 +++++++ 23 files changed, 136 insertions(+), 26 deletions(-) create mode 100644 data/font.toml create mode 100644 layouts/partials/comments/commento.html create mode 100644 layouts/partials/comments/disqus.html create mode 100644 layouts/partials/functions/parse_fonts.html create mode 100644 layouts/partials/head/service.html create mode 100644 layouts/partials/marketing/google_analytics.html create mode 100644 layouts/partials/marketing/google_tag_manager.html diff --git a/README.md b/README.md index b4fdaa1..4dda7d7 100644 --- a/README.md +++ b/README.md @@ -47,6 +47,7 @@ I have referenced: * [zen theme](https://github.com/frjo/hugo-theme-zen) * [docdock theme](https://github.com/vjeantet/hugo-theme-docdock) * [learn theme](https://github.com/matcornic/hugo-theme-learn/) +* [academic theme](https://sourcethemes.com/academic/) * [overreacted.io](https://github.com/gaearon/overreacted.io) ## Dependency @@ -120,7 +121,6 @@ root │   │   ├── config.toml │   │   ├── languages.toml │   │   ├── menus.en.toml -│   │   ├── menus.ko.toml │   │   ├── params.toml ``` @@ -447,7 +447,31 @@ assets/js/custom.js ### custom skin(sub theme) +1. Make a skin.toml file in data folder. (data/skin.toml) +2. Copy the contents of themes/zzo/data/skin.toml file and paste it into the skin.toml file you created above. + +3. Change the color you want. + +4. Edit config/_default/params.toml file. The option name must be custom. + +```bash +... +themeOptions = ["custom", "dark", ...] +... +``` + +5. Once you change the skin.toml file, restart hugo. + +### custom font + +1. Make a font.toml file in data folder. (data/font.toml) + +2. Copy the contents of themes/zzo/data/font.toml file and paste it into the font.toml file you created above. + +3. Change the font you want. Make sure that you have imported that font. + +4. Once you change the font.toml file, restart hugo. ## Shortcodes diff --git a/assets/sass/components/_notice.scss b/assets/sass/components/_notice.scss index 4cc28e1..54ee468 100644 --- a/assets/sass/components/_notice.scss +++ b/assets/sass/components/_notice.scss @@ -20,7 +20,6 @@ div.notices p:first-child:before { position: absolute; top: -27px; color: #fff; - font-family: FontAwesome; content: '💡'; left: 10px; } diff --git a/assets/sass/components/_search.scss b/assets/sass/components/_search.scss index d3b52ee..46a03d0 100644 --- a/assets/sass/components/_search.scss +++ b/assets/sass/components/_search.scss @@ -32,7 +32,7 @@ color: themed("search-color"); background-color: themed("search-background-color"); @include input-placeholder { - font-family: "Montserrat", sans-serif; + font-family: $search_placeholder_font; color: themed("search-placeholder-color"); } } diff --git a/assets/sass/components/_summary.scss b/assets/sass/components/_summary.scss index 8219f02..e698d94 100644 --- a/assets/sass/components/_summary.scss +++ b/assets/sass/components/_summary.scss @@ -1,9 +1,9 @@ .summary { padding: 0 1rem; - .title { - font-family: "Montserrat", sans-serif; - font-weight: 700; + .title { a { + font-family: $summary_title_font; + font-weight: 700; @include themify($themes) { color: themed('title-color'); @include on-event { @@ -14,7 +14,7 @@ } .subtitle { - font-family: "Merriweather", serif; + font-family: $summary_subtitle_font; @include themify($themes) { color: themed('meta-color'); } @@ -29,7 +29,7 @@ &__text { margin-top: 1rem; line-height: 1.7rem; - font-family: "Merriweather", serif; + font-family: $summary_text_font; } &__image-wrapper { diff --git a/assets/sass/components/_taxo.scss b/assets/sass/components/_taxo.scss index e68d59c..52e1f6e 100644 --- a/assets/sass/components/_taxo.scss +++ b/assets/sass/components/_taxo.scss @@ -3,7 +3,7 @@ margin: 1.5rem 0; &__title { - font-family: 'Montserrat', sans-serif; + font-family: $taxo_titie_font; @include themify($themes) { color: themed('taxo-title-color'); &:hover { diff --git a/assets/sass/layout/_footer.scss b/assets/sass/layout/_footer.scss index af74864..0bde95d 100644 --- a/assets/sass/layout/_footer.scss +++ b/assets/sass/layout/_footer.scss @@ -134,8 +134,7 @@ } .content { - font-family: "Montserrat", sans-serif; - //font-size: 0.8rem; + font-family: $footer_content_font; } .select-theme { diff --git a/assets/sass/layout/_header.scss b/assets/sass/layout/_header.scss index a729be4..2053a15 100644 --- a/assets/sass/layout/_header.scss +++ b/assets/sass/layout/_header.scss @@ -6,7 +6,7 @@ margin: 1rem; .title { - font-family: 'Montserrat', sans-serif; + font-family: $header_title_font; font-weight: 900; } } \ No newline at end of file diff --git a/assets/sass/layout/_navigation.scss b/assets/sass/layout/_navigation.scss index a17c66c..13619b3 100644 --- a/assets/sass/layout/_navigation.scss +++ b/assets/sass/layout/_navigation.scss @@ -141,7 +141,7 @@ height: $nav-height; padding: 0.5rem; font-size: 1rem; - font-family: 'Montserrat', sans-serif; + font-family: $navbar_item_font; font-weight: 400; @include flexbox(); @include align-items(center); diff --git a/assets/sass/layout/_sidebar.scss b/assets/sass/layout/_sidebar.scss index a37a65b..7e3c39b 100644 --- a/assets/sass/layout/_sidebar.scss +++ b/assets/sass/layout/_sidebar.scss @@ -6,7 +6,7 @@ padding: 0.5rem; &__title { - font-family: "Montserrat", sans-serif; + font-family: $sidebar_title_font; font-weight: 700; @include themify($themes) { color: themed('sidebar-title-color'); @@ -17,10 +17,19 @@ } &__ul { - margin-left: 1rem; + margin-left: 0.5rem; + + li { + &::before { + padding-right: 0.5rem; + font-size: 1rem; + display: inline-block; + content: "\2022"; + } + } } - &__a { + &__a { @include themify($themes) { color: themed('sidebar-li-color'); } @@ -31,7 +40,7 @@ padding: 0.5rem; &__title { - font-family: "Montserrat", sans-serif; + font-family: $sidebar_title_font; font-weight: 700; @include themify($themes) { color: themed('sidebar-title-color'); @@ -46,7 +55,7 @@ } &__a { - font-family: "Montserrat", sans-serif; + font-family: $sidebar_list_font; @include themify($themes) { color: themed('sidebar-li-color'); } diff --git a/assets/sass/main.scss b/assets/sass/main.scss index 110aefd..d703c24 100644 --- a/assets/sass/main.scss +++ b/assets/sass/main.scss @@ -1,6 +1,24 @@ {{- partial "functions/parse_theme" . -}} +{{- partial "functions/parse_fonts" . -}} {{- $scr := .Scratch -}} +$search_placeholder_font: {{ $scr.Get "search_placeholder" }}; +$summary_title_font: {{ $scr.Get "summary_title" }}; +$summary_subtitle_font: {{ $scr.Get "summary_subtitle" }}; +$summary_text_font: {{ $scr.Get "summary_text" }}; +$taxo_titie_font: {{ $scr.Get "taxo_titie" }}; +$footer_content_font: {{ $scr.Get "footer_content" }}; +$header_title_font: {{ $scr.Get "header_title" }}; +$navbar_item_font: {{ $scr.Get "navbar_item" }}; +$sidebar_title_font: {{ $scr.Get "sidebar_title" }}; +$sidebar_list_font: {{ $scr.Get "sidebar_list" }}; +$page_not_found_font: {{ $scr.Get "page_not_found" }}; +$gallery_contents_font: {{ $scr.Get "gallery_contents" }}; +$list_title_font: {{ $scr.Get "list_title" }}; +$list_desc_font: {{ $scr.Get "list_desc" }}; +$single_title_font: {{ $scr.Get "single_title" }}; +$single_contents_font: {{ $scr.Get "single_contents" }}; + $footer_background_color: {{ $scr.Get "footer_background_color" }}; $footer_color: {{ $scr.Get "footer_color" }}; $link: {{ $scr.Get "link" }}; diff --git a/assets/sass/pages/_404.scss b/assets/sass/pages/_404.scss index d72b40e..f413cf8 100644 --- a/assets/sass/pages/_404.scss +++ b/assets/sass/pages/_404.scss @@ -1,6 +1,6 @@ .not-found { height: 100%; - font-family: "Montserrat", sans-serif; + font-family: $page_not_found_font; @include flexbox(); @include align-items(center); diff --git a/assets/sass/pages/_gallery.scss b/assets/sass/pages/_gallery.scss index 28f41b8..e971175 100644 --- a/assets/sass/pages/_gallery.scss +++ b/assets/sass/pages/_gallery.scss @@ -58,7 +58,7 @@ &__contents { padding: 1rem; width: 65%; - font-family: 'Merriweather', serif; + font-family: $gallery_contents_font; font-size: 1rem; text-align: center; } diff --git a/assets/sass/pages/_list.scss b/assets/sass/pages/_list.scss index a053c99..34552b8 100644 --- a/assets/sass/pages/_list.scss +++ b/assets/sass/pages/_list.scss @@ -4,7 +4,7 @@ align-items: center; justify-content: center; margin: 0.5rem; - font-family: 'Montserrat', sans-serif; + font-family: $list_title_font; &--title { @include themify($themes) { @@ -13,7 +13,7 @@ } &--desc { - font-family: 'Merriweather', serif; + font-family: $list_desc_font; font-weight: italic; padding: 1rem; line-height: 1.7rem; diff --git a/assets/sass/pages/_single.scss b/assets/sass/pages/_single.scss index dc37d47..c9ef285 100644 --- a/assets/sass/pages/_single.scss +++ b/assets/sass/pages/_single.scss @@ -5,7 +5,7 @@ &__title { font-weight: 900; - font-family: "Montserrat", sans-serif; + font-family: $single_title_font; line-height: 3rem; @include themify($themes) { color: themed("single-header-title-color"); @@ -19,7 +19,7 @@ &__contents { font-size: 1rem; - font-family: "Merriweather", serif; + font-family: $single_contents_font; margin: 1rem 0; line-height: 1.7rem; width: inheirt; diff --git a/assets/sass/prism/_hacker.scss b/assets/sass/prism/_hacker.scss index ee52354..2a2b2e2 100644 --- a/assets/sass/prism/_hacker.scss +++ b/assets/sass/prism/_hacker.scss @@ -8,7 +8,7 @@ word-wrap: normal; color: #fafafa !important; background: #2f2f2f; - font-family: Roboto Mono, monospace; + font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; font-size: 1em; line-height: 1.5em; diff --git a/data/font.toml b/data/font.toml new file mode 100644 index 0000000..314e663 --- /dev/null +++ b/data/font.toml @@ -0,0 +1,16 @@ +search_placeholder = "'Montserrat', sans-serif" +summary_title = "'Montserrat', sans-serif" +summary_subtitle = "'Merriweather', serif" +summary_text = "'Merriweather', serif" +taxo_titie = "'Montserrat', sans-serif" +footer_content = "'Montserrat', sans-serif" +header_title = "'Montserrat', sans-serif" +navbar_item = "'Montserrat', sans-serif" +sidebar_title = "'Montserrat', sans-serif" +sidebar_list = "inherit" +page_not_found = "'Montserrat', sans-serif" +gallery_contents = "'Merriweather', serif" +list_title = "'Montserrat', sans-serif" +list_desc = "'Merriweather', serif" +single_title = "'Montserrat', sans-serif" +single_contents = "'Merriweather', serif" diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 935b84c..415f6f6 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -5,10 +5,11 @@ {{ block "title" . }}{{ .Title }} – {{ .Site.Title }}{{ end }} - {{ partial "head/scripts" . }} + {{ partial "head/scripts" . }} {{ partial "head/styles" . }} {{ partial "head/meta" . }} {{ partial "head/meta_json_ld" . }} + {{ partial "head/service" }} diff --git a/layouts/partials/comments/commento.html b/layouts/partials/comments/commento.html new file mode 100644 index 0000000..8d9a197 --- /dev/null +++ b/layouts/partials/comments/commento.html @@ -0,0 +1,2 @@ +
+ diff --git a/layouts/partials/comments/disqus.html b/layouts/partials/comments/disqus.html new file mode 100644 index 0000000..6cbae77 --- /dev/null +++ b/layouts/partials/comments/disqus.html @@ -0,0 +1,6 @@ +{{ if site.Params.comments.disqus.shortname }} +
+ +{{end}} diff --git a/layouts/partials/functions/parse_fonts.html b/layouts/partials/functions/parse_fonts.html new file mode 100644 index 0000000..d564ea1 --- /dev/null +++ b/layouts/partials/functions/parse_fonts.html @@ -0,0 +1,19 @@ +{{- $scr := .Scratch -}} +{{ $font := .Site.Data.font }} + +{{- $scr.Set "search_placeholder" $font.search_placeholder -}} +{{- $scr.Set "summary_title" $font.summary_title -}} +{{- $scr.Set "summary_subtitle" $font.summary_subtitle -}} +{{- $scr.Set "summary_text" $font.summary_text -}} +{{- $scr.Set "taxo_titie" $font.taxo_titie -}} +{{- $scr.Set "footer_content" $font.footer_content -}} +{{- $scr.Set "header_title" $font.header_title -}} +{{- $scr.Set "navbar_item" $font.navbar_item -}} +{{- $scr.Set "sidebar_title" $font.sidebar_title -}} +{{- $scr.Set "sidebar_list" $font.sidebar_list -}} +{{- $scr.Set "page_not_found" $font.page_not_found -}} +{{- $scr.Set "gallery_contents" $font.gallery_contents -}} +{{- $scr.Set "list_title" $font.list_title -}} +{{- $scr.Set "list_desc" $font.list_desc -}} +{{- $scr.Set "single_title" $font.single_title -}} +{{- $scr.Set "single_contents" $font.single_contents -}} \ No newline at end of file diff --git a/layouts/partials/head/service.html b/layouts/partials/head/service.html new file mode 100644 index 0000000..6d3b4a5 --- /dev/null +++ b/layouts/partials/head/service.html @@ -0,0 +1,2 @@ +{{ partial "marketing/google_analytics" . }} +{{ partial "marketing/google_tag_manager" . }} \ No newline at end of file diff --git a/layouts/partials/marketing/google_analytics.html b/layouts/partials/marketing/google_analytics.html new file mode 100644 index 0000000..cc37401 --- /dev/null +++ b/layouts/partials/marketing/google_analytics.html @@ -0,0 +1,6 @@ +{{ $ga := .Site.Params.marketing.google_analytics | default "" }} +{{ $gtm := .Site.Params.marketing.google_tag_manager | default "" }} + +{{ if (in (slice (getenv "HUGO_ENV") hugo.Environment) "production") | and $ga | and (not $gtm) }} +{{ template "_internal/google_analytics_async.html" . }} +{{ end }} diff --git a/layouts/partials/marketing/google_tag_manager.html b/layouts/partials/marketing/google_tag_manager.html new file mode 100644 index 0000000..6ae3abc --- /dev/null +++ b/layouts/partials/marketing/google_tag_manager.html @@ -0,0 +1,9 @@ +{{ if (in (slice (getenv "HUGO_ENV") hugo.Environment) "production") | and site.Params.marketing.google_tag_manager }} + +{{ end }}