Snek/src/less/popup.less

118 lines
1.4 KiB
Plaintext

@keyframes popupAppear {
0% {
background: rgba(0, 0, 0, 0%);
}
100% {
background: rgba(0, 0, 0, 90%);
}
}
.popup {
&.animation {
animation: popupAppear 1s linear;
}
background: rgba(0, 0, 0, 90%);
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
.content {
border-radius: 2rem;
background: @bg;
text-align: center;
box-shadow: black 0 0 1rem;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
box-sizing: border-box;
padding: 2rem;
display: flex;
flex-direction: column;
font-size: 1.4rem;
&.large {
width: 80vw;
height: 80vh;
}
& > section {
margin: 1rem;
&:first-of-type {
display: flex;
flex-direction: column;
align-items: center;
overflow-y: auto;
flex: 1;
& > * {
margin: .5rem;
}
}
&:last-of-type {
display: flex;
& > * {
flex: 1;
}
}
}
.dual {
display: flex;
flex-direction: column;
width: 100%;
tr {
display: flex;
}
th {
text-align: right;
&::after {
content: ':';
}
}
td {
text-align: left;
}
th, td {
padding: 0 .5rem;
flex: 1;
}
}
.table {
width: 100%;
td, th {
padding: .5rem;
}
}
label {
margin-right: 1ex;
}
button {
display: inline;
color: @accentfg;
background: @accentbg;
font-weight: bold;
border-radius: 1rem;
border: 0;
padding: 2rem;
margin: 1rem;
}
}
}