hak8or/blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

A set of style fixes for rtl langs

Browse Source
This commit is contained in:
daudix
2024-06-17 05:21:54 +03:00
parent f7dcab6c1d
commit 2abb4d234c
8 changed files with 108 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
sass/_article-list.scss
View File

@ -20,6 +20,11 @@
&:has(.draft-badge, .archive-badge) h3 {
margin-right: 7rem;
body[dir="rtl"] & {
margin-right: unset;
margin-left: 7rem;
}
}
.draft-badge,
@ -37,6 +42,11 @@
width: 1rem;
height: 1rem;
}
body[dir="rtl"] & {
right: unset;
left: 0;
}
}
.draft-badge {

12
sass/_comments.scss
View File

@ -7,6 +7,11 @@ section#comments {
width: 150px;
height: 150px;
body[dir="rtl"] & {
float: left;
margin: 3rem 1rem 0 0;
}
@media only screen and (max-width: 720px) {
display: none;
}
@ -35,6 +40,13 @@ section#comments {
border-left: 0.25rem solid var(--fg-muted-2);
border-radius: 0.25rem;
padding-left: 1rem;
body[dir="rtl"] & {
border-right: 0.25rem solid var(--fg-muted-2);
border-left: unset;
padding-right: 1rem;
padding-left: unset;
}
}
.avatar-link {

5
sass/_containers.scss
View File

@ -21,6 +21,11 @@
background-color: var(--fg-muted-1);
padding: 0.5rem;
body[dir="rtl"] & {
right: unset;
left: 0.5rem;
}
&:hover {
background-color: var(--fg-muted-2);

7
sass/_external.scss
View File

@ -6,9 +6,14 @@
opacity: 0.6;
mask-image: $icon;
mask-size: cover;
margin-left: 3px;
margin-left: 0.25rem;
background-color: var(--primary-color);
width: 0.75rem;
height: 0.75rem;
content: "";
body[dir="rtl"] & {
margin-right: 0.25rem;
margin-left: unset;
}
}

10
sass/_nav.scss
View File

@ -100,6 +100,11 @@
position: relative;
margin-right: 0.625rem;
body[dir="rtl"] & {
margin-right: unset;
margin-left: 0.625rem;
}
&::after {
position: absolute;
top: 0;
@ -108,6 +113,11 @@
width: 1px;
height: 110%;
content: "";
body[dir="rtl"] & {
right: unset;
left: -0.5rem;
}
}
a {

4
sass/_post-nav.scss
View File

@ -18,6 +18,10 @@
padding-right: 0;
padding-left: 1rem;
text-align: right;
body[dir="rtl"] & {
text-align: left;
}
}
.nav-arrow {

14
sass/_typography.scss
View File

@ -48,6 +48,11 @@ blockquote {
border-radius: 0.25rem;
padding: 0 0.75rem;
color: var(--fg-muted-5);
body[dir="rtl"] & {
border-right: 0.25rem solid var(--primary-color);
border-left: unset;
}
}
mark {
@ -102,6 +107,11 @@ hr {
background: var(--bg-color), var(--primary-color);
padding: 0 0.25rem;
content: "☙❧";
// An ugly hack to fix mirroring in rtl
body[dir="rtl"] & {
content: "❧☙";
}
}
}
@ -122,6 +132,10 @@ aside {
padding: 1rem;
width: 30%;
body[dir="rtl"] & {
float: left;
}
@media only screen and (max-width: 720px) {
float: none;
margin-inline-start: 0;

4
templates/base.html
View File

@ -1,9 +1,9 @@
{% set rtl = ["ar", "arc", "az", "dv", "ff", "he", "ku", "nqo", "fa", "rhg", "syc", "ur"] %}
{% set rtl_langs = ["ar", "arc", "az", "dv", "ff", "he", "ku", "nqo", "fa", "rhg", "syc", "ur"] %}
<!DOCTYPE html>
<html lang="{{ lang }}">
{% include "partials/head.html" %}
<body {% if lang in rtl %}dir="rtl"{% endif %}>
<body {% if lang in rtl_langs %}dir="rtl"{% endif %}>
{% include "partials/nav.html" %}
<div id="main" class="container">
{% block custom %}{%- endblock -%}