fuji.scss: let the user override both the variables and the CSS rules

5 files changed, 11 insertions, 4 deletions

diff --git a/README.md b/README.md
index 979e4e9..8e70f17 100644
--- a/README.md
+++ b/README.md
@@ -218,9 +218,9 @@ Use the `[SITEROOT]/layouts/partials/comment-*.html` to cover `themes/fuji/layou
 
 > Hugo extended version needed.
 
-You can cover theme's internal SCSS variables with your own. Create `[SITEROOT]/assets/scss/_custom.scss` to cover variables in SCSS.
+You can override theme's internal SCSS variables with your own. Create `[SITEROOT]/assets/scss/_custom_var.scss` to cover variables in SCSS.
 
-Varibales available:
+Variables available:
 
 ```scss
 $body-font: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Helvetica Neue', 'Helvetica', 'Arial', 'PingFang SC',
@@ -248,6 +248,9 @@ $dark-color-bg: #2f3136; // Discord
 $dark-color-codebg: #414449; // GitHub
 ```
 
+To override SCSS rules, create `[SITEROOT]/assets/scss/_custom_rules.scss`. This file will have priority over anything regarding CSS rules, but is useless for changing variables that are used elsewhere in the theme.
+
+
 ## ✏️ Issue und contributing
 
 Feel free to use the [issue tracker](https://github.com/amzrk2/hugo-theme-fuji/issues). The theme has only been fully tested on Firefox, so if there are some problems when accessing with Chrome or others please also report an issue.
diff --git a/assets/scss/_custom.scss b/assets/scss/_custom.scss
index ca09079..d4b36a6 100644
--- a/assets/scss/_custom.scss
+++ b/assets/scss/_custom.scss
@@ -1 +1 @@
-// wtb covered
+// This file was used for overriding variables. Please use _custom_var.scss instead.
diff --git a/assets/scss/_custom_rules.scss b/assets/scss/_custom_rules.scss
new file mode 100644
index 0000000..7fc3ab1
--- /dev/null
+++ b/assets/scss/_custom_rules.scss
@@ -0,0 +1 @@
+// Override CSS rules with that file
diff --git a/assets/scss/_custom_var.scss b/assets/scss/_custom_var.scss
new file mode 100644
index 0000000..c2765c4
--- /dev/null
+++ b/assets/scss/_custom_var.scss
@@ -0,0 +1,2 @@
+// Override variables with that file
+@import '_custom'; // Keep that for back-compatibility. This shouldn't be used anymore.
diff --git a/assets/scss/fuji.scss b/assets/scss/fuji.scss
index 4d57aee..d88259b 100644
--- a/assets/scss/fuji.scss
+++ b/assets/scss/fuji.scss
@@ -1,5 +1,6 @@
 // var & global
 @import '_var';
+@import '_custom_var';
 @import '_global';
 
 // primer
@@ -28,4 +29,4 @@
 @import '_image';
 
 // let the user override the theme
-@import '_custom';
+@import '_custom_rules';