_search-results.scss
ASCII text
1
/* Search */
2
3
@use "../../../../theme-color";
4
@use "../../gnome-shell";
5
@use "../../typography";
6
@use "overview";
7
@use "app-grid";
8
9
// search overview container
10
$searchResultsContent: if(gnome-shell.$version >= 3.34, "#searchResultsContent", "#searchResultsBin");
11
12
#{$searchResultsContent} {
13
max-width: 1024px;
14
}
15
16
#searchResultsContent {
17
padding-left: 16px;
18
padding-right: 16px;
19
spacing: 16px;
20
}
21
22
// search results sections "the boxes"
23
.search-section {
24
// This should be equal to #searchResultsContent spacing
25
spacing: 16px;
26
27
// separator
28
.search-section-separator {
29
height: 1px;
30
background-color: theme-color.divider(overview.$on-color);
31
}
32
33
&:last-child .search-section-separator {
34
height: 0;
35
background-color: transparent;
36
}
37
}
38
39
// content
40
.search-section-content {
41
// This is the space between the provider icon and the results container
42
spacing: 32px;
43
44
padding: 0;
45
border: 0;
46
border-radius: 0;
47
box-shadow: none;
48
background-color: transparent;
49
color: inherit;
50
text-shadow: none;
51
}
52
53
// "no results" text
54
.search-statustext {
55
@include overview.status-text;
56
}
57
58
@if gnome-shell.$version >= 3.38 {
59
.grid-search-results {
60
spacing: 32px;
61
}
62
}
63
64
// Search results with icons
65
.grid-search-result {
66
@extend %app-well-app;
67
}
68
69
// search result provider
70
.search-provider-icon {
71
@include overview.item;
72
73
// content
74
.list-search-provider-content {
75
spacing: 20px;
76
77
// provider labels
78
.list-search-provider-details {
79
width: 150px;
80
margin-top: 0;
81
color: theme-color.hint(overview.$on-color);
82
// font-weight: bold;
83
}
84
}
85
}
86
87
// search results list
88
.list-search-results {
89
spacing: 4px;
90
}
91
92
// search result listitem
93
.list-search-result {
94
@include overview.item;
95
96
// content
97
.list-search-result-content {
98
spacing: 30px;
99
}
100
101
// list item title (with leading icon)
102
.list-search-result-title {
103
spacing: 12px;
104
color: inherit;
105
@include typography.subtitle1;
106
}
107
108
// list item description
109
.list-search-result-description {
110
color: theme-color.hint(overview.$on-color);
111
}
112
}
113