[ACS-10258] a11y fix: Search page is unreadable at 320px width (#5123)

* [ACS-10258] a11y fix: Search page is unreadable at 320px width

* [ACS-10258] cr fix
This commit is contained in:
Mykyta Maliarchuk
2026-04-01 09:46:43 +02:00
committed by GitHub
parent c79bb60435
commit aefa1b3f78
3 changed files with 21 additions and 8 deletions
@@ -27,7 +27,7 @@ aca-search-in-menu {
padding: 0;
border: none;
background-color: var(--theme-white-background);
min-width: 512px;
width: min(512px, 100vw);
box-shadow: 0 2px 4px var(--theme-grey-divider-color);
border-radius: 12px;
@@ -67,4 +67,19 @@ aca-search-in-menu {
justify-content: space-between;
padding: 8px 16px;
}
@media screen and (max-width: 599px) {
position: fixed;
left: 50%;
top: 65px;
transform: translateX(-50%);
width: calc(100vw - 16px);
max-height: calc(100vh - 65px);
overflow-y: auto;
}
@media screen and (max-width: 320px) {
top: 0;
max-height: 100vh;
}
}
@@ -53,14 +53,8 @@ $search-border-radius: 4px;
}
@media screen and (max-width: 599px) {
$search-width-xsmall: 220px;
.aca-search-input {
max-width: $search-width-xsmall;
}
.app-search-container {
max-width: $search-width-xsmall;
max-width: 220px;
}
}
@@ -1,6 +1,10 @@
@import '../../../ui/mixins';
aca-search-results {
.aca-content-header {
overflow-x: auto;
}
.aca-search-results-active-search-ai-input {
.aca-header-container,
.adf-search-results__content-header.aca-content {