This repository has been archived by the owner on Nov 1, 2020. It is now read-only.
Fix date picker not visible in slideshow sharing dialog #349
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
The z-index for the date picker is forced in the server CSS files to "1111" through the use of "!important", so even if a higher value is explicitly set in the "style" attribute of the element the value set in the server CSS files is the one used. As the z-index of the slideshow is "100000" and the date picker is added as a sibling of it and not as a child the date picker appears behind the slideshow. In order to be visible the date picker needs to override the z-index set in the server CSS files to be higher than the one used for the slideshow and for the share dialog shown in the slideshow. Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
danxuliu
added
3. to review
MorrisJobke
deleted the
fix-date-picker-not-visible-in-slideshow-sharing-dialog
branch
|
@danxuliu Could you open the backport PR? |
|
stable12 should be enough |
13 tasks
|
Let me do the backport |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Fixes #313
The jQuery UI Datepicker Widget automatically sets the
z-indexof the date picker element to thez-index+1of the element it is called on. However the server sets thez-indexof the date picker using!importantin its CSS files, so it overrides the value set directly on the element. As thez-indexof the slideshow is100000, thez-indexof the date picker element set in the server is1111, and the date picker element is a sibling of the slideshow element the date picker appears behind it and thus it is not visible.But, why is the
z-indexexplicitly set in the server CSS files if the widget automatically sets it? Because the automatic calculation of the z-index is flawed. Thez-indexof the element is got from the first ancestor (or itself) that has an absolute, relative or fixed position. However, the relevantz-indexfor the date picker element is the one from the ancestor element that is also a sibling of the date picker element, so depending on the DOM structure and CSS rules the automaticz-indexcould work or not, and thus an explicitz-indexis needed instead.Due to all this the problem has to be solved by overriding both the
z-indexset by the server CSS files and thez-indexautomatically set on thestyleattribute of the element, which fortunately can be done by setting thez-indexwith!importantand a more specific selector than the one used in the server CSS file.