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