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