Skip to content

fix(OutOfOfficeForm): datepicker overlapping with sidebar#12303

Open
GVodyanov wants to merge 1 commit intomainfrom
fix/overlapping-datepicker-in-ooo
Open

fix(OutOfOfficeForm): datepicker overlapping with sidebar#12303
GVodyanov wants to merge 1 commit intomainfrom
fix/overlapping-datepicker-in-ooo

Conversation

@GVodyanov
Copy link
Contributor

This is being caused by the main view of the settings having its overflow hidden by the sidebar, and the popup of the datepicker is contained inside the main view and isn't appended somewhere later in the DOM

The ideal solution here would be to have the popup somewhere else where it isn't constrained, but seeing as it comes from a third party library I don't know what we can do about that.

Before After
image swappy-20260123_131330

Signed-off-by: Grigory Vodyanov <scratchx@gmx.com>
Copy link
Member

@ChristophWurst ChristophWurst left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

This is being caused by the main view of the settings having its overflow hidden by the sidebar

Out of curiosity, would lifting this in the upstream component be a problem? I assume any other floating elements inside settings are currently prone to a cut-off.


#ooo-first-day {
:deep(.mx-datepicker-popup) {
left: 0 !important;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

stylelint wants inset-inline-start. guess that make sense if the input is on the right in RTL mode

@hamza221
Copy link
Contributor

You can run npm run stylelint:fix

@hamza221 hamza221 added the bug label Jan 31, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants