atst/styles/components/_modal.scss
2018-08-03 09:09:07 -04:00

48 lines
778 B
SCSS

.modal {
position: fixed;
z-index: 3;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: $color-overlay;
.modal__dialog {
padding: $gap;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
@include media($medium-screen) {
padding: $gap * 2;
}
@include media($large-screen) {
padding: $gap * 4;
}
.modal__body {
background-color: $color-white;
padding: $gap * 2;
flex-grow: 1;
overflow-y: auto;
max-width: 80rem;
@include media($medium-screen) {
padding: $gap * 4;
flex-grow: 0;
}
h1, h2 {
@include h3;
}
:first-child {
margin-top: 0;
}
}
}
}