chore: replace right/left with inline-* value for better rtl support

This commit is contained in:
TAKAHASHI Shuuji 2024-06-09 16:26:12 +09:00
parent 6dc6489e69
commit 2ee481103c
No known key found for this signature in database
GPG key ID: F15C887632129F5E
14 changed files with 44 additions and 61 deletions

View file

@ -11,7 +11,9 @@
&:is([type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"]) {
#{$css-var-prefix}icon-position: 0.75rem;
#{$css-var-prefix}icon-width: 1rem;
padding-right: calc(var(#{$css-var-prefix}icon-width) + var(#{$css-var-prefix}icon-position));
padding-inline-end: calc(
var(#{$css-var-prefix}icon-width) + var(#{$css-var-prefix}icon-position)
);
background-image: var(#{$css-var-prefix}icon-date);
background-position: center right var(#{$css-var-prefix}icon-position);
background-size: var(#{$css-var-prefix}icon-width) auto;
@ -32,8 +34,8 @@
#{$parent-selector} [type="week"] {
&::-webkit-calendar-picker-indicator {
width: var(#{$css-var-prefix}icon-width);
margin-right: calc(var(#{$css-var-prefix}icon-width) * -1);
margin-left: var(#{$css-var-prefix}icon-position);
margin-inline-start: var(#{$css-var-prefix}icon-position);
margin-inline-end: calc(var(#{$css-var-prefix}icon-width) * -1);
opacity: 0;
}
}
@ -46,7 +48,7 @@
#{$parent-selector} [type="month"],
#{$parent-selector} [type="time"],
#{$parent-selector} [type="week"] {
padding-right: var(#{$css-var-prefix}form-element-spacing-horizontal) !important;
padding-inline-end: var(#{$css-var-prefix}form-element-spacing-horizontal) !important;
background-image: none !important;
}
}
@ -55,6 +57,6 @@
[dir="rtl"]
#{$parent-selector}
:is([type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"]) {
text-align: right;
text-align: start;
}
}