From da9df3b0ce07472aa9a792b2f39b29aae1904c99 Mon Sep 17 00:00:00 2001 From: Dillon Date: Fri, 15 May 2020 19:05:16 +0800 Subject: [PATCH] feat(style): change custom style file path (#360) --- {exampleSite/config => assets}/css/_custom.scss | 0 assets/css/_override.scss | 4 ++++ assets/css/_variables.scss | 4 +++- assets/css/{style.template.scss => style.scss} | 9 ++------- exampleSite/assets/css/_custom.scss | 4 ++++ exampleSite/assets/css/_override.scss | 4 ++++ exampleSite/config/css/_override.scss | 8 -------- .../content/posts/theme-documentation-basics/index.en.md | 8 +++++--- .../content/posts/theme-documentation-basics/index.fr.md | 8 +++++--- .../posts/theme-documentation-basics/index.zh-cn.md | 8 +++++--- layouts/partials/head/link.html | 6 +++--- ... style.scss_d75fd08668b4bae707167bbce4d8ca46.content} | 0 ... => style.scss_d75fd08668b4bae707167bbce4d8ca46.json} | 0 13 files changed, 35 insertions(+), 28 deletions(-) rename {exampleSite/config => assets}/css/_custom.scss (100%) create mode 100644 assets/css/_override.scss rename assets/css/{style.template.scss => style.scss} (59%) create mode 100644 exampleSite/assets/css/_custom.scss create mode 100644 exampleSite/assets/css/_override.scss delete mode 100644 exampleSite/config/css/_override.scss rename resources/_gen/assets/scss/css/{style.template.scss_b8ba9a60a151126bfcde1421dc0b972d.content => style.scss_d75fd08668b4bae707167bbce4d8ca46.content} (100%) rename resources/_gen/assets/scss/css/{style.template.scss_b8ba9a60a151126bfcde1421dc0b972d.json => style.scss_d75fd08668b4bae707167bbce4d8ca46.json} (100%) diff --git a/exampleSite/config/css/_custom.scss b/assets/css/_custom.scss similarity index 100% rename from exampleSite/config/css/_custom.scss rename to assets/css/_custom.scss diff --git a/assets/css/_override.scss b/assets/css/_override.scss new file mode 100644 index 00000000..c37b4ec3 --- /dev/null +++ b/assets/css/_override.scss @@ -0,0 +1,4 @@ +// ============================== +// Override Variables +// 覆盖变量 +// ============================== diff --git a/assets/css/_variables.scss b/assets/css/_variables.scss index 28585aec..8b7f4480 100644 --- a/assets/css/_variables.scss +++ b/assets/css/_variables.scss @@ -2,6 +2,8 @@ // Variables // ============================== +@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@800&display=swap'); + // ========== Global ========== // // Font and Line Height $global-font-family: system-ui, -apple-system, BlinkMacSystemFont, PingFang SC, Microsoft YaHei UI, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, Helvetica, Arial, sans-serif !default; @@ -57,7 +59,7 @@ $header-background-color: #f8f8f8 !default; $header-background-color-dark: #252627 !default; // Font style of the header title -$header-title-font-family: $global-font-family !default; +$header-title-font-family: Nunito, $global-font-family !default; $header-title-font-size: 1.5rem !default; // Color of the hover header item diff --git a/assets/css/style.template.scss b/assets/css/style.scss similarity index 59% rename from assets/css/style.template.scss rename to assets/css/style.scss index 78aa4e69..cd685a8a 100644 --- a/assets/css/style.template.scss +++ b/assets/css/style.scss @@ -1,10 +1,7 @@ @charset "utf-8"; @import "_variables"; - -{{- if fileExists "config/css/_override.scss" -}} - @import "_override"; -{{- end -}} +@import "_override"; @import "_mixin/index"; @@ -19,6 +16,4 @@ @import "_core/media"; -{{- if fileExists "config/css/_custom.scss" -}} - @import "_custom"; -{{- end -}} +@import "_custom"; diff --git a/exampleSite/assets/css/_custom.scss b/exampleSite/assets/css/_custom.scss new file mode 100644 index 00000000..37edf904 --- /dev/null +++ b/exampleSite/assets/css/_custom.scss @@ -0,0 +1,4 @@ +// ============================== +// Custom style +// 自定义样式 +// ============================== diff --git a/exampleSite/assets/css/_override.scss b/exampleSite/assets/css/_override.scss new file mode 100644 index 00000000..c37b4ec3 --- /dev/null +++ b/exampleSite/assets/css/_override.scss @@ -0,0 +1,4 @@ +// ============================== +// Override Variables +// 覆盖变量 +// ============================== diff --git a/exampleSite/config/css/_override.scss b/exampleSite/config/css/_override.scss deleted file mode 100644 index ad801fec..00000000 --- a/exampleSite/config/css/_override.scss +++ /dev/null @@ -1,8 +0,0 @@ -// ============================== -// Override Variables -// 覆盖变量 -// ============================== - -@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@800&display=swap'); - -$header-title-font-family: Nunito, $global-font-family; diff --git a/exampleSite/content/posts/theme-documentation-basics/index.en.md b/exampleSite/content/posts/theme-documentation-basics/index.en.md index fafadfac..b33dffcd 100644 --- a/exampleSite/content/posts/theme-documentation-basics/index.en.md +++ b/exampleSite/content/posts/theme-documentation-basics/index.en.md @@ -799,15 +799,17 @@ Add a logo image (127x40) and a cover image (800x600) in the `static` directory. ### 3.4 Style Customization +{{< version 0.2.8 changed >}} + {{< admonition >}} Hugo **extended** version is necessary for the style customization. {{< /admonition >}} **LoveIt** theme has been built to be as configurable as possible by defining custom `.scss` style files. -The directory including the custom `.scss` style files is `config/css` relative to **your project root directory**. +The directory including the custom `.scss` style files is `assets/css` relative to **your project root directory**. -In `config/css/_override.scss`, you can override the variables in `themes/LoveIt/assets/css/_variables.scss` to customize the style. +In `assets/css/_override.scss`, you can override the variables in `themes/LoveIt/assets/css/_variables.scss` to customize the style. Here is a example: @@ -816,7 +818,7 @@ Here is a example: $code-font-family: Fira Mono, Source Code Pro, Menlo, Consolas, Monaco, monospace; ``` -In `config/css/_custom.scss`, you can add some css style code to customize the style. +In `assets/css/_custom.scss`, you can add some css style code to customize the style. ## 4 Multilingual and i18n diff --git a/exampleSite/content/posts/theme-documentation-basics/index.fr.md b/exampleSite/content/posts/theme-documentation-basics/index.fr.md index 354755bb..a1d9ba44 100644 --- a/exampleSite/content/posts/theme-documentation-basics/index.fr.md +++ b/exampleSite/content/posts/theme-documentation-basics/index.fr.md @@ -804,15 +804,17 @@ Add a logo image (127x40) and a cover image (800x600) in the `static` directory. ### 3.4 Style Customization +{{< version 0.2.8 changed >}} + {{< admonition >}} Hugo **extended** version is necessary for the style customization. {{< /admonition >}} **LoveIt** theme has been built to be as configurable as possible by defining custom `.scss` style files. -The directory including the custom `.scss` style files is `config/css` relative to **your project root directory**. +The directory including the custom `.scss` style files is `assets/css` relative to **your project root directory**. -In `config/css/_override.scss`, you can override the variables in `themes/LoveIt/assets/css/_variables.scss` to customize the style. +In `assets/css/_override.scss`, you can override the variables in `themes/LoveIt/assets/css/_variables.scss` to customize the style. Here is a example: @@ -821,7 +823,7 @@ Here is a example: $code-font-family: Fira Mono, Source Code Pro, Menlo, Consolas, Monaco, monospace; ``` -In `config/css/_custom.scss`, you can add some css style code to customize the style. +In `assets/css/_custom.scss`, you can add some css style code to customize the style. ## 4 Multilingual and i18n diff --git a/exampleSite/content/posts/theme-documentation-basics/index.zh-cn.md b/exampleSite/content/posts/theme-documentation-basics/index.zh-cn.md index 2ee6e717..a7b7b40e 100644 --- a/exampleSite/content/posts/theme-documentation-basics/index.zh-cn.md +++ b/exampleSite/content/posts/theme-documentation-basics/index.zh-cn.md @@ -803,15 +803,17 @@ hugo ### 3.4 自定义样式 +{{< version 0.2.8 changed >}} + {{< admonition >}} Hugo **extended** 版本对于自定义样式是必需的. {{< /admonition >}} 通过定义自定义 `.scss` 样式文件, **LoveIt** 主题支持可配置的样式. -包含自定义 `.scss` 样式文件的目录相对于 **你的项目根目录** 的路径为 `config/css`. +包含自定义 `.scss` 样式文件的目录相对于 **你的项目根目录** 的路径为 `assets/css`. -在 `config/css/_override.scss` 中, 你可以覆盖 `themes/LoveIt/assets/css/_variables.scss` 中的变量以自定义样式. +在 `assets/css/_override.scss` 中, 你可以覆盖 `themes/LoveIt/assets/css/_variables.scss` 中的变量以自定义样式. 这是一个例子: @@ -820,7 +822,7 @@ Hugo **extended** 版本对于自定义样式是必需的. $code-font-family: Fira Mono, Source Code Pro, Menlo, Consolas, Monaco, monospace; ``` -在 `config/css/_custom.scss` 中, 你可以添加一些 CSS 样式代码以自定义样式. +在 `assets/css/_custom.scss` 中, 你可以添加一些 CSS 样式代码以自定义样式. ## 4 多语言和 i18n diff --git a/layouts/partials/head/link.html b/layouts/partials/head/link.html index fbf09419..07ab9531 100644 --- a/layouts/partials/head/link.html +++ b/layouts/partials/head/link.html @@ -35,9 +35,9 @@ {{- partial "plugin/style.html" $style -}} {{- /* style.min.css */ -}} -{{- $style := dict "source" "css/style.template.scss" "fingerprint" $fingerprint -}} -{{- $options := dict "targetPath" "css/style.min.css" "includePaths" (slice "config/css") "enableSourceMap" true -}} -{{- $style = dict "template" "style.scss" "context" . "toCSS" $options | merge $style -}} +{{- $style := dict "source" "css/style.scss" "fingerprint" $fingerprint -}} +{{- $options := dict "targetPath" "css/style.min.css" "enableSourceMap" true -}} +{{- $style = dict "context" . "toCSS" $options | merge $style -}} {{- partial "plugin/style.html" $style -}} {{- /* Font Awesome */ -}} diff --git a/resources/_gen/assets/scss/css/style.template.scss_b8ba9a60a151126bfcde1421dc0b972d.content b/resources/_gen/assets/scss/css/style.scss_d75fd08668b4bae707167bbce4d8ca46.content similarity index 100% rename from resources/_gen/assets/scss/css/style.template.scss_b8ba9a60a151126bfcde1421dc0b972d.content rename to resources/_gen/assets/scss/css/style.scss_d75fd08668b4bae707167bbce4d8ca46.content diff --git a/resources/_gen/assets/scss/css/style.template.scss_b8ba9a60a151126bfcde1421dc0b972d.json b/resources/_gen/assets/scss/css/style.scss_d75fd08668b4bae707167bbce4d8ca46.json similarity index 100% rename from resources/_gen/assets/scss/css/style.template.scss_b8ba9a60a151126bfcde1421dc0b972d.json rename to resources/_gen/assets/scss/css/style.scss_d75fd08668b4bae707167bbce4d8ca46.json