From 4beb92098a0c1565aca7e674c884992ee3723aad Mon Sep 17 00:00:00 2001
From: Abdurrahman Rajab <rajab-2@windowslive.com>
Date: Sun, 18 Apr 2021 12:31:20 +0000
Subject: [PATCH] RTL support and Arabic Translation (#178)
---
layouts/_default/baseof.html | 2
i18n/dk.toml | 11
exampleSite/content/english/post/placeholder-text.md | 0
exampleSite/content/english/post/rich-content.md | 0
i18n/de.toml | 11
i18n/fa.toml | 11
i18n/pt-br.toml | 11
exampleSite/content/english/post/math-typesetting.md | 0
exampleSite/config/_default/menus.en.toml | 23
exampleSite/config/_default/config.toml | 19
exampleSite/content/english/about.md | 0
exampleSite/content/arabic/post/_index.md | 0
exampleSite/content/english/contact.md | 0
i18n/it.toml | 11
layouts/_default/single.html | 1
exampleSite/content/arabic/contact.md | 7
i18n/zh-cn.toml | 11
i18n/ko.toml | 9
i18n/zh-tw.toml | 11
exampleSite/content/arabic/_index.md | 0
assets/css/style.css | 3
exampleSite/content/english/archives.md | 0
i18n/es.toml | 11
i18n/fi.toml | 11
exampleSite/config/_default/params.toml | 59 ++
README.md | 10
exampleSite/config/_default/menus.ar.toml | 23
exampleSite/content/english/post/emoji-support.md | 0
exampleSite/content/english/post/_index.md | 0
i18n/ar.toml | 37 +
/dev/null | 106 ---
assets/css/style.rtl.css | 1149 +++++++++++++++++++++++++++++++++++++++++
exampleSite/content/arabic/about.md | 12
i18n/en.toml | 11
exampleSite/content/arabic/archives.md | 0
exampleSite/content/arabic/post/arabic_example.md | 18
exampleSite/content/english/post/figure-shortcode.md | 0
exampleSite/content/english/_index.md | 0
layouts/partials/head.html | 12
exampleSite/content/english/post/image-test.md | 0
exampleSite/config/_default/languages.toml | 13
exampleSite/content/english/post/markdown-syntax.md | 0
i18n/fr.toml | 11
layouts/partials/contact.html | 7
44 files changed, 1,507 insertions(+), 124 deletions(-)
diff --git a/README.md b/README.md
index 4971ef8..8400bf2 100644
--- a/README.md
+++ b/README.md
@@ -16,6 +16,7 @@
- Navigation items
- Pagination
- Multilingual
+- RTL support
- Post Thumbnails (optional)
- 100⁄100 Google Lighthouse score
- Google Analytics (optional)
@@ -234,6 +235,15 @@
Anatole currently ships with support for some basic languages. Contributions for other language translations are welcome.
+### RTL suppourt
+
+Anatole support RTL langauges and flip the whole theme for that. To enable the RTL mode for specific langauge it's enough to write the following code in the language params.
+
+```toml
+LanguageDirection = "rtl"
+```
+
+
### :100: Google Lighthouse score
The theme is optimized to adhere to the requirements checked for in the Lighthouse Audit. On my [personal site](https://www.alexbilz.com) I was able to reach a perfect 100⁄100 score.
diff --git a/assets/css/style.css b/assets/css/style.css
index 6bc92a6..852e54e 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -16,8 +16,6 @@
--blockquote-border-color: #dfe2e5;
--thumbnail-height: 15em;
scroll-padding-top: 100px;
- --duration: 0.5s;
- --timing: ease;
}
html[data-theme='dark'] {
@@ -48,7 +46,6 @@
width: 100%;
margin: 0 auto 30px auto;
background-color: var(--bg-color);
- transition: color var(--duration) var(--timing), background-color var(--duration) var(--timing);
}
p {
diff --git a/assets/css/style.rtl.css b/assets/css/style.rtl.css
new file mode 100644
index 0000000..6a4f006
--- /dev/null
+++ b/assets/css/style.rtl.css
@@ -0,0 +1,1149 @@
+@charset "UTF-8";
+
+:root {
+ --bg-color: #fff;
+ --secondary-bg-color: #eeeeee;
+ --heading-color: #5f5f5f;
+ --body-color: rgba(0, 0, 0, 0.7);
+ --post-color: rgba(0, 0, 0, 0.44);
+ --border-color: rgba(0, 0, 0, 0.15);
+ --form-border-color: #9f9f9f;
+ --form-button-hover-border-color: #000;
+ --pre-bg-color: #f9f9fd;
+ --nav-text-color: #5a5a5a;
+ --tag-color: #424242;
+ --blockquote-text-color: #858585;
+ --blockquote-border-color: #dfe2e5;
+ --thumbnail-height: 15em;
+ scroll-padding-top: 100px;
+}
+
+html[data-theme='dark'] {
+ --bg-color: #292a2d;
+ --secondary-bg-color: #2c2d32;
+ --heading-color: rgb(169, 169, 179);
+ --body-color: rgb(169, 169, 179);
+ --post-color: rgba(0, 0, 0, 0.44);
+ --border-color: rgb(38, 38, 38);
+ --form-border-color: rgb(169, 169, 179);
+ --form-button-hover-border-color: #fff;
+ --pre-bg-color: rgb(33, 33, 45);
+ --nav-text-color: rgb(191, 191, 191);
+ --tag-color: rgb(191, 191, 191);
+ --blockquote-text-color: #808080;
+ --blockquote-border-color: #424242;
+}
+
+html {
+ background-color: var(--bg-color);
+ -webkit-font-smoothing: antialiased;
+}
+
+body {
+ color: var(--body-color);
+ font-family: 'Verdana', sans-serif;
+ font-size: 15px;
+ width: 100%;
+ margin: 0 auto 30px auto;
+ background-color: var(--bg-color);
+}
+
+p {
+ line-height: 1.9em;
+ font-weight: 400;
+ font-size: 14px;
+}
+
+a {
+ text-decoration: none;
+}
+
+blockquote {
+ padding: 0 1em;
+ border-right: .25em solid var(--blockquote-border-color);
+ color: var(--blockquote-text-color);
+}
+
+.category {
+ padding: 4px 6px;
+ border-radius: 3px;
+ color: var(--tag-color) !important;
+ background-color: var(--secondary-bg-color);
+ border: 1px solid var(--border-color);
+}
+
+.tag::before {
+ content: "#";
+ opacity: .5;
+}
+
+.tag,
+.category {
+ display: inline-block;
+ font-size: 15px;
+ line-height: 1;
+ margin: 5px 0 5px 8px;
+}
+
+pre {
+ background-color: var(--pre-bg-color);
+ padding: 5px;
+ display: block;
+ overflow-x: auto;
+}
+
+.info i {
+ opacity: 0.5;
+ margin-left: 5px;
+}
+
+a:link,
+a:visited {
+ opacity: 1;
+ color: var(--tag-color);
+}
+
+a:hover,
+a:active {
+ color: #2660ab;
+}
+
+/*basic styles ends*/
+/*animation starts*/
+
+.animated {
+ transition: top .8s linear;
+ -webkit-animation-duration: 1s;
+ -moz-animation-duration: 1s;
+ -ms-animation-duration: 1s;
+ -o-animation-duration: 1s;
+ animation-duration: 1s;
+}
+
+.animated.hinge {
+ -webkit-animation-duration: 1s;
+ -moz-animation-duration: 1s;
+ -ms-animation-duration: 1s;
+ -o-animation-duration: 1s;
+ animation-duration: 1s;
+}
+
+@-webkit-keyframes fadeInDown {
+ 0% {
+ -webkit-transform: translateY(-20px);
+ }
+
+ 100% {
+ -webkit-transform: translateY(0);
+ }
+}
+
+@-moz-keyframes fadeInDown {
+ 0% {
+ -moz-transform: translateY(-20px);
+ }
+
+ 100% {
+ -moz-transform: translateY(0);
+ }
+}
+
+@-o-keyframes fadeInDown {
+ 0% {
+ -o-transform: translateY(-20px);
+ }
+
+ 100% {
+ -o-transform: translateY(0);
+ }
+}
+
+@keyframes fadeInDown {
+ 0% {
+ transform: translateY(-20px);
+ }
+
+ 100% {
+ transform: translateY(0);
+ }
+}
+
+.fadeInDown {
+ -webkit-animation-name: fadeInDown;
+ -moz-animation-name: fadeInDown;
+ -o-animation-name: fadeInDown;
+ animation-name: fadeInDown;
+}
+
+/*animation ends*/
+.content {
+ height: auto;
+ float: left;
+ width: 60%;
+ margin-top: 60px;
+}
+
+.page-top {
+ width: 60%;
+ position: fixed;
+ left: 0;
+ z-index: 3;
+ background-color: var(--bg-color);
+ height: 60px;
+ border-bottom: 1px solid var(--border-color);
+}
+
+.page-top .nav {
+ list-style: none;
+ padding: 11px 30px;
+ float: right;
+ font-size: 12px;
+ display: block;
+ width: calc(100% - 30px);
+}
+
+.page-top .nav li {
+ position: relative;
+ display: initial;
+ padding-left: 20px;
+}
+
+.page-top .nav a {
+ color: var(--nav-text-color);
+}
+
+.page-top .nav a:hover {
+ color: #2660ab;
+}
+
+.page-top .nav a.current {
+ color: var(--nav-text-color);
+ padding-bottom: 22px;
+ border-bottom: 1px solid var(--nav-text-color);
+}
+
+.theme-switch-item {
+ float: left;
+ font-size: 2em;
+ margin-top: -5px;
+}
+
+.page-top .information {
+ float: left;
+ padding-top: 12px;
+ padding-left: 20px;
+}
+
+.page-top .information .avatar {
+ float: left;
+}
+
+.page-top .information .avatar img {
+ width: 32px;
+ height: 32px;
+ border-radius: 300px;
+}
+
+.page-top .information .back_btn {
+ float: right;
+ padding-top: 5px;
+ margin-left: -10px;
+}
+
+.page-top .information .back_btn li {
+ display: initial;
+ padding-left: 40px;
+}
+
+.sidebar {
+ width: 40%;
+ -webkit-background-size: cover;
+ background-size: cover;
+ background-color: var(--bg-color);
+ height: 100%;
+ top: 0;
+ right: 0;
+ position: fixed;
+ z-index: 4;
+ border-left: 1px solid var(--border-color);
+ display: flex;
+ flex-direction: column;
+ min-height: 100%;
+}
+
+.sidebar .logo-title {
+ text-align: center;
+ padding-top: 240px;
+ flex: 1;
+}
+
+.sidebar .logo-title .description {
+ font-size: 14px;
+ margin: 0 1em;
+}
+
+.sidebar .logo-title .logo {
+ margin: 0 auto;
+}
+
+.sidebar .logo-title .title img {
+ width: 127px;
+ border-radius: 50%;
+}
+
+.sidebar .logo-title .title h3 {
+ text-transform: uppercase;
+ font-size: 2rem;
+ font-weight: bold;
+ letter-spacing: 2px;
+ line-height: 1;
+ margin: 1em;
+}
+
+.sidebar .logo-title .title a {
+ text-decoration: none;
+ color: var(--heading-color);
+ font-size: 2rem;
+ font-weight: bold;
+}
+
+.sidebar .social-links {
+ list-style: none;
+ padding: 0;
+ font-size: 14px;
+ text-align: center;
+ flex: 7;
+}
+
+.sidebar .social-links i {
+ margin-left: 3px;
+}
+
+.sidebar .social-links li {
+ display: inline;
+ padding: 0 4px;
+ line-height: 0;
+}
+
+.sidebar .social-links a {
+ color: var(--heading-color);
+}
+
+.sidebar .social-links a:hover {
+ color: #2660ab;
+}
+
+.post {
+ background-color: var(--bg-color);
+ margin: 30px;
+}
+
+.post .post-title h1 {
+ text-transform: uppercase;
+ font-size: 30px;
+ letter-spacing: 5px;
+ line-height: 1;
+}
+
+.post .post-title h2 {
+ text-transform: uppercase;
+ letter-spacing: 1px;
+ font-size: 28px;
+ line-height: 1;
+ font-weight: 600;
+ color: var(--heading-color);
+}
+
+.post .post-title h3 {
+ text-transform: uppercase;
+ letter-spacing: 1px;
+ line-height: 1;
+ font-weight: 600;
+ /* color: #464646; */
+ color: var(--heading-color);
+ font-size: 22px;
+ margin: 0;
+}
+
+.post .post-title a {
+ text-decoration: none;
+ letter-spacing: 1px;
+ color: var(--heading-color);
+}
+
+.post .post-title a:hover {
+ text-decoration: underline;
+}
+
+.post .post-content a {
+ text-decoration: none;
+ letter-spacing: 1px;
+ color: #2660ab;
+ overflow-wrap: break-word;
+ word-wrap: break-word;
+}
+
+.post .post-content a:hover {
+ color: #2F69B3;
+}
+
+.post .post-content h3 {
+ font-size: 22px;
+ font-weight: 600;
+}
+
+.post .post-content h4 {
+ /* color: var(--heading-color); */
+ font-size: 16px;
+}
+
+.post .post-content img {
+ max-width: 100%;
+}
+
+.post .post-footer {
+ padding: 0 0 10px 0;
+ border-bottom: 1px solid var(--border-color);
+}
+
+.post .post-footer .meta {
+ max-width: 100%;
+ display: flex;
+ color: #bbbbbb;
+}
+
+.post .post-footer .meta .info {
+ float: right;
+ font-size: 12px;
+ margin-bottom: 1em;
+ color: var(--body-color);
+}
+
+.post .post-footer .info .separator a {
+ margin-left: 0.2em;
+}
+
+.post .post-footer .meta .info .date {
+ margin-left: 10px;
+ margin-right: 5px
+}
+
+.post figure {
+ max-width: 100%;
+ height: auto;
+ margin: 0;
+ text-align: center;
+}
+
+.post figure.right {
+ float: left;
+ margin-right: 1.5em;
+ max-width: 50%;
+}
+
+.post figure.left {
+ float: right;
+ margin-left: 1.5em;
+ max-width: 50%;
+}
+
+.post figure.big {
+ max-width: 100vw;
+}
+
+.info {
+ margin: 1em;
+}
+
+.info span {
+ margin-left: 0.5em;
+}
+
+.post .post-footer .meta a {
+ text-decoration: none;
+ color: var(--body-color);
+}
+
+.post .post-footer .meta a:hover {
+ color: #2660ab;
+}
+
+.post .post-footer .meta i {
+ margin-left: 6px;
+}
+
+.post .post-footer .tags {
+ padding-bottom: 15px;
+ font-size: 13px;
+}
+
+.post .post-footer .tags ul {
+ list-style-type: none;
+ display: inline;
+ margin: 0;
+ padding: 0;
+}
+
+.post .post-footer .tags ul li {
+ list-style-type: none;
+ margin: 0;
+ padding-left: 5px;
+ display: inline;
+}
+
+.post .post-footer .tags a {
+ text-decoration: none;
+ color: var(--post-color);
+ font-weight: 400;
+}
+
+.post .post-footer .tags a:hover {
+ text-decoration: none;
+}
+
+.post .post-thumbnail {
+ width: 100%;
+ padding-bottom: 1em;
+ box-shadow: black;
+ border-radius: 0.5em;
+ overflow: hidden;
+ transition: box-shadow .3s ease;
+
+}
+
+.post .post-thumbnail img {
+ width: 100%;
+ height: var(--thumbnail-height);
+ object-fit: cover;
+ border: 1px solid var(--border-color);
+ border-bottom: 0px;
+}
+
+.pagination {
+ margin: 30px;
+ padding: 0px 0 56px 0;
+ text-align: center;
+}
+
+.pagination ul {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ height: 13px;
+}
+
+.pagination ul li {
+ margin: 0 2px 0 2px;
+ display: inline;
+ line-height: 1;
+}
+
+.pagination ul li a {
+ text-decoration: none;
+ color: var(--body-color);
+}
+
+.pagination .pre {
+ float: right;
+}
+
+.pagination .next {
+ float: left;
+}
+
+.like-reblog-buttons {
+ float: left;
+}
+
+.like-button {
+ float: left;
+ padding: 0 10px 0 0;
+}
+
+.reblog-button {
+ float: left;
+ padding: 0;
+}
+
+#install-btn {
+ position: fixed;
+ bottom: 0px;
+ left: 6px;
+}
+
+#disqus_thread {
+ margin: 30px;
+ border-bottom: 1px solid var(--border-color);
+}
+
+.footer {
+ clear: both;
+ text-align: center;
+ font-size: 10px;
+ margin: 0 auto;
+ bottom: 0;
+ width: 100%;
+ padding-bottom: 20px;
+ flex: 0;
+ position: relative;
+}
+
+.footer a {
+ color: #A6A6A6;
+}
+
+.footer a:hover {
+ color: #2660ab;
+}
+
+/*for archive*/
+.archive {
+ width: 100%;
+}
+
+.list-with-title {
+ font-size: 14px;
+ margin: 30px;
+ padding: 0;
+}
+
+.list-with-title li {
+ list-style-type: none;
+ padding: 0;
+}
+
+.list-with-title .listing-title {
+ font-size: 24px;
+ color: #666666;
+ font-weight: 600;
+ line-height: 2.2em;
+}
+
+.list-with-title .listing {
+ padding: 0;
+}
+
+.list-with-title .listing .listing-post {
+ padding-bottom: 5px;
+}
+
+.list-with-title .listing .listing-post .post-time {
+ float: left;
+ display: inline-block;
+ max-width: 10%;
+ text-align: left;
+ color: #C5C5C5;
+}
+
+.list-with-title .listing .listing-post a {
+ color: #8F8F8F;
+ width: 90%;
+ display: inline-block;
+}
+
+.list-with-title .listing .listing-post a:hover {
+ color: #2660ab;
+}
+
+/* share */
+.share {
+ margin: 0px 30px;
+ display: inline-flex;
+}
+
+.evernote {
+ width: 32px;
+ height: 32px;
+ border-radius: 300px;
+ background-color: #3E3E3E;
+ margin-left: 5px;
+}
+
+.evernote a {
+ color: #fff;
+ padding: 11px;
+ font-size: 12px;
+}
+
+.evernote a:hover {
+ color: #ED6243;
+ padding: 11px;
+}
+
+.weibo {
+ width: 32px;
+ height: 32px;
+ border-radius: 300px;
+ background-color: #ED6243;
+ margin-left: 5px;
+}
+
+.weibo a {
+ color: #fff;
+ padding: 9px;
+}
+
+.weibo a:hover {
+ color: #BD4226;
+}
+
+.twitter {
+ width: 32px;
+ height: 32px;
+ border-radius: 300px;
+ background-color: #59C0FD;
+ margin-left: 5px;
+}
+
+.twitter a {
+ color: #fff;
+ padding: 9px;
+}
+
+.twitter a:hover {
+ color: #4B9ECE;
+}
+
+/* about */
+.about {
+ margin: 30px;
+}
+
+.about h3 {
+ font-size: 22px;
+}
+
+/* links*/
+.links {
+ margin: 30px;
+}
+
+.links h3 {
+ font-size: 22px;
+}
+
+.links a {
+ cursor: pointer;
+}
+
+/* Comments */
+.comment-count {
+ color: #666;
+}
+
+.tab-community {
+ color: #666;
+}
+
+.read_more {
+ font-size: 14px;
+}
+
+.back-button {
+ padding-top: 30px;
+ max-width: 100px;
+ padding-right: 40px;
+ float: right;
+}
+
+/* Facebook Comments */
+#fb_comments_container {
+ margin: 30px;
+}
+
+.utterances {
+ max-width: unset;
+}
+
+/* Buttons */
+a.btn {
+ color: #868686;
+ font-weight: 400;
+}
+
+.btn {
+ display: inline-block;
+ position: relative;
+ outline: 0;
+ color: var(--post-color);
+ background: transparent;
+ font-size: 14px;
+ text-align: center;
+ text-decoration: none;
+ cursor: pointer;
+ border: 1px solid var(--border-color);
+ white-space: nowrap;
+ font-weight: 400;
+ font-style: normal;
+ border-radius: 999em;
+}
+
+.btn:hover {
+ display: inline-block;
+ position: relative;
+ outline: 0px;
+ color: #464545;
+ background: transparent;
+ font-size: 14px;
+ text-align: center;
+ text-decoration: none;
+ cursor: pointer;
+ border: 1px solid #464545;
+ white-space: nowrap;
+ font-weight: 400;
+ font-style: normal;
+ border-radius: 999em;
+}
+
+[role="back"] {
+ padding: 0.5em 1.25em;
+ line-height: 1.666em;
+}
+
+[role="home"] {
+ padding: 0.5em 1.25em;
+ line-height: 1.666em;
+}
+
+[role="navigation"] {
+ padding: 0.5em 1.25em;
+ line-height: 1.666em;
+}
+
+[role="tags"] {
+ padding: 6px 12px;
+}
+
+/* Menu */
+.menu {
+ float: left;
+ padding-top: 30px;
+}
+
+.menu .btn-down {
+ margin: 0px;
+}
+
+.menu .btn-down li {
+ list-style: none;
+ width: 100px;
+}
+
+.menu .btn-down li a {
+ display: inline-block;
+ position: relative;
+ padding: 0.5em 1.25em;
+ outline: 0;
+ color: var(--post-color);
+ background: transparent;
+ font-size: 14px;
+ text-align: center;
+ text-decoration: none;
+ cursor: pointer;
+ border: 1px solid var(--border-color);
+ white-space: nowrap;
+ font-weight: 400;
+ font-style: normal;
+ border-radius: 999em;
+ margin-top: 5px;
+}
+
+.menu .btn-down li a:hover {
+ position: relative;
+ padding: 0.5em 1.25em;
+ outline: 0;
+ color: #fff;
+ background: #3CBD10;
+ font-size: 14px;
+ text-align: center;
+ text-decoration: none;
+ cursor: pointer;
+ border: 1px solid rgba(0, 0, 0, 0.15);
+ white-space: nowrap;
+ font-weight: 400;
+ font-style: normal;
+ border-radius: 999em;
+ margin-top: 5px;
+}
+
+.menu .btn-down div {
+ position: absolute;
+ visibility: hidden;
+ width: 100px;
+ float: left;
+}
+
+.page_404 {
+ text-align: center;
+ padding-top: 50px;
+}
+
+.navbar-burger {
+ display: none;
+}
+
+@media screen and (max-width: 960px),
+print {
+ .sidebar {
+ width: 100%;
+ position: absolute;
+ border-left: none;
+ z-index: 1;
+ }
+
+ .sidebar .logo-title {
+ padding-top: 120px;
+ }
+
+ .sidebar .logo-title .title img {
+ width: 100px;
+ }
+
+ .sidebar .logo-title .title h3 {
+ font-size: 20px;
+ }
+
+ .page-top {
+ width: 100%;
+ }
+
+ .post-title h3 {
+ line-height: 1.6;
+ }
+
+ .content {
+ margin-top: 420px;
+ width: 100%;
+ z-index: 2;
+ position: absolute;
+ }
+
+ .post figure.right {
+ float: unset;
+ max-width: 100%;
+ margin: 0;
+ }
+
+ .post figure.left {
+ float: unset;
+ max-width: 100%;
+ margin: 0;
+ }
+
+
+ .footer {
+ display: none;
+ }
+
+ .share {
+ display: grid;
+ }
+
+ .page-top .nav {
+ background-color: var(--secondary-bg-color);
+ box-shadow: 0 8px 16px rgba(10, 10, 10, .1);
+ padding: .5rem 0;
+ width: 100%;
+ display: none;
+ margin-top: 0px;
+ }
+
+ .page-top .nav.is-active {
+ /* display: block; */
+ display: block;
+ }
+
+ .page-top .nav li {
+ display: block;
+ flex-grow: 0;
+ flex-shrink: 0;
+ line-height: 2.5;
+ padding: .5rem .75rem;
+ position: relative;
+ text-transform: uppercase;
+ text-align: center;
+ font-size: 1.3em;
+ }
+
+ .page-top .nav a.current {
+ border-bottom: none;
+ }
+
+ .navbar-burger {
+ cursor: pointer;
+ display: block;
+ height: 3.25rem;
+ position: relative;
+ width: 3.25rem;
+ margin-right: auto;
+ }
+
+ .navbar-burger span {
+ background-color: var(--heading-color);
+ display: block;
+ height: 1px;
+ right: calc(50% - 8px);
+ position: absolute;
+ transform-origin: center;
+ transition-duration: 86ms;
+ transition-property: background-color, opacity, transform;
+ transition-timing-function: ease-out;
+ width: 16px;
+ }
+
+ .navbar-burger span:nth-child(1) {
+ top: calc(50% - 6px);
+ }
+
+ .navbar-burger span:nth-child(2) {
+ top: calc(50% - 1px);
+ }
+
+ .navbar-burger span:nth-child(3) {
+ top: calc(50% + 4px);
+ }
+
+ .theme-switch-item {
+ float: none;
+ }
+
+ .list-with-title .listing .listing-post .post-time {
+ max-width: 20%;
+ }
+
+ .list-with-title .listing .listing-post a {
+ width: 80%;
+ }
+}
+
+/* Medium zoom */
+.medium-zoom-overlay {
+ position: fixed;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ opacity: 0;
+ transition: opacity 300ms;
+ will-change: opacity;
+ background: var(--bg-color);
+}
+
+.medium-zoom--opened .medium-zoom-overlay {
+ cursor: pointer;
+ cursor: zoom-out;
+ opacity: 1;
+}
+
+.medium-zoom-image {
+ cursor: pointer;
+ cursor: zoom-in;
+ /*
+ The `transition` is marked as "!important" for the animation to happen
+ even though it's overriden by another inline `transition` style attribute.
+ This is problematic with frameworks that generate inline styles on their
+ images (e.g. Gatsby).
+ See https://github.com/francoischalifour/medium-zoom/issues/110
+ */
+ transition: transform 300ms cubic-bezier(0.2, 0, 0.2, 1) !important;
+ z-index: 100;
+}
+
+.medium-zoom-image--hidden {
+ visibility: hidden;
+}
+
+.medium-zoom-image--opened {
+ position: relative;
+ cursor: pointer;
+ cursor: zoom-out;
+ will-change: transform;
+}
+
+@media print {
+ .page-top {
+ display: none;
+ }
+}
+
+@media (min-width: 1921px){
+ .content {
+ padding-left: 25%;
+ width: 35%;
+ }
+ .sidebar {
+ padding-right: 15%;
+ width: 25%;
+ }
+}
+
+
+/* (CONTACT) FORM */
+
+.contact-form {
+ margin-top: 30px;
+}
+.form-style{
+ width: 100%;
+}
+.form-style ul {
+ padding: 0;
+ margin: 0;
+ list-style: none;
+}
+.form-style ul li {
+ display: block;
+ margin-bottom: 10px;
+ min-height: 35px;
+}
+.form-style ul li .field-style {
+ box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ font-size: 14px;
+ padding: 8px;
+ outline: none;
+ background-color: var(--bg-color);
+ border: 1px solid var(--form-border-color);
+ color: var(--body-color);
+}
+.form-style ul li .field-style:focus {
+ box-shadow: 0 0 5px;
+ border:1px solid;
+}
+.form-style ul li .field-split {
+ width: 49%;
+}
+.form-style ul li .field-full {
+ width: 100%;
+}
+.form-style ul li input.align-left {
+ float:right;
+}
+.form-style ul li input.align-right {
+ float:left;
+}
+.form-style ul li textarea {
+ background-color: var(--bg-color);
+ border: 1px solid var(--form-border-color);
+ color: var(--body-color);
+ width: 100%;
+ height: auto;
+}
+.form-style ul li input[type="button"],
+.form-style ul li input[type="submit"] {
+ background-color: var(--bg-color);
+ border: 1px solid var(--form-border-color);
+ display: inline-block;
+ cursor: pointer;
+ color: var(--body-color);
+ text-decoration: none;
+ width: 100%;
+}
+.form-style ul li input[type="button"]:hover,
+.form-style ul li input[type="submit"]:hover {
+ background-color: var(--bg-color);
+ border: 1px solid var(--form-button-hover-border-color);
+}
+
+/* (CONTACT) FORM END */
diff --git a/exampleSite/config.toml b/exampleSite/config.toml
deleted file mode 100644
index b7f2f7a..0000000
--- a/exampleSite/config.toml
+++ /dev/null
@@ -1,106 +0,0 @@
-baseURL = "https://example.com"
-languageCode = "en"
-DefaultContentLanguage = "en"
-title = "Website of Jane Doe"
-theme = "anatole"
-summarylength = 10
-enableEmoji = true
-enableRobotsTXT = true
-
-# Enable Disqus
-#disqusShortname = ""
-
-# Google Analytics
-#googleAnalytics = "UA-123-45"
-
-# Syntax highlighting
-pygmentsUseClasses = true
-pygmentsCodeFences = true
-pygmentsCodefencesGuessSyntax = true
-
-[params]
-title = "I'm Jane Doe"
-author = "Jane Doe"
-#copyright = "2020-2021"
-description = "Call me Jane"
-profilePicture = "images/profile.jpg"
-keywords = ""
-favicon = "favicons/"
-# example ["css/custom.css"]
-customCss = []
-# example ["js/custom.js"]
-customJs = []
-mainSections = ["post"]
-images = ["images/site-feature-image.png"]
-doNotLoadAnimations = false
-# Form Spree Contact Form
-#contactFormAction = "https://formspree.io/f/your-form-hash-here"
-# Google Site Verify
-#googleSiteVerify = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"
-# indexDateFormat = "Mon, Jan 2, 2006"
-# listDateFormat = "Jan 2"
-# singleDateFormat = "Mon, Jan 2, 2006"
-# Commento Comments
-# CommentoURL = "https://commento.example.com/js/commento.js"
-# Read More links for truncated summaries
-# readMore = true
-# postSectionName = "blog"
-
-[params.simpleAnalytics]
-# enable = true
-# customurl = "https://analytics.example.com"
-
-## Math settings
-[params.math]
-enable = false # options: true, false. Enable math support globally, default: false. You can always enable math on per page.
-use = "katex" # options: "katex", "mathjax". default is "katex".
-
-## Social links
-# use 'fab' when brand icons, use 'fas' when standard solid icons.
-[[params.socialIcons]]
-icon = "fab fa-linkedin"
-title = "Linkedin"
-url = "https://de.linkedin.com/"
-
-[[params.socialIcons]]
-icon = "fab fa-github"
-title = "GitHub"
-url = "https://github.com/lxndrblz/anatole/"
-
-[[params.socialIcons]]
-icon = "fab fa-instagram"
-title = "instagram"
-url = "https://www.instagram.com/"
-
-[[params.socialIcons]]
-icon = "fas fa-envelope"
-title = "e-mail"
-url = "mailto:mail@example.com"
-
-## Menu items
-
-[menu]
-
- [[menu.main]]
- name = "Home"
- identifier = "home"
- weight = 100
- url = "/"
-
- [[menu.main]]
- name = "Posts"
- weight = 200
- identifier = "posts"
- url = "/post/"
-
- [[menu.main]]
- name = "About"
- weight = 300
- identifier = "about"
- url = "/about/"
-
- [[menu.main]]
- name = "Contact"
- weight = 400
- identifier = "contact"
- url = "/contact/"
diff --git a/exampleSite/config/_default/config.toml b/exampleSite/config/_default/config.toml
new file mode 100644
index 0000000..b9af4d7
--- /dev/null
+++ b/exampleSite/config/_default/config.toml
@@ -0,0 +1,19 @@
+baseURL = "https://example.com"
+languageCode = "en"
+DefaultContentLanguage = "en"
+title = "Website of Jane Doe"
+theme = "anatole"
+summarylength = 10
+enableEmoji = true
+enableRobotsTXT = true
+
+# Enable Disqus
+#disqusShortname = ""
+
+# Google Analytics
+#googleAnalytics = "UA-123-45"
+
+# Syntax highlighting
+pygmentsUseClasses = true
+pygmentsCodeFences = true
+pygmentsCodefencesGuessSyntax = true
\ No newline at end of file
diff --git a/exampleSite/config/_default/languages.toml b/exampleSite/config/_default/languages.toml
new file mode 100644
index 0000000..94fd999
--- /dev/null
+++ b/exampleSite/config/_default/languages.toml
@@ -0,0 +1,13 @@
+[en]
+title = "My blog"
+weight = 1
+LanguageName = "EN"
+contentDir = "content/english"
+
+[ar]
+title = "عربي"
+description = "أنا أحمد"
+contentDir = "content/arabic"
+weight = 2
+LanguageDirection = "rtl"
+LanguageName = "AR"
\ No newline at end of file
diff --git a/exampleSite/config/_default/menus.ar.toml b/exampleSite/config/_default/menus.ar.toml
new file mode 100644
index 0000000..c78242d
--- /dev/null
+++ b/exampleSite/config/_default/menus.ar.toml
@@ -0,0 +1,23 @@
+ [[main]]
+ name = "الرئيسية"
+ identifier = "main"
+ weight = 100
+ url = "/ar"
+
+ [[main]]
+ name = "المنشورات"
+ weight = 200
+ identifier = "posts"
+ url = "/ar/post"
+
+ [[main]]
+ name = "حول"
+ weight = 300
+ identifier = "about"
+ url = "/ar/about"
+
+ [[main]]
+ name = "للتواصل"
+ weight = 400
+ identifier = "contact"
+ url = "/ar/contact"
\ No newline at end of file
diff --git a/exampleSite/config/_default/menus.en.toml b/exampleSite/config/_default/menus.en.toml
new file mode 100644
index 0000000..7250656
--- /dev/null
+++ b/exampleSite/config/_default/menus.en.toml
@@ -0,0 +1,23 @@
+ [[main]]
+ name = "Home"
+ identifier = "home"
+ weight = 100
+ url = "/"
+
+ [[main]]
+ name = "Posts"
+ weight = 200
+ identifier = "posts"
+ url = "/post/"
+
+ [[main]]
+ name = "About"
+ weight = 300
+ identifier = "about"
+ url = "/about/"
+
+ [[main]]
+ name = "Contact"
+ weight = 400
+ identifier = "contact"
+ url = "/contact/"
\ No newline at end of file
diff --git a/exampleSite/config/_default/params.toml b/exampleSite/config/_default/params.toml
new file mode 100644
index 0000000..e6faf08
--- /dev/null
+++ b/exampleSite/config/_default/params.toml
@@ -0,0 +1,59 @@
+
+title = "I'm Jane Doe"
+author = "Jane Doe"
+#copyright = "2020-2021"
+description = "Call me Jane"
+profilePicture = "images/profile.jpg"
+keywords = ""
+favicon = "favicons/"
+# example ["css/custom.css"]
+customCss = []
+# example ["js/custom.js"]
+customJs = []
+mainSections = ["post"]
+images = ["images/site-feature-image.png"]
+doNotLoadAnimations = false
+# Form Spree Contact Form
+#contactFormAction = "https://formspree.io/f/your-form-hash-here"
+# Google Site Verify
+#googleSiteVerify = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"
+singleDateFormat = "2/1/2006"
+indexDateFormat = "2/1/2006"
+listDateFormat = "2/1/2006"
+# Commento Comments
+# CommentoURL = "https://commento.example.com/js/commento.js"
+# Read More links for truncated summaries
+# readMore = true
+# postSectionName = "blog"
+
+
+[simpleAnalytics]
+# enable = true
+# customurl = "https://analytics.example.com"
+
+## Math settings
+[math]
+enable = false # options: true, false. Enable math support globally, default: false. You can always enable math on per page.
+use = "katex" # options: "katex", "mathjax". default is "katex".
+
+## Social links
+# use 'fab' when brand icons, use 'fas' when standard solid icons.
+[[socialIcons]]
+icon = "fab fa-linkedin"
+title = "Linkedin"
+url = "https://de.linkedin.com/"
+
+[[socialIcons]]
+icon = "fab fa-github"
+title = "GitHub"
+url = "https://github.com/lxndrblz/anatole/"
+
+[[socialIcons]]
+icon = "fab fa-instagram"
+title = "instagram"
+url = "https://www.instagram.com/"
+
+[[socialIcons]]
+icon = "fas fa-envelope"
+title = "e-mail"
+url = "mailto:mail@example.com"
\ No newline at end of file
diff --git a/exampleSite/content/_index.md b/exampleSite/content/arabic/_index.md
similarity index 100%
rename from exampleSite/content/_index.md
rename to exampleSite/content/arabic/_index.md
diff --git a/exampleSite/content/arabic/about.md b/exampleSite/content/arabic/about.md
new file mode 100644
index 0000000..29685dd
--- /dev/null
+++ b/exampleSite/content/arabic/about.md
@@ -0,0 +1,12 @@
++++
+title = "حول"
+description = "Hugo, the world's fastest framework for building websites"
+date = "2019-02-28"
+aliases = ["about-us", "about-hugo", "contact"]
+author = "Hugo Authors"
++++
+
+هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة، لقد تم توليد هذا النص من مولد النص العربى، حيث يمكنك أن تولد مثل هذا النص أو العديد من النصوص الأخرى إضافة إلى زيادة عدد الحروف التى يولدها التطبيق.
+إذا كنت تحتاج إلى عدد أكبر من الفقرات يتيح لك مولد النص العربى زيادة عدد الفقرات كما تريد، النص لن يبدو مقسما ولا يحوي أخطاء لغوية، مولد النص العربى مفيد لمصممي المواقع على وجه الخصوص، حيث يحتاج العميل فى كثير من الأحيان أن يطلع على صورة حقيقية لتصميم الموقع.
+ومن هنا وجب على المصمم أن يضع نصوصا مؤقتة على التصميم ليظهر للعميل الشكل كاملاً،دور مولد النص العربى أن يوفر على المصمم عناء البحث عن نص بديل لا علاقة له بالموضوع الذى يتحدث عنه التصميم فيظهر بشكل لا يليق.
+هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق، أو حتى غير مفهوم. لأنه مازال نصاً بديلاً ومؤقتاً.
\ No newline at end of file
diff --git a/exampleSite/content/archives.md b/exampleSite/content/arabic/archives.md
similarity index 100%
rename from exampleSite/content/archives.md
rename to exampleSite/content/arabic/archives.md
diff --git a/exampleSite/content/arabic/contact.md b/exampleSite/content/arabic/contact.md
new file mode 100644
index 0000000..3dd64ad
--- /dev/null
+++ b/exampleSite/content/arabic/contact.md
@@ -0,0 +1,7 @@
+---
+author: Hugo Authors
+title: للتواصل
+date: 2019-03-08
+description: Contact Page
+contact: true
+---
diff --git a/exampleSite/content/post/_index.md b/exampleSite/content/arabic/post/_index.md
similarity index 100%
rename from exampleSite/content/post/_index.md
rename to exampleSite/content/arabic/post/_index.md
diff --git a/exampleSite/content/arabic/post/arabic_example.md b/exampleSite/content/arabic/post/arabic_example.md
new file mode 100644
index 0000000..6414f47
--- /dev/null
+++ b/exampleSite/content/arabic/post/arabic_example.md
@@ -0,0 +1,18 @@
++++
+author = "كتاب المقال"
+title = "نموذج عربي"
+date = "2019-03-05"
+description = "نص عربي سريع"
+tags = [
+ "عربي",
+]
++++
+ من مولد النص العربى، حيث يمكنك أن تولد مثل هذا النص أو العديد من النصوص الأخرى إضافة إلى زيادة عدد الحروف التى يولدها التطبيق.
+إذا كنت تحتاج إلى عدد أكبر من الفقرات يتيح لك مولد النص العربى زيادة عدد الفقرات كما تريد، النص لن يبدو مقسما ولا يحوي أخطاء لغوية، مولد النص العربى مفيد لمصممي المواقع على وجه الخصوص، حيث يحتاج العميل فى كثير من الأحيان أن يطلع على صورة حقيقية لتصميم الموقع.
+ومن هنا وجب على المصمم أن يضع نصوصا مؤقتة على التصميم ليظهر للعميل الشكل كاملاً،دور مولد النص العربى أن يوفر على المصمم عناء البحث عن نص بديل لا علاقة له بالموضوع الذى يتحدث عنه التصميم فيظهر بشكل لا يليق.
+هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق، أو حتى غير مفهوم. لأنه مازال نصاً بديلاً ومؤقتاً.
+
+هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة، لقد تم توليد هذا النص من مولد النص العربى، حيث يمكنك أن تولد مثل هذا النص أو العديد من النصوص الأخرى إضافة إلى زيادة عدد الحروف التى يولدها التطبيق.
+إذا كنت تحتاج إلى عدد أكبر من الفقرات يتيح لك مولد النص العربى زيادة عدد الفقرات كما تريد، النص لن يبدو مقسما ولا يحوي أخطاء لغوية، مولد النص العربى مفيد لمصممي المواقع على وجه الخصوص، حيث يحتاج العميل فى كثير من الأحيان أن يطلع على صورة حقيقية لتصميم الموقع.
+ومن هنا وجب على المصمم أن يضع نصوصا مؤقتة على التصميم ليظهر للعميل الشكل كاملاً،دور مولد النص العربى أن يوفر على المصمم عناء البحث عن نص بديل لا علاقة له بالموضوع الذى يتحدث عنه التصميم فيظهر بشكل لا يليق.
+هذا النص يمكن أن يتم تركيبه على أي تصميم دون مشكلة فلن يبدو وكأنه نص منسوخ، غير منظم، غير منسق، أو حتى غير مفهوم. لأنه مازال نصاً بديلاً ومؤقتاً.
\ No newline at end of file
diff --git a/exampleSite/content/_index.md b/exampleSite/content/english/_index.md
similarity index 100%
copy from exampleSite/content/_index.md
copy to exampleSite/content/english/_index.md
diff --git a/exampleSite/content/about.md b/exampleSite/content/english/about.md
similarity index 100%
rename from exampleSite/content/about.md
rename to exampleSite/content/english/about.md
diff --git a/exampleSite/content/archives.md b/exampleSite/content/english/archives.md
similarity index 100%
copy from exampleSite/content/archives.md
copy to exampleSite/content/english/archives.md
diff --git a/exampleSite/content/contact.md b/exampleSite/content/english/contact.md
similarity index 100%
rename from exampleSite/content/contact.md
rename to exampleSite/content/english/contact.md
diff --git a/exampleSite/content/post/_index.md b/exampleSite/content/english/post/_index.md
similarity index 100%
copy from exampleSite/content/post/_index.md
copy to exampleSite/content/english/post/_index.md
diff --git a/exampleSite/content/post/emoji-support.md b/exampleSite/content/english/post/emoji-support.md
similarity index 100%
rename from exampleSite/content/post/emoji-support.md
rename to exampleSite/content/english/post/emoji-support.md
diff --git a/exampleSite/content/post/figure-shortcode.md b/exampleSite/content/english/post/figure-shortcode.md
similarity index 100%
rename from exampleSite/content/post/figure-shortcode.md
rename to exampleSite/content/english/post/figure-shortcode.md
diff --git a/exampleSite/content/post/image-test.md b/exampleSite/content/english/post/image-test.md
similarity index 100%
rename from exampleSite/content/post/image-test.md
rename to exampleSite/content/english/post/image-test.md
diff --git a/exampleSite/content/post/markdown-syntax.md b/exampleSite/content/english/post/markdown-syntax.md
similarity index 100%
rename from exampleSite/content/post/markdown-syntax.md
rename to exampleSite/content/english/post/markdown-syntax.md
diff --git a/exampleSite/content/post/math-typesetting.md b/exampleSite/content/english/post/math-typesetting.md
similarity index 100%
rename from exampleSite/content/post/math-typesetting.md
rename to exampleSite/content/english/post/math-typesetting.md
diff --git a/exampleSite/content/post/placeholder-text.md b/exampleSite/content/english/post/placeholder-text.md
similarity index 100%
rename from exampleSite/content/post/placeholder-text.md
rename to exampleSite/content/english/post/placeholder-text.md
diff --git a/exampleSite/content/post/rich-content.md b/exampleSite/content/english/post/rich-content.md
similarity index 100%
rename from exampleSite/content/post/rich-content.md
rename to exampleSite/content/english/post/rich-content.md
diff --git a/i18n/ar.toml b/i18n/ar.toml
new file mode 100644
index 0000000..be30c2b
--- /dev/null
+++ b/i18n/ar.toml
@@ -0,0 +1,37 @@
+[category]
+other = "التصنيفات"
+
+[tag]
+other = "الإشارات"
+
+[reading_time]
+one = "دقيقة للقراءة"
+two = "دقيقتان للقراءة"
+other = "{{ .Count }} دقائق للقراءة"
+
+[page_not_found]
+other = "لم يتم العثور على الصفحة"
+
+[page_does_not_exist]
+other = "عذرا, الصفحة غير موجودة"
+
+[head_back]
+other = "يمكنك العودة <a href=\"{{ . }}\">للصفحة الرئيسية</a>."
+
+[comments]
+other = "تعليقات"
+
+[send]
+other = "أرسل"
+
+[read_more]
+other = "اقرأ المزيد"
+
+[name]
+other = "الاسم"
+
+[email]
+other = "البريد الالكتروني"
+
+[message]
+other = "الرسالة"
\ No newline at end of file
diff --git a/i18n/de.toml b/i18n/de.toml
index b069d59..496a6c8 100644
--- a/i18n/de.toml
+++ b/i18n/de.toml
@@ -24,4 +24,13 @@
other = "Senden"
[read_more]
-other = "weiterlesen"
\ No newline at end of file
+other = "weiterlesen"
+
+[name]
+other = "Name"
+
+[email]
+other = "E-Mail Adresse"
+
+[message]
+other = "Nachricht"
\ No newline at end of file
diff --git a/i18n/dk.toml b/i18n/dk.toml
index 2ae6701..8561f4e 100644
--- a/i18n/dk.toml
+++ b/i18n/dk.toml
@@ -24,4 +24,13 @@
other = "Sende"
[read_more]
-other = "Læs mere"
\ No newline at end of file
+other = "Læs mere"
+
+[name]
+other = "Navn"
+
+[email]
+other = "e-mail-adresse"
+
+[message]
+other = "besked"
\ No newline at end of file
diff --git a/i18n/en.toml b/i18n/en.toml
index 17bbe87..d8cb255 100644
--- a/i18n/en.toml
+++ b/i18n/en.toml
@@ -24,4 +24,13 @@
other = "Send"
[read_more]
-other = "Read more"
\ No newline at end of file
+other = "Read more"
+
+[name]
+other = "Name"
+
+[email]
+other = "Email"
+
+[message]
+other = "Message"
diff --git a/i18n/es.toml b/i18n/es.toml
index 89a57e3..a1a8abe 100644
--- a/i18n/es.toml
+++ b/i18n/es.toml
@@ -24,4 +24,13 @@
other = "Enviar"
[read_more]
-other = "Leer más"
\ No newline at end of file
+other = "Leer más"
+
+[name]
+other = "Nombre"
+
+[email]
+other = "Correo electrónico"
+
+[message]
+other = "Mensaje"
\ No newline at end of file
diff --git a/i18n/fa.toml b/i18n/fa.toml
index c9172e3..06b4fc0 100644
--- a/i18n/fa.toml
+++ b/i18n/fa.toml
@@ -24,4 +24,13 @@
other = "ارسال"
[read_more]
-other = "ادامه خواندن"
\ No newline at end of file
+other = "ادامه خواندن"
+
+[name]
+other = "نام"
+
+[email]
+other = "پست الکترونیک"
+
+[message]
+other = "پیام"
\ No newline at end of file
diff --git a/i18n/fi.toml b/i18n/fi.toml
index 3596b24..5b1bfc6 100644
--- a/i18n/fi.toml
+++ b/i18n/fi.toml
@@ -24,4 +24,13 @@
other = "Lähetä"
[read_more]
-other = "Jatka lukemista"
\ No newline at end of file
+other = "Jatka lukemista"
+
+[name]
+other = "Nimi"
+
+[email]
+other = "Sähköposti"
+
+[message]
+other = "Viesti"
\ No newline at end of file
diff --git a/i18n/fr.toml b/i18n/fr.toml
index 4386b2c..f8a2a30 100644
--- a/i18n/fr.toml
+++ b/i18n/fr.toml
@@ -24,4 +24,13 @@
other = "Envoyer"
[read_more]
-other = "continuer la lecture"
\ No newline at end of file
+other = "continuer la lecture"
+
+[name]
+other = "Nom"
+
+[email]
+other = "Email"
+
+[message]
+other = "Message"
\ No newline at end of file
diff --git a/i18n/it.toml b/i18n/it.toml
index 31e3aca..b5c1bc0 100644
--- a/i18n/it.toml
+++ b/i18n/it.toml
@@ -24,4 +24,13 @@
other = "Spedire"
[read_more]
-other = "Continua a leggere"
\ No newline at end of file
+other = "Continua a leggere"
+
+[name]
+other = "Nome"
+
+[email]
+other = "Email"
+
+[message]
+other = "Messaggio"
\ No newline at end of file
diff --git a/i18n/ko.toml b/i18n/ko.toml
index 2647044..7190010 100644
--- a/i18n/ko.toml
+++ b/i18n/ko.toml
@@ -25,3 +25,12 @@
[read_more]
other = "더 읽기"
+
+[name]
+other = "이름"
+
+[email]
+other = "이메일"
+
+[message]
+other = "메시지"
\ No newline at end of file
diff --git a/i18n/pt-br.toml b/i18n/pt-br.toml
index 52f744f..deee9e3 100644
--- a/i18n/pt-br.toml
+++ b/i18n/pt-br.toml
@@ -24,4 +24,13 @@
other = "Enviar"
[read_more]
-other = "continue lendo"
\ No newline at end of file
+other = "continue lendo"
+
+[name]
+other = "Nome"
+
+[email]
+other = "Email"
+
+[message]
+other = "Mensagem"
\ No newline at end of file
diff --git a/i18n/zh-cn.toml b/i18n/zh-cn.toml
index 342f231..1f05270 100755
--- a/i18n/zh-cn.toml
+++ b/i18n/zh-cn.toml
@@ -24,4 +24,13 @@
other = "发送"
[read_more]
-other = "继续阅读"
\ No newline at end of file
+other = "继续阅读"
+
+[name]
+other = "姓名"
+
+[email]
+other = "电子邮件"
+
+[message]
+other = "信息"
\ No newline at end of file
diff --git a/i18n/zh-tw.toml b/i18n/zh-tw.toml
index c758abc..cee6520 100644
--- a/i18n/zh-tw.toml
+++ b/i18n/zh-tw.toml
@@ -24,4 +24,13 @@
other = "發送"
[read_more]
-other = "繼續閱讀"
\ No newline at end of file
+other = "繼續閱讀"
+
+[name]
+other = "名稱"
+
+[email]
+other = "電子郵件"
+
+[message]
+other = "消息"
\ No newline at end of file
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index dc92dba..9bc5f68 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -1,5 +1,5 @@
<!DOCTYPE html>
-<html lang="{{- site.Language.Lang -}}" data-theme="{{- .Site.Params.displayMode -}}">
+<html dir="{{ .Site.Language.LanguageDirection | default "ltr" }}" lang="{{- site.Language.Lang -}}" data-theme="{{- .Site.Params.displayMode -}}">
{{- partial "head.html" . -}}
<body>
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index b606eb2..cddddaf 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -13,6 +13,7 @@
{{ .Date.Format .Site.Params.singleDateFormat }}
{{ else }} {{.Date.Format "Mon, Jan 2, 2006"}}
{{ end }}</span>
+ <br>
<em class="fas fa-stopwatch"></em>
<span class="reading-time">{{ i18n "reading_time" .ReadingTime }}</span>
</div>
diff --git a/layouts/partials/contact.html b/layouts/partials/contact.html
index e598114..e7a0b68 100644
--- a/layouts/partials/contact.html
+++ b/layouts/partials/contact.html
@@ -3,12 +3,15 @@
<form class="form-style" method="POST" action="{{ .Site.Params.contactFormAction }}" data-toggle="validator">
<ul>
<li>
- <input class="field-style field-full" type="text" name="username" id="username" placeholder="Name" required>
+ <label for="username">{{ i18n "name" }}</label>
+ <input class="field-style field-full" type="text" name="username" id="username" placeholder="{{ i18n "name" }}" required>
</li>
<li>
- <input class="field-style field-full" type="email" id="email" name="email" placeholder="Email" required>
+ <label for="email">{{ i18n "email" }}</label>
+ <input class="field-style field-full" type="email" id="email" name="email" placeholder="{{i18n "email" }}" required>
</li>
<li>
+ <label for="message">{{ i18n "message" }}</label>
<textarea class="field-style" name="message" id="message" rows="6" placeholder="{{ i18n "message" }}"></textarea>
</li>
<li>
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 4b5fc23..4e1c9e1 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -11,12 +11,22 @@
{{- end -}}
<!-- CSS -->
- {{ $style := resources.Get "css/style.css" | resources.Minify | resources.Fingerprint }}
+
+ {{ if eq .Site.Language.LanguageDirection "rtl"}}
+ {{ $style := resources.Get "css/style.rtl.css" | resources.Minify | resources.Fingerprint }}
<link rel="stylesheet"
href="{{ $style.RelPermalink }}"
integrity="{{ $style.Data.Integrity }}"
crossorigin="anonymous"
type="text/css">
+ {{else}}
+ {{ $style := resources.Get "css/style.css" | resources.Minify | resources.Fingerprint }}
+ <link 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 rel="stylesheet"
href="{{ $markupHighlightStyle.RelPermalink }}"
--
Gitblit v1.10.0