[TASK] Add label to toolbar search field

Add a label to the search field via aria-label attribute, because a
separate all time visible label would break the design.

Also disable pointer-events for the icon so the search field
is focused when you click on the icon.

Resolves: #92644
Releases: master
Change-Id: If897e458efc0c0caf1958391b8f7ddbeca92f9f7
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/66276


Tested-by: TYPO3com <noreply@typo3.com>
Tested-by: Michael Telgkamp <michael.telgkamp@mindscreen.de>
Tested-by: Benni Mack <benni@typo3.org>
Reviewed-by: Michael Telgkamp <michael.telgkamp@mindscreen.de>
Reviewed-by: Benni Mack <benni@typo3.org>

Build/Sources/Sass/typo3/_main_form.scss

@@ -131,6 +131,7 @@ fieldset[disabled] .form-control {
     left: 15px;
     transform: translate(0, -50%);
     z-index: 1;
+    pointer-events: none;
 
     + .form-control,
     + .form-control-clearable .form-control {

typo3/sysext/backend/Resources/Private/Templates/ToolbarItems/LiveSearchToolbarItem.html

@@ -7,7 +7,8 @@
             </div>
             <input type="text" class="form-control toolbar-item-search-field t3js-topbar-navigation-search-field"
                         placeholder="{f:translate(key: 'LLL:EXT:core/Resources/Private/Language/locallang_core.xlf:toolbarItems.search') -> f:format.htmlspecialchars()}"
-                        id="live-search-box" autocomplete="off">
+                        id="live-search-box" aria-label="{f:translate(key: 'LLL:EXT:core/Resources/Private/Language/locallang_core.xlf:toolbarItems.searchLabel')}"
+                        autocomplete="off" spellcheck="off" autocapitalize="none"/>
         </div>
     </div>
 </form>

typo3/sysext/core/Resources/Private/Language/locallang_core.xlf

@@ -1191,6 +1191,9 @@ Do you want to refresh it now?</source>
 			<trans-unit id="toolbarItems.search" resname="toolbarItems.search">
 				<source>Search</source>
 			</trans-unit>
+			<trans-unit id="toolbarItems.searchLabel" resname="toolbarItems.searchLabel">
+				<source>Search the contents</source>
+			</trans-unit>
 			<trans-unit id="toolbarItems.toolbarOpenClose" resname="toolbarItems.toolbarOpenClose">
 				<source>Open/Close toolbar</source>
 			</trans-unit>