Added support for RTL languages in dropdowns

This commit is contained in:
Connor Yoh
2025-02-21 16:20:04 +00:00
parent 4704f96f5d
commit a291837d38

View File

@@ -89,10 +89,14 @@
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); /* Auto-fill columns, with a minimum width of 180px */
}
.lang-dropdown-item-wrapper {
html[dir="ltr"] .lang-dropdown-item-wrapper {
border-right: 2px solid var(--md-sys-color-inverse-surface);
}
html[dir="rtl"] .lang-dropdown-item-wrapper {
border-left: 2px solid var(--md-sys-color-inverse-surface);
}
/* Responsive adjustments */
@media (min-width: 1200px){
.lang_dropdown-mw{
@@ -106,7 +110,7 @@
}
.scalable-languages-container .lang-dropdown-item-wrapper:nth-child(2n) {
border-right: 0px
border: 0px
}
}
@@ -115,7 +119,7 @@
grid-template-columns: repeat(3, 1fr);
}
.scalable-languages-container .lang-dropdown-item-wrapper:nth-child(3n) {
border-right: 0px
border: 0px
}
}
@media (min-width: 901px) {
@@ -124,7 +128,7 @@
}
.scalable-languages-container .lang-dropdown-item-wrapper:nth-child(4n) {
border-right: 0px
border: 0px
}
}
@@ -337,20 +341,34 @@ span.icon-text::after {
}
/* Dropdown open on hover */
.dropdown-menu {
html[dir="ltr"] .dropdown-menu {
padding-top: 0.5rem;
top: auto;
left: auto;
right: 0;
}
.dropdown-menu[data-bs-popper] {
html[dir="rtl"] .dropdown-menu {
padding-top: 0.5rem;
top: auto;
left: 0;
right: auto;
}
html[dir="ltr"] .dropdown-menu[data-bs-popper] {
top: auto;
left: auto;
right: 0;
margin-top: 0 !important;
}
html[dir="rtl"] .dropdown-menu[data-bs-popper] {
top: auto;
left: 0;
right: auto;
margin-top: 0 !important;
}
.dropdown-menu-wrapper {
padding: 1.5rem 0;
border-radius: 1rem;