]> git.openstreetmap.org Git - nominatim-ui.git/blob - src/assets/css/search.css
structured search form
[nominatim-ui.git] / src / assets / css / search.css
1 .top-bar {
2   width: 100%;
3   padding: 1em 15px;
4 }
5
6 .top-bar #q {
7   max-width: 500px;
8 }
9
10 .form-group-simple.hidden,
11 .form-group-structured.hidden {
12   display: none;
13 }
14
15 form #q {
16   min-width: 500px;
17 }
18 @media (max-width: 850px) {
19   form #q {
20     min-width: 400px;
21   }
22 }
23 form .checkbox-inline {
24   margin-left: 10px;  
25 }
26 form label {
27   font-weight: normal;
28 }
29
30 .search-type-link {
31   display: inline;
32   margin-right: 2em;
33   position: absolute;
34   right: 0
35 }
36
37 #switch-coords {
38   font-size: 0.8em;
39   font-weight: bold;
40   cursor: pointer;
41 }
42
43 .sidebar {
44   width: 25%;
45   padding: 15px;
46   padding-top: 0;
47   display: inline-block;
48   float: left;
49 }
50
51
52 #map-wrapper {
53   position: relative;
54   min-height: 700px;
55   width: 75%;
56   padding-right: 20px;
57   display: inline-block;
58   float: left;
59 }
60
61 #map {
62   height: 100%;
63   min-height: 700px;
64   background:#eee;
65 }
66
67 #map-position {
68   display: none;
69   position: absolute;
70   top: 0;
71   right: 20px;
72   padding: 0 5px;
73   color: #333;
74   font-size: 11px;
75   background-color: rgba(255, 255, 255, 0.7);
76   z-index: 1000;
77 }
78
79 #map-position-close {
80   text-align: right;
81 }
82
83 .result {
84   font-size: 0.8em;
85   margin: 5px;
86   margin-top:0px;
87   padding: 4px 8px;
88   border-radius: 2px;
89   background:#F0F7FF;
90   border: 2px solid #D7E7FF;
91   cursor:pointer;
92   min-height: 5em;
93 }
94
95
96 .result.highlight {
97   background-color: #D9E7F7;
98   border-color: #9DB9E4;
99 }
100 .result.highlight .details {
101   margin: 10px auto;
102   display: block;
103   max-width: 10em;
104 }
105 .result img{
106   float: right;
107 }
108 .result .type{
109   color: gray;
110   font-size: 0.8em;
111 }
112 .result .details {
113   display: none;
114 }
115
116 .result .coords {
117   display: none;  
118 }
119
120 .noresults{
121   text-align: center;
122   padding: 1em;
123 }
124
125 .more{
126   text-align:center;
127   margin-top: 1em;
128 }
129
130 @media (max-width: 768px) {
131   #content {
132     top: 0;
133     position: relative;
134   }
135   #map-wrapper {
136     width: 100%;
137     max-height: 300px;
138     padding: 20px;
139   }
140   #map-position {
141     top: 20px;
142     right: 20px;
143   }
144   #map {
145     height: 300px;
146   }
147   .sidebar {
148     width: 100%;
149   }
150   .search-button-group {
151     display: inline;
152   }
153 }
154
155 .search-button-group {
156   margin-top: 3px;
157   box-sizing: content-box;
158   margin-bottom: 3px;
159 }
160
161 label {
162   font-weight: normal;
163 }