_network-dialog.scss
ASCII text
1
/* Network Dialogs */
2
.nm-dialog {
3
max-height: 34em;
4
min-height: 31em;
5
min-width: 32em;
6
}
7
8
.nm-dialog-content {
9
spacing: 20px;
10
padding: 24px;
11
}
12
13
.nm-dialog-airplane-box {
14
spacing: 12px;
15
}
16
17
.nm-dialog-airplane-headline {
18
// font-weight: bold;
19
text-align: center;
20
}
21
22
.nm-dialog-airplane-text {
23
color: hint($on-surface);
24
}
25
26
// header
27
.nm-dialog-header {
28
@include type(headline6);
29
}
30
31
.nm-dialog-subheader {
32
color: hint($on-surface);
33
}
34
35
.nm-dialog-header-icon {
36
icon-size: 32px;
37
color: hint($on-surface);
38
}
39
40
.nm-dialog-header-hbox {
41
spacing: 16px;
42
}
43
44
// list of networks
45
.nm-dialog-scroll-view {
46
border: 0;
47
padding: 0;
48
background-color: transparent;
49
}
50
51
// list item
52
.nm-dialog-item {
53
transition-duration: $duration;
54
padding: 12px;
55
spacing: 20px;
56
border-bottom: 0;
57
border-radius: $corner-radius;
58
font-size: 1em;
59
60
&:focus {
61
background-color: overlay("focus", $on-surface);
62
}
63
64
&:hover {
65
background-color: overlay("hover", $on-surface);
66
}
67
68
&:active {
69
transition-duration: $duration-ripple;
70
background-color: overlay("pressed", $on-surface);
71
}
72
73
&:selected {
74
background-color: $overlay-selected;
75
color: $on-surface;
76
}
77
}
78
79
// icons in list
80
.nm-dialog-icon {
81
icon-size: 16px;
82
color: hint($on-surface);
83
}
84
85
.nm-dialog-icons {
86
spacing: .5em;
87
}
88
89
// no networks
90
.no-networks-label {
91
color: hint($on-surface);
92
}
93
94
.no-networks-box {
95
spacing: 12px;
96
}
97