searchbar design, lukke resultat, hoyde med scroll og tomme inputen + plassering
[u/erikhf/frm.git] / src / css / map.css
1 * {
2     margin: 0;
3 }
4
5 html, body {
6     height: 100%;
7 }
8
9 #map {
10     height: 100%;
11     width: 100%;
12     position:absolute;
13     top: 0;
14     left: 0;
15     z-index: 0;
16 }
17
18 /* search div */
19
20 #search {
21     position: relative;
22     z-index: 1;
23     margin-top: 20px;
24     margin-left: 20px;
25     background: transparent;
26     display: inline-block;
27     width: 400px;
28     max-width: 100%;
29 }
30
31 /* search input*/
32
33 #livesearch{
34     box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.3);
35     font-size: 16px;
36     font-family: Montserrat, sans-serif;
37     border: 1px solid white;
38     height: 52px;
39     margin-right: 0;
40     color: black;
41     outline: none;
42     background: white;
43     float: left;
44     box-sizing: border-box;
45     transition: all 0.15s;
46     border-radius: 2px 0px 0px 2px; /* top left, top right, bottom right, bottom left */
47
48 }
49
50 ::-webkit-input-placeholder {
51     color: grey;
52 }
53 :-moz-placeholder {
54     color: grey;
55 }
56 ::-moz-placeholder {
57     color: grey;
58 }
59 :-ms-input-placeholder {
60     color: grey;
61 }
62
63 #livesearch:focus {
64     background: white;
65 }
66
67 .knapp
68 {
69     border-radius: 0px 2px 2px 0px; /* top left, top right, bottom right, bottom left */
70     box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.3);
71     border-right: 1px solid white;
72     border-top:1px solid white;
73     border-bottom: 1px solid white;
74     border-left: 2px solid darkgrey;
75     background: white;
76     width: 60px;
77     padding: 0;
78     margin: 0;
79     text-align: center;
80     height: 52px;
81     cursor: pointer;
82     float: left;
83 }
84
85 .knapp:focus {
86     outline:0;
87 }
88
89 /* search results */
90
91
92 .divresult{
93     padding:0;
94     margin: 0;
95     background-color: white;
96     border-radius: 0;
97     border-top: 2px solid darkgrey;
98     box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.3);
99
100 }
101
102 .test{
103     padding:0;
104     margin: 0;
105     height: 40vh;
106     position: relative;
107     z-index: 1;
108     display: inline-block;
109     width: 80%;
110     margin-top: 0;
111     left: 0;
112     float: left;
113     font-size: 14px;
114     text-align: left;
115     list-style: none;
116     background-color: transparent;
117     border: none;
118     border-radius: 0px;
119 }
120
121 .result{
122     height: 25vh;
123     overflow: scroll;
124     position: relative;
125     z-index: 1;
126     display: inline-block;
127     width: 100%;
128     margin-top: 0;
129     left: 0;
130     float: left;
131     font-size: 14px;
132     text-align: left;
133     list-style: none;
134     background-color: #fff;
135     border: 1px solid whitesmoke;
136     box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.3);
137     border-radius: 0px 0px 2px 2px; /* top left, top right, bottom right, bottom left */
138 }
139
140 .result li{
141     padding: 0.5em 0.5em 0.5em 0;
142     margin: auto;
143     float: none;
144     border-bottom: 1px solid grey;
145
146 }
147
148 .result > li:first-child {
149     padding: 5px;
150     border: none;
151 }
152
153 .results > li > a{
154     position: relative;
155     margin-top: 10px;
156     display: block;
157     padding: 3px 5px;
158     clear: both;
159     font-weight: 400;
160     line-height: 1.42857143;
161     color: #333;
162     white-space: nowrap
163 }
164
165 .results > li > a:focus, .results > li > a:hover {
166     position: relative;
167     margin-top: 20px;
168     color: #262626;
169     text-decoration: none;
170     background-color: #f5f5f5
171 }
172
173 .emptyresult{
174     float: right;
175     border: 0;
176 }
177
178 .emptyresult:hover{
179     outline:0;
180     background: white;
181 }
182
183 /* filter options */
184
185 .dropdowndiv{
186     padding:0;
187     margin: 0;
188 }
189 .meny{
190     top: 0px;
191     margin-top: 0;
192     z-index: 1;
193     position: absolute;
194     float: left;
195     background-color: white;
196     border-radius: 0px;
197     margin-left: 6px;
198 }
199
200 .meny li{
201     background-color: white;
202     padding-left: 20px;
203     padding-right: 20px;
204 }
205
206 .filtervalg{
207     box-shadow: 0 0 1px darkgrey;
208     margin-top: 10px;
209     margin-bottom: 10px;
210     width: 200px;
211     height: 20px;
212     font-size: 12px;
213     font-family: Montserrat, sans-serif;
214     border: 1px solid darkgrey;
215     color: black;
216     outline: none;
217     background: whitesmoke;
218     box-sizing: border-box;
219     transition: all 0.15s;
220 }
221
222 .hide {
223     display:none;
224 }
225
226 .glyphicon-menu-down{
227     color: white;
228 }
229
230 /* modal */
231
232 #divModal{
233     position: relative;
234     margin-top: 0;
235
236 }
237
238 /* other */
239
240 .no-padding{
241     padding: 0;
242     padding: 0 !important;
243     margin: 0 !important;
244 }
245