Support RTL for group component border radius styles

This commit is contained in:
Reza M Ghayeghchi 2024-12-11 22:57:02 +01:00
parent bfdf6dbf6c
commit 5e37f38e18

View file

@ -129,4 +129,44 @@
}
}
}
[dir="rtl"] {
#{$parent-selector} [role="search"],
#{$parent-selector} [role="group"] {
> *,
input:not([type="checkbox"], [type="radio"]),
select,
label {
&:not(:first-child) {
margin-right: 0;
margin-left: auto;
border-top-right-radius: 0;
border-top-left-radius: var(#{$css-var-prefix}border-radius);
border-bottom-right-radius: 0;
border-bottom-left-radius: var(#{$css-var-prefix}border-radius);
}
&:not(:last-child) {
border-top-right-radius: var(#{$css-var-prefix}border-radius);
border-top-left-radius: 0;
border-bottom-right-radius: var(#{$css-var-prefix}border-radius);
border-bottom-left-radius: 0;
}
}
}
button,
[type="submit"],
[type="reset"],
[type="button"],
[role="button"],
input:not([type="checkbox"], [type="radio"]),
select,
label {
&:not(:first-child) {
margin-right: calc(var(#{$css-var-prefix}border-width) * -1);
margin-left: auto;
}
}
}
}