49 lines
800 B
CSS
49 lines
800 B
CSS
.root {
|
|
position: relative;
|
|
border: 2px solid black;
|
|
padding: 0.5em;
|
|
margin: 1em;
|
|
}
|
|
|
|
.quit {
|
|
--color: darkred;
|
|
position: absolute;
|
|
right: 1em;
|
|
top: 1em;
|
|
border-radius: 999999px;
|
|
background: transparent;
|
|
border: 1px solid var(--color);
|
|
color: var(--color);
|
|
font-weight: 700;
|
|
}
|
|
|
|
.quit:is(:focus, :hover) {
|
|
--color: red;
|
|
filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.5));
|
|
}
|
|
|
|
.flex {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 0.1em;
|
|
}
|
|
|
|
.flex > * {
|
|
width: max-content;
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
.root {
|
|
border-color: gray;
|
|
}
|
|
|
|
.quit {
|
|
--color: indianred;
|
|
}
|
|
|
|
.quit:is(:focus, :hover) {
|
|
--color: red;
|
|
filter: drop-shadow(0px 0px 2px rgba(255, 255, 255, 0.5));
|
|
}
|
|
}
|