feat(KB-626): add mobile responsive styles for model dropdown

- Add media query for tablet screens (max-width: 768px) with 70vh max-height
- Add media query for mobile screens (max-width: 640px) with 60vh max-height
- Center dropdown horizontally using transform translateX
- Set responsive width with viewport calculation and min-width unset
This commit is contained in:
gsxdsm
2026-03-31 18:05:11 -07:00
parent 993656822a
commit c5165bc04d

View File

@@ -5364,6 +5364,26 @@ body {
font-style: italic;
}
/* Mobile responsive model dropdown */
@media (max-width: 768px) {
.model-combobox-dropdown {
max-height: 70vh;
max-height: 70dvh; /* Use dynamic viewport height where supported */
}
}
@media (max-width: 640px) {
.model-combobox-dropdown {
max-height: 60vh;
max-height: 60dvh;
/* Ensure dropdown doesn't overflow horizontally on small screens */
left: 50%;
transform: translateX(-50%);
width: calc(100vw - 32px);
min-width: unset;
}
}
/* ============================================================
THEME SYSTEM
============================================================ */