ASCII text
1
dialog::backdrop {
2
background: var(--color-modal-backdrop);
3
opacity: 0;
4
}
5
dialog:modal {
7
pointer-events: all;
8
opacity: 1;
9
visibility: visible;
10
}
11
dialog:modal::backdrop {
13
opacity: 1;
14
}
15
dialog {
17
max-width: 100vw;
18
min-width: 100vw;
19
max-height: 100vh;
20
min-height: 100vh;
21
border: none;
22
padding: 0;
23
margin: 0;
24
position: fixed;
25
display: flex;
26
top: 0;
27
left: 0;
28
background: transparent;
29
border: none;
30
align-items: center;
31
justify-content: center;
32
opacity: 0;
33
pointer-events: none;
34
visibility: hidden;
35
}
36
dialog.sheet-left {
38
justify-content: flex-start;
39
align-items: stretch;
40
}
41
dialog.sheet-right {
43
justify-content: flex-end;
44
align-items: stretch;
45
}
46
dialog.sheet-top {
48
justify-content: stretch;
49
align-items: flex-start;
50
}
51
dialog.sheet-bottom {
53
justify-content: stretch;
54
align-items: flex-end;
55
}
56
dialog {
58
pointer-events: none !important;
59
}
60
dialog > * {
62
pointer-events: all;
63
}