diff --git a/assets/css/footer.css b/assets/css/footer.css
index 4fd3acea..cf7197f9 100644
--- a/assets/css/footer.css
+++ b/assets/css/footer.css
@@ -11,8 +11,8 @@
}
.footer span {
- margin-left: 1px;
- margin-right: 1px;
+ margin-inline-start: 1px;
+ margin-inline-end: 1px;
}
.footer a {
diff --git a/assets/css/header.css b/assets/css/header.css
index e5061d43..ef68ef48 100644
--- a/assets/css/header.css
+++ b/assets/css/header.css
@@ -5,8 +5,8 @@
flex-wrap: wrap;
justify-content: space-between;
max-width: calc(var(--nav-width) + var(--gap) * 2);
- margin-left: auto;
- margin-right: auto;
+ margin-inline-start: auto;
+ margin-inline-end: auto;
}
.nav a {
@@ -31,7 +31,7 @@
pointer-events: none;
transform: translate(0, -10%);
border-radius: 6px;
- margin-right: 8px;
+ margin-inline-end: 8px;
}
.theme-toggle svg{
@@ -56,7 +56,7 @@ body:not(.dark) #sun {
}
.menu li+li {
- margin-left: var(--gap);
+ margin-inline-start: var(--gap);
}
.menu a {
diff --git a/assets/css/main.css b/assets/css/main.css
index 8b6c492d..68f8a2f1 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -36,7 +36,7 @@
}
.pagination .next {
- margin-left: auto;
+ margin-inline-start: auto;
}
.social-icons {
@@ -44,10 +44,22 @@
}
.social-icons a:not(:last-of-type) {
- margin-right: 12px;
+ margin-inline-end: 12px;
}
.social-icons a svg {
height: 26px;
width: 26px;
-}
\ No newline at end of file
+}
+
+.direction-rtl {
+ direction: rtl;
+}
+
+.direction-ltr {
+ direction: ltr;
+}
+
+code {
+ direction: ltr;
+}
diff --git a/assets/css/post-single.css b/assets/css/post-single.css
index e472704c..57269ddf 100644
--- a/assets/css/post-single.css
+++ b/assets/css/post-single.css
@@ -85,7 +85,7 @@
.post-content ul,
.post-content ol {
- padding-left: 20px;
+ padding-inline-start: 20px;
}
.post-content li {
@@ -109,8 +109,8 @@
.post-content dd {
width: 75%;
- margin-left: 0;
- padding-left: 10px;
+ margin-inline-start: 0;
+ padding-inline-start: 10px;
}
.post-content dt~dt,
@@ -147,11 +147,11 @@
}
.post-content li>.highlight {
- margin-right: 0
+ margin-inline-end: 0
}
.post-content ul pre {
- margin-left: calc(var(--gap) * -2);
+ margin-inline-start: calc(var(--gap) * -2);
}
.post-content .highlight pre {
@@ -168,7 +168,7 @@
}
.post-content .highlighttable td .linenodiv {
- padding-right: 0 !important;
+ padding-inline-end: 0 !important;
}
.post-content .highlighttable td .linenodiv pre,
@@ -236,7 +236,7 @@
.toc details summary {
cursor: zoom-in;
- margin-left: 20px;
+ margin-inline-start: 20px;
}
.toc details[open] summary {
@@ -254,7 +254,7 @@
}
.toc li ul {
- margin-left: var(--gap);
+ margin-inline-start: var(--gap);
}
.post-footer {
@@ -263,14 +263,14 @@
.post-tags li {
display: inline-block;
- margin-right: 3px;
+ margin-inline-end: 3px;
margin-bottom: 5px;
}
.post-tags a {
display: block;
- padding-left: 14px;
- padding-right: 14px;
+ padding-inline-start: 14px;
+ padding-inline-end: 14px;
color: var(--secondary);
font-size: 14px;
line-height: 34px;
@@ -297,7 +297,7 @@
}
.share-buttons a:not(:last-of-type) {
- margin-right: 12px;
+ margin-inline-end: 12px;
}
.share-buttons a svg {
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 6deb9a91..cd999824 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -1,5 +1,5 @@
<!DOCTYPE html>
-<html lang="{{ .Site.Language }}">
+<html lang="{{ .Site.Language }}" class="direction-{{ .Language.LanguageDirection | default "ltr" }}">
<head>
{{- partial "head.html" . }}