add nsfw warning dialog
This commit is contained in:
parent
d671a4c01e
commit
c807895244
12 changed files with 346 additions and 102 deletions
78
style/shiny/nsfw-warning.css
Normal file
78
style/shiny/nsfw-warning.css
Normal file
|
@ -0,0 +1,78 @@
|
|||
.dialog {
|
||||
position: fixed;
|
||||
top: 0; left: 0;
|
||||
width: 100vw; height: 100vh;
|
||||
margin: 0;
|
||||
z-index: 1000;
|
||||
|
||||
background: hsl(340deg, 35%, 15%, 90%);
|
||||
backdrop-filter: blur(15px);
|
||||
color: var(--text-col);
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.dialog-inner {
|
||||
place-self: center;
|
||||
|
||||
display: grid;
|
||||
grid-template:
|
||||
"header header"
|
||||
"icon text"
|
||||
"buttons buttons"
|
||||
/ 1fr 3fr;
|
||||
grid-gap: 0.5em;
|
||||
align-items: center;
|
||||
|
||||
min-height: 20vh;
|
||||
max-width: 60vw;
|
||||
padding: 1.5em 3em 2em;
|
||||
|
||||
background: var(--background);
|
||||
border: var(--border);
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.dialog h1 {
|
||||
margin: 0;
|
||||
grid-area: header;
|
||||
justify-self: center;
|
||||
}
|
||||
|
||||
.dialog-icon {
|
||||
height: 3em;
|
||||
width: 3em;
|
||||
grid-area: icon;
|
||||
justify-self: center;
|
||||
}
|
||||
|
||||
.dialog-message {
|
||||
grid-area: text;
|
||||
justify-self: start;
|
||||
}
|
||||
|
||||
.dialog-buttons {
|
||||
grid-area: buttons;
|
||||
justify-self: center;
|
||||
}
|
||||
|
||||
.dialog button + button {
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
.dialog button {
|
||||
border: none;
|
||||
border-radius: 0.75em;
|
||||
padding: 0.5em 1em;
|
||||
|
||||
font-family: Muller;
|
||||
font-weight: 600;
|
||||
color: black;
|
||||
}
|
||||
|
||||
button.yes {
|
||||
background: hsl(100deg, 70%, 80%);
|
||||
}
|
||||
|
||||
button.no {
|
||||
background: hsl(5deg, 70%, 80%);
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue