Zelda64Recomp/assets/scss/styles/components/Prompt.scss

70 lines
1.5 KiB
SCSS

@use 'sass:math';
$prompt-space: 24;
.prompt {
&__overlay {
pointer-events: none;
background-color: $color-bg-overlay;
}
&__overlay,
&__content-wrapper {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
&__content-wrapper {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
&__content {
display: flex;
flex-direction: column;
position: relative;
margin: auto;
flex: 1 1 100%;
max-width: space(700);
width: 100%;
height: auto;
background: $color-modal-overlay;
border-radius: $border-radius-modal;
border-color: $color-border;
border-width: $border-width-thickness;
h3, p {
margin: space($prompt-space);
}
p {
margin-top: 0;
}
}
&__controls {
display: flex;
flex-direction: row;
justify-content: center;
padding: space($prompt-space) space(math.div($prompt-space, 2));
border-top-color: $color-border-soft;
border-top-width: $border-width-thickness;
.button {
nav-up: none;
nav-down: none;
margin: 0 space(math.div($prompt-space, 2));
min-width: space(math.div(700, 3));
text-align: center;
}
}
}