Skip to content

Commit 0934ada

Browse files
mrholekmrholek
committed
feat: add RTL support
1 parent 1b8f9e7 commit 0934ada

37 files changed

+215
-172
lines changed

‎scss/_accordion.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@
3636
flex-shrink: 0;
3737
width: $accordion-icon-width;
3838
height: $accordion-icon-width;
39-
margin-left: auto;
39+
@include ltr-rtl("margin-left", auto);
4040
content: "";
4141
background-image: var(--#{$variable-prefix}accordion-button-icon, escape-svg($accordion-button-icon));
4242
background-repeat: no-repeat;

‎scss/_alert.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,13 +27,13 @@
2727
// Expand the right padding and account for the close button's positioning.
2828

2929
.alert-dismissible {
30-
padding-right: $alert-dismissible-padding-r;
30+
@include ltr-rtl("padding-right", $alert-dismissible-padding-r);
3131

3232
// Adjust close link position
3333
.btn-close {
3434
position: absolute;
3535
top: 0;
36-
right: 0;
36+
@include ltr-rtl("right", 0);
3737
z-index: $stretched-link-z-index + 1;
3838
padding: $alert-padding-y * 1.25 $alert-padding-x;
3939
}

‎scss/_avatar.scss‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717

1818
.avatar-status {
1919
position: absolute;
20-
right: 0;
20+
@include ltr-rtl("right", 0);
2121
bottom: 0;
2222
display: block;
2323
border: 1px solid $white;
@@ -34,16 +34,16 @@
3434
display: flex;
3535

3636
.avatar {
37-
margin-right: - ($avatar-width / 2.5);
37+
@include ltr-rtl("margin-right", - ($avatar-width / 2.5));
3838

3939
&:hover {
40-
margin-right: 0;
40+
@include ltr-rtl("margin-right", 0);
4141
}
4242
}
4343

4444
@each $width, $value in $avatar-widths {
4545
.avatar-#{$width} {
46-
margin-right: - ($value / 2.5);
46+
@include ltr-rtl("margin-right", - ($value / 2.5));
4747
}
4848
}
4949
}

‎scss/_breadcrumb.scss‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,18 @@
1212
.breadcrumb-item {
1313
// The separator between breadcrumbs (by default, a forward-slash: "/")
1414
+ .breadcrumb-item {
15-
padding-left: $breadcrumb-item-padding-x;
15+
@include ltr-rtl("padding-left", $breadcrumb-item-padding-x);
1616

1717
&::before {
18-
float: left; // Suppress inline spacings and underlining of the separator
19-
padding-right: $breadcrumb-item-padding-x;
18+
@include ltr-rtl("float", left); // Suppress inline spacings and underlining of the separator
19+
@include ltr-rtl("padding-right", $breadcrumb-item-padding-x);
2020
color: var(--#{$variable-prefix}breadcrumb-divider-color, $breadcrumb-divider-color);
21-
content: var(--#{$variable-prefix}breadcrumb-divider, escape-svg($breadcrumb-divider)) #{"/* rtl:"} var(--#{$variable-prefix}breadcrumb-divider, escape-svg($breadcrumb-divider-flipped)) #{"*/"};
21+
@include ltr-rtl(
22+
"content",
23+
var(--#{$variable-prefix}breadcrumb-divider, escape-svg($breadcrumb-divider)),
24+
null,
25+
var(--#{$variable-prefix}breadcrumb-divider-flipped, escape-svg($breadcrumb-divider-flipped))
26+
);
2227
}
2328
}
2429

‎scss/_button-group.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@
3737
// Prevent double borders when buttons are next to each other
3838
> .btn:not(:first-child),
3939
> .btn-group:not(:first-child) {
40-
margin-left: -$btn-border-width;
40+
@include ltr-rtl("margin-left", -$btn-border-width);
4141
}
4242

4343
// Reset rounded corners
@@ -76,11 +76,11 @@
7676
&::after,
7777
.dropup &::after,
7878
.dropend &::after {
79-
margin-left: 0;
79+
@include ltr-rtl("margin-left", 0);
8080
}
8181

8282
.dropstart &::before {
83-
margin-right: 0;
83+
@include ltr-rtl("margin-right", 0);
8484
}
8585
}
8686

‎scss/_callout.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,15 @@
22
padding: $callout-padding-y $callout-padding-x;
33
margin: $callout-margin-y $callout-margin-x;
44
border: var(--#{$variable-prefix}callout-border-width, $callout-border-width) solid var(--#{$variable-prefix}callout-border-color, $callout-border-color);
5-
border-left-width: var(--#{$variable-prefix}callout-border-left-width, $callout-border-left-width);
5+
@include ltr-rtl("border-left-width", var(--#{$variable-prefix}callout-border-left-width, $callout-border-left-width));
66
@include border-radius($callout-border-radius);
77
}
88

99
// scss-docs-start callout-modifiers
1010
// Generate contextual modifier classes for colorizing the collor.
1111
@each $state, $value in $callout-variants {
1212
.callout-#{$state} {
13-
border-left-color: var(--#{$variable-prefix}callout-border-left-color, $value);
13+
@include ltr-rtl("border-left-color", var(--#{$variable-prefix}callout-border-left-color, $value));
1414
}
1515
}
1616
// scss-docs-end callout-modifiers

‎scss/_card.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@
6969
}
7070

7171
+ .card-link {
72-
margin-left: $card-spacer-x;
72+
@include ltr-rtl("margin-left", $card-spacer-x);
7373
}
7474
}
7575

@@ -174,8 +174,8 @@
174174
margin-bottom: 0;
175175

176176
+ .card {
177-
margin-left: 0;
178-
border-left: 0;
177+
@include ltr-rtl("margin-left", 0);
178+
@include ltr-rtl("border-left", 0);
179179
}
180180

181181
// Handle rounded corners

‎scss/_dropdown.scss‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@
3333
@include box-shadow($dropdown-box-shadow);
3434

3535
&[data-coreui-popper] {
36-
left: 0;
36+
@include ltr-rtl("left", 0);
3737
margin-top: $dropdown-spacer;
3838
}
3939
}
@@ -85,12 +85,12 @@
8585
.dropend {
8686
.dropdown-menu {
8787
top: 0;
88-
right: auto;
89-
left: 100%;
88+
@include ltr-rtl("right", auto);
89+
@include ltr-rtl("left", 100%);
9090

9191
&[data-coreui-popper] {
9292
margin-top: 0;
93-
margin-left: $dropdown-spacer;
93+
@include ltr-rtl("margin-left", $dropdown-spacer);
9494
}
9595
}
9696

@@ -105,12 +105,12 @@
105105
.dropstart {
106106
.dropdown-menu {
107107
top: 0;
108-
right: 100%;
109-
left: auto;
108+
@include ltr-rtl("right", 100%);
109+
@include ltr-rtl("left", auto);
110110

111111
&[data-coreui-popper] {
112112
margin-top: 0;
113-
margin-right: $dropdown-spacer;
113+
@include ltr-rtl("margin-right", $dropdown-spacer);
114114
}
115115
}
116116

‎scss/_header.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@
6161
.header-brand {
6262
padding-top: $header-brand-padding-y;
6363
padding-bottom: $header-brand-padding-y;
64-
margin-right: $header-brand-margin-end;
64+
@include ltr-rtl("margin-right", $header-brand-margin-end);
6565
@include font-size($header-brand-font-size);
6666
color: var(--#{$variable-prefix}header-brand-color, $header-brand-color);
6767
text-decoration: if($link-decoration == none, null, none);
@@ -81,7 +81,7 @@
8181
.header-nav {
8282
display: flex;
8383
flex-direction: row; // cannot use `inherit` to get the `.header`s value
84-
padding-left: 0;
84+
@include ltr-rtl("padding-left", 0);
8585
margin-bottom: 0;
8686
list-style: none;
8787

‎scss/_list-group.scss‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
flex-direction: column;
88

99
// No need to set list-style: none; since .list-group-item is block level
10-
padding-left: 0; // reset padding because ul and ol
10+
@include ltr-rtl("padding-left", 0); // reset padding because ul and ol
1111
margin-bottom: 0;
1212
@include border-radius($list-group-border-radius);
1313
}
@@ -114,11 +114,11 @@
114114

115115
+ .list-group-item {
116116
border-top-width: $list-group-border-width;
117-
border-left-width: 0;
117+
@include ltr-rtl("border-left-width", 0);
118118

119119
&.active {
120-
margin-left: -$list-group-border-width;
121-
border-left-width: $list-group-border-width;
120+
@include ltr-rtl("margin-left", -$list-group-border-width);
121+
@include ltr-rtl("border-left-width", $list-group-border-width);
122122
}
123123
}
124124
}

0 commit comments

Comments
 (0)