[BUGFIX] Remove "overflow: hidden" from form-wizards-element

In order to fix select fields overflowing into each other
when they have very long option titles, the CSS rule
"overflow: hidden" has been added. As it seems, this wasn't
even necessary as the rule "min-width: 120px" already does
the trick.

The CSS rule "overflow: hidden" is now removed, which
enables the accessibility box-shadows from bootstrap 5
again.

Resolves: #97565
Related: #94688
Releases: main, 11.5
Change-Id: Ifd8495430ecdc404fa1dbebe9633ef5f401a6af6
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/74470


Tested-by: core-ci <typo3@b13.com>
Tested-by: Nikita Hovratov <nikita.h@live.de>
Reviewed-by: Nikita Hovratov <nikita.h@live.de>

Build/Sources/Sass/typo3/_main_form.scss

@@ -315,10 +315,6 @@ select {
         grid-area: main;
         min-width: 120px;
 
-        &:not(.form-wizards-element--overflow-visible) {
-            overflow: hidden;
-        }
-
         .col-icon img,
         .inline-icon img {
             max-width: 2em;

typo3/sysext/backend/Classes/Form/Element/InputColorPickerElement.php

@@ -176,7 +176,7 @@ class InputColorPickerElement extends AbstractFormElement
         $mainFieldHtml = [];
         $mainFieldHtml[] = '<div class="form-control-wrap" style="max-width: ' . $width . 'px">';
         $mainFieldHtml[] =  '<div class="form-wizards-wrap">';
-        $mainFieldHtml[] =      '<div class="form-wizards-element form-wizards-element--overflow-visible">';
+        $mainFieldHtml[] =      '<div class="form-wizards-element">';
         $mainFieldHtml[] =          '<input type="text" ' . GeneralUtility::implodeAttributes($attributes, true) . ' />';
         $mainFieldHtml[] =          '<input type="hidden" name="' . $parameterArray['itemFormElName'] . '" value="' . htmlspecialchars($itemValue) . '" />';
         $mainFieldHtml[] =      '</div>';