Correct vertical position of map controls in small screen layout
[rails.git] / app / assets / stylesheets / small.css.scss
1 /* Styles specific to a small screen, such as iPhone, Android, etc... */
2
3 /* Default rules for the body of every page */
4
5 body {
6   font-size: 12px;
7 }
8
9 h1 {
10   font-size: 16px;
11 }
12
13 h2, h3, h4 {
14   font-size: 14px;
15 }
16
17 .wrapper {
18   margin: 0;
19 }
20
21 .site-edit #content,
22 .site-index #content,
23 .site-export #content {
24   left: 0;
25 }
26
27 .site-edit #top-bar,
28 .site-index #top-bar,
29 .site-export #top-bar {
30   position: relative;
31 }
32
33 .column-1 {
34   width: 100%;
35 }
36
37 /* Rules for the whole left sidebar, including the logo */
38
39 #left {
40   display: none;
41 }
42
43 /* Rules for tabbed navigation bar */
44
45 #top-bar {
46   left: 0;
47   margin: 0px;
48   height: 24px;
49   position: static;
50 }
51
52 #tabnav {
53   height: 19px;
54   margin: 0px;
55   padding-top: 5px;
56   margin-top: 26px;
57   font-size: 10px;
58   line-height: 10px;
59 }
60
61 #tabnav a, #tabnav a:link, #tabnav a:visited {
62   font-size: 10px;
63   line-height: 10px;
64   padding: 5px;
65   margin-right: 1px;
66 }
67
68 .menuicon { line-height: 10px;}
69
70 /* Rules for the site name - shown when left sidebar is hidden */
71
72 #small-title {
73   font-size: 12px;
74   line-height: 14px;
75   height: 16px;
76   display: block;
77   position: absolute;
78   left: 5px;
79   top: 5px;
80   padding: 2px;
81   width: 110px;
82   background-color: #fff;
83   z-index: 100;
84 }
85
86 #small-title img {
87   position: absolute;
88 }
89
90 #small-title h1 {
91   position: absolute;
92   font-size: 12px;
93   line-height: 18px;
94   margin: 0;
95   left: 22px;
96 }
97
98 /* Rules for greeting bar in the top right corner */
99
100 #greeting {
101   position: absolute;
102   right: 0;
103   top: 0;
104   background: none;
105 }
106
107 #browse_map ul.secondary-actions {
108   float: right;
109 }
110
111 #map {
112   border: 0;
113 }
114
115 .content_map {
116   width: 100%;
117   border: none;
118   float: none;
119   height: 200px;
120   max-height: none;
121   min-height: auto;
122 }
123
124 .content_map #small_map {
125   height: 300px;
126   border: 1px solid #ccc;
127 }
128
129 .leaflet-control-pan, .leaflet-control-zoomslider {
130   display: none;
131 }
132
133 .site-index .leaflet-top,
134 .site-export .leaflet-top {
135   top: 10px !important;
136 }
137
138 /* Rules for the main content area */
139
140 #content {
141   margin-left: 0px;
142   margin-right: 0px;
143   border-left: 0px;
144   border-right: 0px;
145 }
146
147 .site-export #content,
148 .site-edit #content,
149 .site-index #content {
150   margin-top: 21px;
151 }
152
153 /* Rules for search sidebar when shown */
154
155 #sidebar {
156   border: 0px;
157   margin: 0px;
158   width: 50%;
159   border-right: 1px solid #ccccdd;
160 }
161
162 .sidebar_title, #sidebar_content {
163   font-size: 10px !important;
164 }
165
166 p.search_results_entry {
167   padding: 2px 0px;
168 }
169
170 /* Rules for the signup form */
171
172 #signupForm input[type="text"], #signupForm input[type="password"] {
173   width: 100%;
174 }
175
176 #signupForm input#user_email {
177   max-width: 30em;
178 }
179
180 #signupForm input#user_email_confirmation {
181   max-width: 30em;
182 }
183
184 #signupForm input#user_display_name {
185   max-width: 20em;
186 }
187
188 #signupForm input#user_pass_crypt {
189   max-width: 20em;
190 }
191
192 #signupForm input#user_pass_crypt_confirmation {
193   max-width: 20em;
194 }
195
196 /* Rules for the login form */
197
198 #login_login input#user_email {
199   width: 100%;
200   max-width: 18em;
201 }
202
203 #login_login input#user_password {
204   width: 100%;
205   max-width: 18em;
206 }
207
208 #login_login input#openid_url {
209   width: 100%;
210   max-width: 18em;
211 }
212
213 #login_openid_buttons td {
214   padding: 2px;
215 }
216
217 /* Rules for the user view */
218
219 .user_map {
220   width: 100% !important;
221   height: 300px !important;
222 }
223
224 #userinformation .deemphasize {
225   position: relative;
226   right: auto; left: auto;
227   margin-top: 10px;
228   top: auto;
229 }
230
231 /* Rules for the user settings page */
232
233 #user_new_email {
234   width: 60% !important;
235 }
236
237 #user_description, #user_preferred_editor {
238   width: 90% !important;
239 }
240
241 .minorNote {
242   display: block;
243 }
244
245 /* Rules for the browse pages */
246
247 .browse-section.common div{
248   clear: both;
249 }
250
251 #changeset_list_map {
252   position: relative;
253   width: 100%;
254   right: 0;
255   left: 0;
256   top: 0px;
257   margin-bottom: 20px;
258   float: none;
259   height: 300px !important;
260   max-height: auto;
261   min-height: auto;
262 }
263
264 /* Rules for the diary entries pages */
265
266 #diary_entry_title, #diary_entry_body, #diary_entry_language_code, #diary_comment_body {
267   width: 100% !important;
268 }
269
270 #usemap {
271   display: block;
272 }
273
274 /* Rules for the messaging pages */
275
276 #message_title, #message_body {
277   width: 100% !important;
278 }