6fa5705d4b
- Ensure that the dimmer always covers the whole page and that the modal is centered. - Ensure that `body` hides overflow so you cannot scroll on the page after the modal is opened. - The adjusted CSS 'behavior' originates from the original dimmer module. - Regression of https://codeberg.org/forgejo/forgejo/pulls/7416. - E2E test added. Screenshots Before: https://codeberg.org/attachments/fb8c84b3-94ba-4597-b468-4bf344f356ed After: https://codeberg.org/attachments/a6583eb9-1ec7-4e40-960a-4986f6e17535 Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/7471 Reviewed-by: Beowulf <beowulf@beocode.eu> Reviewed-by: 0ko <0ko@noreply.codeberg.org> Co-authored-by: Gusted <postmaster@gusted.xyz> Co-committed-by: Gusted <postmaster@gusted.xyz>
25 lines
452 B
CSS
25 lines
452 B
CSS
body:has(> .ui.active.dimmer) {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.ui.active.dimmer {
|
|
display: flex;
|
|
opacity: 1;
|
|
}
|
|
|
|
.ui.dimmer {
|
|
align-items: center;
|
|
animation-fill-mode: both;
|
|
background: var(--color-overlay-backdrop);
|
|
display: none;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
position: fixed;
|
|
opacity: 0;
|
|
transform-origin: center center;
|
|
justify-content: center;
|
|
user-select: none;
|
|
width: 100%;
|
|
will-change: opacity;
|
|
z-index: 1000;
|
|
}
|