1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
|
.overlay {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.5);
z-index: 999;
}
.dialog {
z-index: 1000;
position: fixed;
right: 0;
left: 0;
top: 20px;
margin-right: auto;
margin-left: auto;
min-height: 200px;
width: 90%;
max-width: 520px;
background-color: #fff;
padding: 12px;
box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.349), 0 13px 19px 2px rgba(0, 0, 0, 0.349), 0 5px 24px 4px rgba(0, 0, 0, 0.349);
}
@media (min-width: 768px) {
.dialog {
top: 40px;
}
}
.dialog__close-btn {
border: 0;
background: none;
color: #2d2d2d;
position: absolute;
top: 8px;
right: 8px;
font-size: 1.2em;
display: block;
border: #2d2d2d 1px solid;
}
|
