Commit 88a4a857 authored by Nikita Hovratov's avatar Nikita Hovratov Committed by Benjamin Franzke
Browse files

[BUGFIX] Exclude colorpicker from overflow hidden

In order to fix a visual bug of overflowing select
fields inside palettes, the css attribute overflow:
hidden has been added to one of the wrapping fields
of form wizards.

This caused our colorpicker to be invisible for the
user, as it is directly appended after the input
field inside the DOM (Unlike to the behaviour of
flatpickr, which is added to the end of the body
tag).

A new modifier class
"form-wizards-element--overflow-visible" has been
added to disable the overflow hidden rule for
specific fields.

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


Tested-by: Benjamin Franzke's avatarBenjamin Franzke <bfr@qbus.de>
Tested-by: core-ci's avatarcore-ci <typo3@b13.com>
Reviewed-by: Benjamin Franzke's avatarBenjamin Franzke <bfr@qbus.de>
parent e4211cf1
......@@ -313,9 +313,12 @@ select {
> .form-wizards-element {
grid-area: main;
overflow: hidden;
min-width: 120px;
&:not(.form-wizards-element--overflow-visible) {
overflow: hidden;
}
.col-icon img,
.inline-icon img {
max-width: 2em;
......
......@@ -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">';
$mainFieldHtml[] = '<div class="form-wizards-element form-wizards-element--overflow-visible">';
$mainFieldHtml[] = '<input type="text" ' . GeneralUtility::implodeAttributes($attributes, true) . ' />';
$mainFieldHtml[] = '<input type="hidden" name="' . $parameterArray['itemFormElName'] . '" value="' . htmlspecialchars($itemValue) . '" />';
$mainFieldHtml[] = '</div>';
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment