You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
65 lines
1.5 KiB
65 lines
1.5 KiB
2 years ago
|
.overlay {
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
bottom: 0;
|
||
|
|
margin: 0 !important;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
border-radius: inherit;
|
||
|
|
display: flex;
|
||
|
|
position: fixed;
|
||
|
|
transition: .3s cubic-bezier(.25,.8,.5,1),z-index 1ms;
|
||
|
|
z-index: 5;
|
||
|
|
|
||
|
|
&.overlay-absolute {
|
||
|
|
position: absolute;
|
||
|
|
}
|
||
|
|
|
||
|
|
& .overlay-scrim {
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
bottom: 0;
|
||
|
|
border-radius: inherit;
|
||
|
|
position: absolute;
|
||
|
|
height: 100%;
|
||
|
|
width: 100%;
|
||
|
|
border-color: transparent;
|
||
|
|
background-color: transparent;
|
||
|
|
animation: animation-fadein ease 0.15s;
|
||
|
|
-webkit-animation: animation-fadein ease 0.15s;
|
||
|
|
-moz-animation: animation-fadein ease 0.15s;
|
||
|
|
-o-animation: animation-fadein ease 0.15s;
|
||
|
|
|
||
|
|
&.overlay-dark {
|
||
|
|
border-color: var(--palette-overlay-dark);
|
||
|
|
background-color: var(--palette-overlay-dark);
|
||
|
|
}
|
||
|
|
|
||
|
|
&.overlay-light {
|
||
|
|
border-color: var(--palette-overlay-light);
|
||
|
|
background-color: var(--palette-overlay-light);
|
||
|
|
}
|
||
|
|
&:hover {
|
||
|
|
cursor: default;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
& .overlay-content {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
&.overlay-popover {
|
||
|
|
z-index: var(--zindex-popover);
|
||
|
|
}
|
||
|
|
|
||
|
|
&.overlay-dialog {
|
||
|
|
z-index: calc(var(--zindex-dialog) + 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
&.overlay-drawer {
|
||
|
|
z-index: calc(var(--zindex-appbar) + 1); //<-- Yes this is correct we want to display it on top of the Appbar
|
||
|
|
}
|
||
|
|
}
|