Prevent modal covered by scrollbar

Using units relative to the document, rather than the screen.

I don't think that remaining min-height should be there at all, but reveal-modal is used a lot so I don't know for sure.
This commit is contained in:
David Cook
2024-02-06 14:52:44 +11:00
parent 784f74f466
commit 6189feadaa

View File

@@ -16,7 +16,7 @@ dialog {
display: none;
position: absolute;
z-index: 1005;
width: 100vw;
width: 100%;
top: 0;
border-radius: 0.4em;
border: 0px none;
@@ -75,8 +75,6 @@ dialog.full {
top: 0;
left: 0;
height: 100%;
height: 100vh;
min-height: 100vh;
max-width: none !important;
margin-left: 0 !important;
}
@@ -161,7 +159,7 @@ dialog[open] {
@media only screen and (max-width: 40em) {
.reveal-modal,
dialog {
min-height: 100vh;
min-height: 100%;
}
}
@@ -212,7 +210,7 @@ dialog[open] {
}
.reveal-modal.full,
dialog.full {
width: 100vw;
width: 100%;
max-width: 62.5rem;
left: 0;
right: 0;