diff --git a/packages/web/app/components/search-drawer/accordion-search-form.module.css b/packages/web/app/components/search-drawer/accordion-search-form.module.css index 7f539364..a6555e5c 100644 --- a/packages/web/app/components/search-drawer/accordion-search-form.module.css +++ b/packages/web/app/components/search-drawer/accordion-search-form.module.css @@ -10,7 +10,7 @@ .sectionCard { background: var(--ant-color-bg-container, #FFFFFF); border-radius: 16px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 1px 3px rgba(0, 0, 0, 0.08); + box-shadow: var(--ant-box-shadow-tertiary, 0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02)); overflow: hidden; transition: box-shadow 200ms ease; } @@ -20,11 +20,11 @@ } .sectionCard:not(.sectionCardActive):hover { - box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08); + box-shadow: var(--ant-box-shadow-secondary, 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05)); } .sectionCardActive { - box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1), 0 1px 4px rgba(0, 0, 0, 0.06); + box-shadow: var(--ant-box-shadow, 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05)); } /* Collapsed row */ diff --git a/packages/web/app/components/search-drawer/accordion-search-form.tsx b/packages/web/app/components/search-drawer/accordion-search-form.tsx index 60adcaea..470a6856 100644 --- a/packages/web/app/components/search-drawer/accordion-search-form.tsx +++ b/packages/web/app/components/search-drawer/accordion-search-form.tsx @@ -342,7 +342,17 @@ const AccordionSearchForm: React.FC = ({
setActiveKey(section.key) } : {})} + {...(!isActive ? { + onClick: () => setActiveKey(section.key), + onKeyDown: (e: React.KeyboardEvent) => { + if (e.key === 'Enter' || e.key === ' ') { + e.preventDefault(); + setActiveKey(section.key); + } + }, + role: 'button', + tabIndex: 0, + } : {})} > {isActive ? (
diff --git a/packages/web/app/components/search-drawer/search-dropdown.module.css b/packages/web/app/components/search-drawer/search-dropdown.module.css index 3dc30b00..87521aba 100644 --- a/packages/web/app/components/search-drawer/search-dropdown.module.css +++ b/packages/web/app/components/search-drawer/search-dropdown.module.css @@ -15,19 +15,16 @@ /* Clear all - underlined text link */ .clearAllButton { - background: none; - border: none; - padding: 0; - font-size: 16px; - font-weight: 600; - color: var(--ant-color-text, #111827); - text-decoration: underline; - cursor: pointer; - line-height: 1.5; + padding: 0 !important; + font-size: 16px !important; + font-weight: 600 !important; + color: var(--ant-color-text, #111827) !important; + text-decoration: underline !important; + height: auto !important; } .clearAllButton:hover { - color: var(--ant-color-text-secondary, #6B7280); + color: var(--ant-color-text-secondary, #6B7280) !important; } .clearAllButton:active { diff --git a/packages/web/app/components/search-drawer/search-dropdown.tsx b/packages/web/app/components/search-drawer/search-dropdown.tsx index a6e4ab8c..49a839e6 100644 --- a/packages/web/app/components/search-drawer/search-dropdown.tsx +++ b/packages/web/app/components/search-drawer/search-dropdown.tsx @@ -36,13 +36,13 @@ const SearchDropdown: React.FC = ({ boardDetails, open, onC const drawerFooter = (
- +