steffen/website
1
0
Fork 0
Code Actions Packages Releases Activity

Add RTL Support (#4886)

Browse Source 
Signed-off-by: Hamed Faramarzi <hamed.faramarzi@gmail.com>
Co-authored-by: Hamed Faramarzi <hamed.faramarzi@gmail.com>
Co-authored-by: iBug <git@ibugone.com>
This commit is contained in:
Yash 2024-06-25 13:50:25 +02:00 committed by GitHub
parent ef5018ee6f
commit 621529aaf2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
11 changed files with 142 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
_config.yml
View File

@ -16,6 +16,7 @@ minimal_mistakes_skin : "default" # "air", "aqua", "contrast", "dark", "dirt"
# Site Settings # Site Settings
locale : "en-US" locale : "en-US"
rtl : # true, false (default) # turns direction of the page into right to left for RTL languages
title : "Site Title" title : "Site Title"
title_separator : "-" title_separator : "-"
subtitle : # site tagline that appears below site title in masthead subtitle : # site tagline that appears below site title in masthead

6
_data/ui-text.yml
View File

@ -1400,7 +1400,7 @@ fa: &DEFAULT_FA
toc_label : "در این صفحه" toc_label : "در این صفحه"
ext_link_label : "لینک مستقیم" ext_link_label : "لینک مستقیم"
less_than : " " less_than : " "
minute_read : "(طول مطالعه (دقیقه" minute_read : "دقیقه، طول مطالعه"
share_on_label : "اشتراک گذاری در" share_on_label : "اشتراک گذاری در"
meta_label : meta_label :
tags_label : "تگ ها: " tags_label : "تگ ها: "
@ -1427,9 +1427,9 @@ fa: &DEFAULT_FA
comment_btn_submitted : "ارسال شد" comment_btn_submitted : "ارسال شد"
comment_success_msg : ".باتشکر از ارسال دیدگاه! پس از تأیید، این دیدگاه در سایت نشان داده خواهد شد" comment_success_msg : ".باتشکر از ارسال دیدگاه! پس از تأیید، این دیدگاه در سایت نشان داده خواهد شد"
comment_error_msg : ".متاسفانه در ارسال شما خطایی بود. لطفا مطمئن شوید تمام فیلدهای مورد نیاز تکمیل شده و دوباره امتحان کنید" comment_error_msg : ".متاسفانه در ارسال شما خطایی بود. لطفا مطمئن شوید تمام فیلدهای مورد نیاز تکمیل شده و دوباره امتحان کنید"
loading_label : "...بارگذاری" loading_label : "بارگذاری..."
search_label_text : search_label_text :
search_placeholder_text : "...عبارت جستجوی خود را وارد کنید" search_placeholder_text : "عبارت جستجوی خود را وارد کنید..."
search_algolia_no_results : search_algolia_no_results :
results_found : "نتایج" results_found : "نتایج"
back_to_top : "بازگشت به بالا" back_to_top : "بازگشت به بالا"

2
_layouts/default.html
View File

@ -9,7 +9,7 @@
{% include head/custom.html %} {% include head/custom.html %}
</head> </head>
<body class="layout--{{ page.layout | default: layout.layout }}{% if page.classes or layout.classes %}{{ page.classes | default: layout.classes | join: ' ' | prepend: ' ' }}{% endif %}"> <body class="layout--{{ page.layout | default: layout.layout }}{% if page.classes or layout.classes %}{{ page.classes | default: layout.classes | join: ' ' | prepend: ' ' }}{% endif %}" dir="{% if site.rtl %}rtl{% else %}ltr{% endif %}">
{% include_cached skip-links.html %} {% include_cached skip-links.html %}
{% include_cached masthead.html %} {% include_cached masthead.html %}

10
_sass/minimal-mistakes/_archive.scss
View File

@ -10,11 +10,21 @@
float: right; float: right;
width: calc(100% - #{$right-sidebar-width-narrow}); width: calc(100% - #{$right-sidebar-width-narrow});
padding-right: $right-sidebar-width-narrow; padding-right: $right-sidebar-width-narrow;
[dir=rtl] & {
padding-right: 0;
padding-left: $right-sidebar-width-narrow;
}
} }
@include breakpoint($x-large) { @include breakpoint($x-large) {
width: calc(100% - #{$right-sidebar-width}); width: calc(100% - #{$right-sidebar-width});
padding-right: $right-sidebar-width; padding-right: $right-sidebar-width;
[dir=rtl] & {
padding-right: 0;
padding-left: $right-sidebar-width;
}
} }
} }

