* Stylelint added * lint staged addition * Found the right incantation * WIP * Typescript import * stylelint --fix * Stylelint runs clean! * More linting! * paths are hard * linting * Tim Code Review * lint part of build * Better selector class pattern rule * Tim CR * Linting + --fix * Fixing stylelint issue * Tim CR
44 lines
707 B
SCSS
44 lines
707 B
SCSS
@use "../../scss/colors";
|
|
@use "../../scss/variables";
|
|
|
|
@keyframes fade-in {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
.modal {
|
|
animation: fade-in 0.2s ease-out;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
background: rgba(colors.$black, 0.5);
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
z-index: 100;
|
|
}
|
|
|
|
.card {
|
|
margin-left: variables.$width-size-menu;
|
|
max-width: calc(100% - (#{variables.$width-size-menu} - #{variables.$spacing-lg}) * 2);
|
|
|
|
&.sm {
|
|
width: variables.$width-modal-sm;
|
|
}
|
|
|
|
&.md {
|
|
width: variables.$width-modal-md;
|
|
}
|
|
|
|
&.lg {
|
|
width: variables.$width-modal-lg;
|
|
}
|
|
|
|
&.xl {
|
|
width: variables.$width-modal-xl;
|
|
}
|
|
}
|