Skip to content

Commit adad5ad

Browse files
committed
Feat: added rtl styles
1 parent 2c50cd3 commit adad5ad

3 files changed

Lines changed: 118 additions & 4 deletions

File tree

_layouts/default.liquid

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<!doctype html>
2-
<html lang="{{ site.lang }}">
2+
<html lang="{{ site.lang }}" {% if site.rtl_langs contains site.lang %}dir="rtl"{% endif %}>
33
<!-- Head -->
44
<head>
55
{% if page.redirect %}
@@ -22,7 +22,7 @@
2222

2323
<!-- Content -->
2424
<div class="container mt-5" role="main">
25-
<div {% if site.rtl_langs contains page.lang %}dir="rtl" align="right"{% endif %}>
25+
<div {% if site.rtl_langs contains page.lang %}class="rtl-content"{% endif %}>
2626
{% if page.toc and page.toc.sidebar %}
2727

2828
<!-- revert the side bar for rtl -->

_sass/_layout.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@import "rtl";
2+
13
/******************************************************************************
24
* Content
35
******************************************************************************/
@@ -6,8 +8,6 @@ body {
68
padding-bottom: 70px;
79
color: var(--global-text-color);
810
background-color: var(--global-bg-color);
9-
unicode-bidi: bidi-override !important;
10-
direction: unset !important;
1111

1212
h1, h2, h3, h4, h5, h6 {
1313
scroll-margin-top: 66px;

_sass/_rtl.scss

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
/* RTL styles */
2+
html[dir="rtl"] {
3+
body {
4+
text-align: right;
5+
}
6+
7+
/* Adjustments for Bootstrap's grid system */
8+
.row {
9+
direction: rtl;
10+
}
11+
12+
/* Adjustments for text alignment */
13+
.text-left {
14+
text-align: right !important;
15+
}
16+
.text-right {
17+
text-align: left !important;
18+
}
19+
20+
/* Adjustments for margins and paddings */
21+
.ml-auto {
22+
margin-right: auto !important;
23+
margin-left: 0 !important;
24+
}
25+
.mr-auto {
26+
margin-left: auto !important;
27+
margin-right: 0 !important;
28+
}
29+
.pl-0 {
30+
padding-right: 0 !important;
31+
padding-left: initial !important;
32+
}
33+
.pr-0 {
34+
padding-left: 0 !important;
35+
padding-right: initial !important;
36+
}
37+
.pl-1, .pl-2, .pl-3, .pl-4, .pl-5 {
38+
padding-right: var(--spacer) !important; /* Adjust as needed */
39+
padding-left: initial !important;
40+
}
41+
.pr-1, .pr-2, .pr-3, .pr-4, .pr-5 {
42+
padding-left: var(--spacer) !important; /* Adjust as needed */
43+
padding-right: initial !important;
44+
}
45+
46+
/* Navbar adjustments */
47+
.navbar-nav .nav-link {
48+
padding-right: 0.5rem;
49+
padding-left: 0;
50+
}
51+
.navbar-nav .nav-item:not(:last-child) {
52+
margin-left: 1rem;
53+
margin-right: 0;
54+
}
55+
56+
/* Specific adjustments for al-folio elements */
57+
.profile .align-items-center {
58+
flex-direction: row-reverse;
59+
}
60+
61+
.social {
62+
text-align: left;
63+
}
64+
65+
.footer-col {
66+
text-align: right;
67+
}
68+
69+
.news-item .news-date {
70+
text-align: left;
71+
}
72+
73+
.publication-title {
74+
text-align: right;
75+
}
76+
77+
.abstract-collapse {
78+
text-align: right;
79+
}
80+
81+
.bib-buttons {
82+
text-align: left;
83+
}
84+
85+
.card-title {
86+
text-align: right;
87+
}
88+
89+
.card-text {
90+
text-align: right;
91+
}
92+
93+
.btn {
94+
text-align: center;
95+
}
96+
97+
/* Adjustments for the main content div */
98+
.rtl-content {
99+
text-align: right;
100+
}
101+
102+
/* Adjustments for table of contents sidebar */
103+
#toc-sidebar {
104+
text-align: right;
105+
}
106+
#toc-sidebar .nav-link {
107+
padding-right: 0;
108+
padding-left: 1rem;
109+
}
110+
#toc-sidebar .nav-link::before {
111+
margin-left: 0.5rem;
112+
margin-right: 0;
113+
}
114+
}

0 commit comments

Comments
 (0)