Revert "DDFLSBP-637 - Change advanced search input element into and i…

…mg element"
danskernesdigitalebibliotek · Aug 12, 2024 · 42f6ce1 · 42f6ce1
1 parent 367ac59
commit 42f6ce1
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 15 deletions.
diff --git a/src/components/search-bar/search-bar.tsx b/src/components/search-bar/search-bar.tsx
@@ -84,8 +84,10 @@ const SearchBar: React.FC<SearchBarProps> = ({
           }
         }}
       />
-      <button
-        type="button"
+      <input
+        type="image"
+        src={expandIcon}
+        alt={t("searchHeaderDropdownText")}
         className={clsx("header__menu-dropdown-icon", {
           "header__menu-dropdown-icon--expanded": isHeaderDropdownOpen
         })}
@@ -105,10 +107,7 @@ const SearchBar: React.FC<SearchBarProps> = ({
         aria-label={t("searchHeaderDropdownText")}
         data-cy="search-header-dropdown-icon"
         aria-expanded={isHeaderDropdownOpen}
-        aria-controls="search-header-dropdown"
-      >
-        <img src={expandIcon} alt="" />
-      </button>
+      />
     </>
   );
 };

diff --git a/src/components/search-bar/story-header.dev.inc.tsx b/src/components/search-bar/story-header.dev.inc.tsx
@@ -129,18 +129,14 @@ const StoryHeader: React.FC<StoryHeaderProps> = ({ search, userProfile }) => {
               <input
                 type="image"
                 src={searchIcon}
-                alt="search-button"
                 className="header__menu-search-icon"
+                alt="search icon"
               />
-              <button
-                type="button"
+              <img
                 className="header__menu-dropdown-icon"
-                aria-label="dropdown with advanced search"
-                aria-expanded="false"
-                aria-controls="search-header-dropdown"
-              >
-                <img src={expandIcon} alt="" />
-              </button>
+                src={expandIcon}
+                alt="expand dropdown icon"
+              />
             </div>
           )}
         </div>