fix: rtl and ltr mode

lxndrblz · Feb 19, 2022 · 76e9a77 · 76e9a77
1 parent 713315c
commit 76e9a77
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 15 deletions.
diff --git a/assets/scss/anatole.rtl.scss b/assets/scss/anatole.rtl.scss
@@ -0,0 +1,4 @@
+$content-ratio: {{- .Site.Params.contentratio | default 0.6 -}};
+$text-direction: "rtl";
+
+@import 'main.scss';
diff --git a/assets/scss/anatole.scss b/assets/scss/anatole.scss
@@ -0,0 +1,4 @@
+$content-ratio: {{- .Site.Params.contentratio | default 0.6 -}};
+$text-direction: "ltr";
+
+@import 'main.scss';
diff --git a/assets/scss/main.scss b/assets/scss/main.scss
@@ -1,6 +1,3 @@
-$content-ratio: {{- .Site.Params.contentratio | default 0.6 -}};
-$text-direction: {{- .Site.Language.LanguageDirection | default "ltr" -}};
-
 @import './modules/variables';
 @import './modules/config';
 @import './modules/color_theme';

diff --git a/assets/scss/modules/_config.scss b/assets/scss/modules/_config.scss
@@ -26,13 +26,13 @@
 }
 
 @mixin ltr {
-  @if $text-direction = "ltr" {
+  @if $text-direction == ltr {
     @content;
   }
 }
 
 @mixin rtl {
-  @if $text-direction = "rtl" {
+  @if $text-direction == rtl {
     @content;
   }
 }
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
@@ -45,19 +45,28 @@
 
   {{- end -}}
 
-
   <!-- CSS -->
-  {{ $sassTemplate := resources.Get "scss/main.scss" }}
+  {{ if eq .Site.Language.LanguageDirection "rtl" }}
+  {{ $sassTemplate := resources.Get "scss/anatole.rtl.scss" }}
+  {{ $style := $sassTemplate | resources.ExecuteAsTemplate "scss/main.rtl.scss" . | resources.ToCSS | resources.Minify | resources.Fingerprint }}
+  <link
+  rel="stylesheet"
+  href="{{ $style.RelPermalink }}"
+  integrity="{{ $style.Data.Integrity }}"
+  crossorigin="anonymous"
+  type="text/css"
+/>
+  {{ else }}
+  {{ $sassTemplate := resources.Get "scss/anatole.scss" }}
   {{ $style := $sassTemplate | resources.ExecuteAsTemplate "scss/main.scss" . | resources.ToCSS | resources.Minify | resources.Fingerprint }}
-
-
   <link
-    rel="stylesheet"
-    href="{{ $style.RelPermalink }}"
-    integrity="{{ $style.Data.Integrity }}"
-    crossorigin="anonymous"
-    type="text/css"
-  />
+  rel="stylesheet"
+  href="{{ $style.RelPermalink }}"
+  integrity="{{ $style.Data.Integrity }}"
+  crossorigin="anonymous"
+  type="text/css"
+/>
+  {{ end }}
 
   {{ $markupHighlightStyle := resources.Get "css/markupHighlight.css" | resources.Minify | resources.Fingerprint }}
   <link