hamlab/mobilizon-frontend
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Add mixins to handle RTL languages

Browse Source 
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel
2021-11-04 18:14:36 +01:00
parent 547e222f5f
commit 39ea05a04a
36 changed files with 164 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
js/src/styles/_event-card.scss
View File

@@ -1,9 +1,11 @@
@use "@/styles/_mixins" as *;
.event-organizer {
display: flex;
align-items: center;
.organizer-name {
padding-left: 5px;
@include padding-left(5px);
font-weight: 600;
}
}
@@ -13,6 +15,6 @@
align-items: center;
& > span:not(.icon) {
padding-left: 5px;
@include padding-left(5px);
}
}

55
js/src/styles/_mixins.scss Normal file
View File

@@ -0,0 +1,55 @@
@mixin margin($block-start, $inline-end, $block-end, $inline-start) {
@include margin-left($inline-start);
@include margin-right($inline-end);
margin-top: $block-start;
margin-bottom: $block-end;
}
@mixin padding($block-start, $inline-end, $block-end, $inline-start) {
@include padding-left($inline-start);
@include padding-right($inline-end);
padding-top: $block-start;
padding-bottom: $block-end;
}
@mixin margin-left($value) {
@supports (margin-inline-start: $value) {
margin-inline-start: $value;
}
@supports not (margin-inline-start: $value) {
margin-left: $value;
}
}
@mixin margin-right($value) {
@supports (margin-inline-end: $value) {
margin-inline-end: $value;
}
@supports not (margin-inline-end: $value) {
margin-right: $value;
}
}
@mixin padding-left($value) {
@supports (padding-inline-start: $value) {
padding-inline-start: $value;
}
@supports not (padding-inline-start: $value) {
padding-left: $value;
}
}
@mixin padding-right($value) {
@supports (padding-inline-end: $value) {
padding-inline-end: $value;
}
@supports not (padding-inline-end: $value) {
padding-right: $value;
}
}