From 8ad28e87167be8369f7b6ce2737a3cc6f5b9f9e3 Mon Sep 17 00:00:00 2001
From: Maryam Alhuthayfi <mal7othify@gmail.com>
Date: Mon, 06 Sep 2021 09:46:13 +0000
Subject: [PATCH] feat: Improved Arabic support (#249)

---
 assets/css/style.rtl.css                          |   18 ++++++++++++++++++
 assets/css/style.css                              |    1 +
 exampleSite/content/arabic/post/arabic_example.md |   10 ++++++++++
 assets/css/markupHighlight.css                    |    1 +
 layouts/partials/head.html                        |    7 +++++++
 exampleSite/config/_default/languages.toml        |    4 ++--
 exampleSite/config/_default/menus.ar.toml         |    8 ++++----
 7 files changed, 43 insertions(+), 6 deletions(-)

diff --git a/assets/css/markupHighlight.css b/assets/css/markupHighlight.css
index 8d9c942..a8b5e50 100644
--- a/assets/css/markupHighlight.css
+++ b/assets/css/markupHighlight.css
@@ -134,6 +134,7 @@
 
 /* Background */
 .chroma {
+  direction: ltr;
   color: var(--chr-def-color);
   background-color: var(--chr-def-bg-color);
 }
diff --git a/assets/css/style.css b/assets/css/style.css
index 50b2fbf..2fe33ea 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -1213,6 +1213,7 @@
   background-color: var(--bg-color);
   border: 1px solid var(--form-border-color);
   color: var(--body-color);
+  font-family: inherit;
 }
 .form-style ul li .field-style:focus {
   box-shadow: 0 0 5px;
diff --git a/assets/css/style.rtl.css b/assets/css/style.rtl.css
index 20f89c2..dc1bc3e 100644
--- a/assets/css/style.rtl.css
+++ b/assets/css/style.rtl.css
@@ -1,5 +1,10 @@
 @charset "UTF-8";
 
+body {
+  font-family: 'Tajawal', sans-serif;
+  font-size: 1.5rem;
+}
+
 blockquote {
   border-right: 0.25em solid var(--blockquote-border-color);
   border-left: inherit;
@@ -26,6 +31,19 @@
   margin-right: inherit;
 }
 
+.sidebar .logo-title .title h3 {
+  text-transform: capitalize;
+  letter-spacing: 1.5px;
+}
+
+.post .post-title h1 {
+  text-transform: capitalize;
+}
+
+.post .post-title h3 {
+  text-transform: capitalize;
+}
+
 .post .post-footer .info .separator a {
   margin-left: 0.2em;
   margin-right: inherit;
diff --git a/exampleSite/config/_default/languages.toml b/exampleSite/config/_default/languages.toml
index 94fd999..f8823c1 100644
--- a/exampleSite/config/_default/languages.toml
+++ b/exampleSite/config/_default/languages.toml
@@ -5,8 +5,8 @@
 contentDir = "content/english"
 
 [ar]
-title = "عربي"
-description = "أنا أحمد"
+title = "فلانة الفلانية"
+description = "أنا أعمل كمطورة ويب في شركة س"
 contentDir = "content/arabic" 
 weight = 2
 LanguageDirection = "rtl" 
diff --git a/exampleSite/config/_default/menus.ar.toml b/exampleSite/config/_default/menus.ar.toml
index c78242d..6562bdd 100644
--- a/exampleSite/config/_default/menus.ar.toml
+++ b/exampleSite/config/_default/menus.ar.toml
@@ -2,22 +2,22 @@
   name = "الرئيسية"
   identifier = "main"
   weight = 100
-  url = "/ar"
+  url = "/ar/"
 
   [[main]]
   name = "المنشورات"
   weight = 200
   identifier = "posts"
-  url = "/ar/post"
+  url = "/ar/post/"
 
   [[main]]
   name = "حول"
   weight = 300
   identifier = "about"
-  url = "/ar/about"
+  url = "/ar/about/"
 
   [[main]]
   name = "للتواصل"
   weight = 400
   identifier = "contact"
-  url = "/ar/contact"
\ No newline at end of file
+  url = "/ar/contact/"
\ No newline at end of file
diff --git a/exampleSite/content/arabic/post/arabic_example.md b/exampleSite/content/arabic/post/arabic_example.md
index 36a2176..ad7362a 100644
--- a/exampleSite/content/arabic/post/arabic_example.md
+++ b/exampleSite/content/arabic/post/arabic_example.md
@@ -17,3 +17,13 @@
 إذا كنت تحتاج إلى عدد أكبر من الفقرات يتيح لك مولد النص العربى زيادة عدد الفقرات كما تريد، النص لن يبدو مقسما ولا يحوي أخطاء لغوية، مولد النص العربى مفيد لمصممي المواقع على وجه الخصوص، حيث يحتاج العميل فى كثير من الأحيان أن يطلع على صورة حقيقية لتصميم الموقع.
 ومن هنا وجب على المصمم أن يضع نصوصا مؤقتة على التصميم ليظهر للعميل الشكل كاملاً،دور مولد النص العربى أن يوفر على المصمم عناء البحث عن نص بديل لا علاقة له بالموضوع الذى يتحدث عنه التصميم فيظهر بشكل لا يليق.
 هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق، أو حتى غير مفهوم. لأنه مازال نصاً بديلاً ومؤقتاً.
+
+```html
+<!DOCTYPE html>
+<html>
+  <body>
+    <h1>My First Heading</h1>
+    <p>My first paragraph.</p>
+  </body>
+</html>
+```
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 5b20033..042003d 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -46,6 +46,11 @@
     type="text/css"
   />
   {{ if eq .Site.Language.LanguageDirection "rtl" }}
+    <!-- Arabic font -->
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css?family=Tajawal:300,500,700&display=swap&subset=arabic"
+    />
     {{ $templateStyle := resources.Get "css/style.rtl.css" }}
     {{ $style := $templateStyle  | resources.ExecuteAsTemplate "css/main.rtl.css" . | resources.Minify | resources.Fingerprint }}
     <link
@@ -94,6 +99,8 @@
     />
 
   {{- end -}}
+
+
   <!-- Favicons -->
   <link rel="shortcut icon" href="{{ .Site.Params.favicon | relURL }}favicon.ico" type="image/x-icon" />
   <link rel="apple-touch-icon" sizes="180x180" href="{{ .Site.Params.favicon | relURL }}apple-touch-icon.png" />

--
Gitblit v1.10.0