1/* Search */
2
3// search overview container
4#searchResultsContent {
5  max-width: 1024px;
6  spacing: $base_margin * 2;
7}
8
9// search results sections "the boxes"
10.search-section {
11  // This should be equal to #searchResultsContent spacing
12  spacing: $base_margin * 2;
13
14  // separator
15  .search-section-separator {
16    // height: 1px;
17    // background-color: $osd_outer_borders_color;
18    height: 0;
19    background-color: transparent;
20  }
21}
22
23// content
24.search-section-content {
25  background-color: transparentize(lighten($osd_bg_color, 5%), 0.2);
26  border-radius: $modal_radius+3;
27  border: 1px solid $osd_outer_borders_color;
28  box-shadow: 0 2px 4px 0 $shadow_color;
29  text-shadow: 0 1px if($variant == 'light', rgba(255,255,255,0.2), rgba(0,0,0,0.2));
30  color: $osd_fg_color;
31  padding: $base_padding * 3;
32  // This is the space between the provider icon and the results container
33  spacing: $base_margin * 2;
34}
35
36%search-section-content-item {
37  @extend %icon_tile;
38
39  &:focus,
40  &:hover,
41  &:selected {
42    background-color: transparentize($osd_fg_color, .9);
43    transition-duration: 200ms;
44  }
45
46  &:active,
47  &:checked {
48    background-color: transparentize(darken($osd_bg_color, 10%), .1);
49  }
50}
51
52// "no results" text
53.search-statustext {
54  @extend %status_text;
55}
56
57.grid-search-results {
58  spacing: $base_spacing * 6;
59}
60
61// Search results with icons
62.grid-search-result {
63  @extend %app-well-app;
64}
65
66// search result provider
67.search-provider-icon {
68  @extend %search-section-content-item;
69
70  // content
71  .list-search-provider-content {
72    spacing: $base_spacing * 2;
73
74    // provider labels
75    .list-search-provider-details {
76      width: 120px;
77      margin-top: 0;
78      color: darken($osd_fg_color, 8%);
79      // font-weight: bold;
80    }
81  }
82}
83
84// search results list
85.list-search-results {
86  spacing: $base_spacing;
87}
88
89// search result listitem
90.list-search-result {
91  @extend %search-section-content-item;
92
93  // content
94  .list-search-result-content {
95    spacing: $base_padding;
96  }
97
98  // list item title (with leading icon)
99  .list-search-result-title {
100    spacing: $base_spacing * 2;
101    // font-weight: bold;
102  }
103
104  // list item description
105  .list-search-result-description {
106    color: darken($osd_fg_color, 30%);
107  }
108}
109