6
_sass/minimal-mistakes/_base.scss
View File

@ -113,6 +113,12 @@ blockquote {
font-style: italic; font-style: italic;
border-left: 0.25em solid $primary-color; border-left: 0.25em solid $primary-color;
[dir=rtl] & {
border-left: none;
border-right: .25em solid $primary-color;
margin: 2em 0 2em 1em;
}
cite { cite {
font-style: italic; font-style: italic;

37
_sass/minimal-mistakes/_navigation.scss
View File

@ -194,10 +194,20 @@
&.site-logo { &.site-logo {
margin-left: 0; margin-left: 0;
margin-right: 0.5rem; margin-right: 0.5rem;
[dir=rtl] & {
margin-right: 0;
margin-left: 0.5rem;
}
} }
&.site-title { &.site-title {
margin-left: 0; margin-left: 0;
[dir=rtl] & {
margin-left: 1rem;
margin-right: 0;
}
} }
} }
@ -553,21 +563,46 @@
li ul > li a { li ul > li a {
padding-left: 1.25rem; padding-left: 1.25rem;
font-weight: normal; font-weight: normal;
[dir=rtl] & {
padding-left: 0;
padding-right: 1.25rem;
}
} }
li ul li ul > li a { li ul li ul > li a {
padding-left: 1.75rem; padding-left: 1.75rem;
[dir=rtl] & {
padding-left: 0;
padding-right: 1.75rem;
}
} }
li ul li ul li ul > li a { li ul li ul li ul > li a {
padding-left: 2.25rem; padding-left: 2.25rem;
[dir=rtl] & {
padding-left: 0;
padding-right: 2.25rem;
}
} }
li ul li ul li ul li ul > li a { li ul li ul li ul li ul > li a {
padding-left: 2.75rem; padding-left: 2.75rem;
[dir=rtl] & {
padding-left: 0;
padding-right: 2.75rem;
}
} }
li ul li ul li ul li ul li ul > li a { li ul li ul li ul li ul li ul > li a {
padding-left: 3.25rem padding-left: 3.25rem;
[dir=rtl] & {
padding-left: 0;
padding-right: 3.25rem;
}
} }
} }

33
_sass/minimal-mistakes/_page.scss
View File

