TYPO3 Core

The new datetime picker (Task #91606) is overlayed by other form elements (e.g. checkbox to enable fields).
This is a problem with the CSS z-index.

Requirement¶

• current master (e.g. e3746d4454f978bb18065d9d838cbcaee4c0b49d)

Steps to reproduce¶

TCA:

• One input with 'renderType' => 'inputDateTime'
• multiple optional fields below

Steps:

1. Edit a record in the backend
2. Open the datepicker

Example (TCA):

'a' => [
    'config' => [
        'type' => 'input',
        'renderType' => 'inputDateTime',
        'eval' => 'datetime,null',
    ],
],
'b' => [
    'config' => [
        'type' => 'input',
        'renderType' => 'inputDateTime',
        'eval' => 'time,null',
    ],
],

Actual result¶

The checkbox is visible through the dialog (marked with red arrow)

Expected result¶

The checkbox should not be visible through the datepicker dialog.
Note: edited with developer tools

Additional notes¶

- The datepicker .flatpickr-calendar.open has the z-index 100
- The checkbox .t3-form-field-eval-null-checkbox has the z-index 150