@ -40,11 +40,21 @@ body {
float: right; float: right;
width: calc(100% - #{$right-sidebar-width-narrow}); width: calc(100% - #{$right-sidebar-width-narrow});
padding-right: $right-sidebar-width-narrow; padding-right: $right-sidebar-width-narrow;
[dir=rtl] & {
padding-right: 0;
padding-left: $right-sidebar-width-narrow;
}
} }
@include breakpoint($x-large) { @include breakpoint($x-large) {
width: calc(100% - #{$right-sidebar-width}); width: calc(100% - #{$right-sidebar-width});
padding-right: $right-sidebar-width; padding-right: $right-sidebar-width;
[dir=rtl] & {
padding-right: 0;
padding-left: $right-sidebar-width;
}
} }
.page__inner-wrap { .page__inner-wrap {
@ -103,6 +113,11 @@ body {
-moz-transition: opacity 0.2s ease-in-out 0.1s; -moz-transition: opacity 0.2s ease-in-out 0.1s;
-o-transition: opacity 0.2s ease-in-out 0.1s; -o-transition: opacity 0.2s ease-in-out 0.1s;
transition: opacity 0.2s ease-in-out 0.1s; transition: opacity 0.2s ease-in-out 0.1s;
[dir=rtl] & {
left: 0;
right: .5em;
}
} }
&:hover .header-link { &:hover .header-link {
@ -335,6 +350,11 @@ body {
strong { strong {
margin-right: 10px; margin-right: 10px;
[dir=rtl] & {
margin-right: 0;
margin-left: 10px;
}
} }
} }
@ -347,6 +367,11 @@ body {
border: 1px solid mix(#000, $border-color, 25%); border: 1px solid mix(#000, $border-color, 25%);
border-radius: $border-radius; border-radius: $border-radius;
[dir=rtl] & {
margin-right: 0;
margin-left: 5px;
}
&:hover { &:hover {
text-decoration: none; text-decoration: none;
color: $link-color-hover; color: $link-color-hover;
@ -530,9 +555,17 @@ body {
padding-top: 1em; padding-top: 1em;
border-top: 1px solid $border-color; border-top: 1px solid $border-color;
[dir=rtl] & {
float: right;
}
@include breakpoint($large) { @include breakpoint($large) {
float: right; float: right;
width: calc(100% - #{$right-sidebar-width-narrow}); width: calc(100% - #{$right-sidebar-width-narrow});
[dir=rtl] & {
float: left;
}
} }
@include breakpoint($x-large) { @include breakpoint($x-large) {

32
_sass/minimal-mistakes/_sidebar.scss
View File

@ -23,6 +23,10 @@
-webkit-transition: opacity 0.2s ease-in-out; -webkit-transition: opacity 0.2s ease-in-out;
transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out;
[dir=rtl] & {
float: right;
}
&:hover { &:hover {
opacity: 1; opacity: 1;
} }
@ -83,6 +87,15 @@
padding-left: 1em; padding-left: 1em;
z-index: 10; z-index: 10;
[dir=rtl] & {
right: auto;
left: 0;
margin-right: 0;
margin-left: -1 * $right-sidebar-width-narrow;
padding-left: 0;
padding-right: 1em;
}
&.sticky { &.sticky {
@include clearfix(); @include clearfix();
position: -webkit-sticky; position: -webkit-sticky;
@ -90,6 +103,10 @@
top: 2em; top: 2em;
float: right; float: right;
[dir=rtl] & {
float: left;
}
.toc { .toc {
.toc__menu { .toc__menu {
overflow-y: auto; overflow-y: auto;
@ -102,6 +119,11 @@
@include breakpoint($x-large) { @include breakpoint($x-large) {
width: $right-sidebar-width; width: $right-sidebar-width;
margin-right: -1 * $right-sidebar-width; margin-right: -1 * $right-sidebar-width;
[dir=rtl] & {
margin-right: 0;
margin-left: -1 * $right-sidebar-width;
}
} }
} }
@ -203,6 +225,11 @@
.author__urls { .author__urls {
span.label { span.label {
padding-left: 5px; padding-left: 5px;
[dir=rtl] & {
padding-left: 0;
padding-right: 5px;
}
} }
} }
@ -318,6 +345,11 @@
font-size: $type-size-5; font-size: $type-size-5;
text-decoration: none; text-decoration: none;
[dir=rtl] & {
padding-right: 0;
padding-left: 5px;
}
&:hover { &:hover {
text-decoration: underline; text-decoration: underline;
} }

4
_sass/minimal-mistakes/_syntax.scss
View File

@ -13,6 +13,10 @@ figure.highlight {
line-height: 1.8; line-height: 1.8;
border-radius: $border-radius; border-radius: $border-radius;
[dir=rtl] & {
direction: ltr;
}
> pre, > pre,
pre.highlight { pre.highlight {
margin: 0; margin: 0;

10
_sass/minimal-mistakes/_utilities.scss
View File

@ -117,6 +117,11 @@ body:hover .visually-hidden button {
.task-list-item-checkbox { .task-list-item-checkbox {
margin-right: 0.5em; margin-right: 0.5em;
opacity: 1; opacity: 1;
[dir=rtl] & {
margin-left: .5em;
margin-right: 0;
}
} }
} }
@ -183,6 +188,11 @@ body:hover .visually-hidden button {
.full { .full {
@include breakpoint($large) { @include breakpoint($large) {
margin-right: -1 * span(2.5 of 12) !important; margin-right: -1 * span(2.5 of 12) !important;
[dir=rtl] & {
margin-right: 0 !important;
margin-left: -1 * span(2.5 of 12) !important;
}
} }
} }

6
docs/_docs/05-configuration.md
View File

@ -215,6 +215,12 @@ By default your site title is used in the masthead. You can override this text b
masthead_title: "My Custom Title" masthead_title: "My Custom Title"
``` ```
### Site RTL direction
`site.rtl` is used to turn the direction of the page into right to left. This option can be used for RTL languages (like Arabic, Persian, etc)
_Example:_ `rtl: true` sets the direction of the page to right to left. By default this option is `rtl: false`.
### Breadcrumb navigation (beta) ### Breadcrumb navigation (beta)
Enable breadcrumb links to help visitors better navigate deep sites. Because of the fragile method of implementing them they don't always produce accurate links reliably. For best results: Enable breadcrumb links to help visitors better navigate deep sites. Because of the fragile method of implementing them they don't always produce accurate links reliably. For best results: