]> git.openstreetmap.org Git - rails.git/blob - app/assets/stylesheets/common.css.scss
Update to CPK 5.0.10 and remove monkey patch
[rails.git] / app / assets / stylesheets / common.css.scss
1 /* Styles common to large and small screens */
2
3 /* Default rules for the body of every page */
4
5 body {
6   font-family: 'Helvetica Neue',Arial,sans-serif;
7   font-size: 14px;
8   line-height: 20px;
9   color: #222;
10   background-color: #fff;
11   margin: 0px;
12   padding: 0px;
13   text-align: left;
14 }
15
16 body.slim {
17   background-color: #f0f0f0;
18 }
19
20 /* Rules for links */
21
22 a {
23   color: #00f;
24   text-decoration: none;
25 }
26
27 a:hover {
28   text-decoration: underline;
29 }
30
31 /* Rules for horizontal lines */
32
33 hr {
34   border: none;
35   background-color: #ccc;
36   color: #ccc;
37   height: 1px;
38 }
39
40 /* Default rules for headings */
41
42 h2 {
43   margin: 5px 0;
44   font-size: 25px;
45   line-height: 30px;
46 }
47
48 /* Rules for the whole left sidebar, including the logo */
49
50 #left {
51   position: absolute;
52   top: 30px;
53   bottom: 0;
54   width: 185px;
55   font-size: 11px;
56   line-height: 12px;
57   border-right: 1px solid #ccc;
58 }
59
60 /* Rules for the OpenStreetMap logo in the top left corner */
61
62 #logo {
63   display: block;
64   width: 170px;
65   min-width: 170px;
66   padding: 5px;
67   text-align: center;
68   margin: auto;
69 }
70
71 #logo img {
72   border: 0px;
73 }
74
75 #logo h1 {
76   font-size: 18px;
77   line-height: 20px;
78   text-align: center;
79   margin: 0px;
80 }
81
82 #logo h2 {
83   font-size: 10px;
84   line-height: 15px;
85   margin: 0px;
86 }
87
88 /* Rules for the site name */
89
90 #small-title {
91   display: none;
92 }
93
94 #small-title img {
95   border: 0px;
96 }
97
98 /* Rules for the introductory text displayed in the left sidebar to new users */
99
100 .sidebar-copy {
101   padding: 5px 10px;
102 }
103
104 .sidebar-copy p {
105   margin: 5px 0;
106 }
107
108 .sidebar-copy.intro {
109   margin-top: -1px;
110   border-top: 1px solid #ccc;
111 }
112
113 /*
114  * Rules for alert boxes shown in the left sidebar when important
115  * information needs to be conveyed such as when the site is
116  * undergoing maintenance.
117  */
118
119 .sidebar-alert {
120   padding: 4px 5px 4px 5px;
121   border-top: 1px solid #ccc;
122   margin-top: 4px;
123   margin-bottom: -4px;
124   background: #e00;
125   font-size: 13px;
126   font-weight: bold;
127   line-height: 17px;
128
129   p {
130     margin: 5px;
131   }
132 }
133
134 /*
135  * Rules for notice boxes shown in the left sidebar when important, but
136  * non-critical information needs to be conveyed such as notices about
137  * donation drives.
138  */
139
140 .sidebar-notice {
141   padding: 4px 5px 4px 5px;
142   border-top: 1px solid #ccc;
143   margin-top: 4px;
144   margin-bottom: -4px;
145   background: #ea0;
146   font-size: 13px;
147   line-height: 17px;
148
149   p {
150     margin: 5px;
151   }
152 }
153
154 /* Rules for the menu displayed in the left sidebar */
155
156 .left_menu {
157   left: 0px;
158   margin: 0;
159   padding: 5px 10px;
160   line-height: 15px;
161   font-size: 12px;
162   list-style-type: none;
163   border-bottom: 1px solid #ccc;
164   border-top: 1px solid #ccc;
165 }
166
167 .left_menu ul {
168   padding: 0;
169   margin: 0;
170 }
171
172 .left_menu li {
173   list-style-type: none;
174   padding: 0;
175   margin: 0;
176 }
177
178 .left_menu h4 {
179   padding: 5px 0 5px 0;
180   font-size: 12px;
181   margin: 0;
182 }
183
184 .left_menu li:last-child h4 {
185   padding-top: 0;
186 }
187
188 /* Rules for SOTM advert */
189
190 #sotm {
191   width: 165px;
192   margin: 10px;
193   padding: 0px;
194   border: 0px;
195   background: #fff;
196 }
197
198 #sotm img {
199   width: 165px;
200 }
201
202 /*
203  * Rules for "optional boxes" which appear in the left sidebar on
204  * certain pages. Current users are the seach box on the main page
205  * and the tag cloud on the traces pages.
206  */
207
208 .optionalbox {
209   left: 0px;
210   padding: 5px 10px;
211   margin: 5px 0;
212   text-align: left;
213 }
214
215 .optionalbox h1 {
216   font-size: 14px;
217   font-weight: bold;
218   line-height: 20px;
219   margin: 0px;
220   vertical-align: bottom;
221 }
222
223 /* Rules for the search box */
224
225 .whereami {
226 }
227
228 #search_field form {
229   width: 165px;
230   margin: 0px;
231   padding: 0px;
232 }
233
234 #search_field {
235   position: relative;
236 }
237
238 #search_field input[type="text"] {
239   width: 165px;
240   font-size: 14px;
241   line-height: 15px;
242   height: 25px;
243   padding: 2px 0px 2px 5px;
244   box-shadow: inset #DDD 0px 1px 3px;
245   box-sizing: border-box;
246   -webkit-box-sizing: border-box;
247   -moz-box-sizing: border-box;
248   -ms-box-sizing: border-box;
249 }
250
251 #search_field input[type="text"]:focus {
252   outline: none;
253   border: 1px solid #000;
254 }
255
256 #search_field input[type="submit"] {
257   width: 15px;
258   height: 15px;
259   border: 0px;
260   text-indent: -1000px;
261   overflow: hidden;
262   text-transform: capitalize;
263   padding-left: 0px;
264   padding-right: 0px;
265   background: image-url("sprite.png");
266   position: absolute;
267   top: 5px;
268   right: 4px;
269   cursor: pointer;
270 }
271
272 .search_help {
273   margin: 5px 0 0 0;
274 }
275
276 .deemphasize {
277   color: #999;
278 }
279
280 .deemphasize a {
281   color: #7092FF;
282 }
283
284 /* Rules for donation request box */
285
286 .donate {
287   display: block;
288   position: relative;
289   width: 153px;
290   margin: 10px 10px 0px 10px;
291   padding: 5px;
292   border: 1px solid #AED1A0;
293   background: #cbeea7;
294   line-height: 20px;
295   text-align: center;
296   font-size: 14px;
297   border-radius: 2px;
298   -moz-border-radius: 2px;
299   color: #222;
300 }
301
302 .donate:hover {
303   background: #9ed485;
304   text-decoration: none;
305 }
306
307 .donate p {
308   text-indent: 20px;
309   margin: 0;
310 }
311
312 .donate .donate-icon {
313   width: 15px;
314   height: 15px;
315   border: 0px;
316   padding-left: 0px;
317   padding-right: 0px;
318   background: image-url("sprite.png") 0 -30px no-repeat;
319   position: absolute;
320   top: 8px;
321   left: 17px;
322 }
323
324 /* Rules for Creative Commons logo button */
325
326 #cclogo {
327   margin-top: 10px;
328   margin-bottom: 10px;
329 }
330
331 /* Rules for tabbed navigation bar */
332
333 #top-bar {
334   position: absolute;
335   top: 0;
336   left: 185px;
337   right: 0;
338   height: 29px;
339   border-bottom: 1px solid #ccc;
340   background: white;
341 }
342
343 #tabnav {
344   padding: 0;
345   margin: 0;
346   overflow:hidden;
347 }
348
349 #tabnav li {
350   margin: 0px;
351   padding: 0px;
352   display: inline;
353   list-style-type: none;
354 }
355
356 #tabnav a, #tabnav a:link, #tabnav a:visited {
357   float: left;
358   background: #fff;
359   font-size: 14px;
360   line-height: 19px;
361   font-weight: bold;
362   padding: 5px 10px;
363   margin-right: 1px;
364   text-decoration: none;
365   color: #333;
366   -webkit-transition: color 200ms ease-in;
367   -moz-transition: color 200ms ease-in;
368   -o-transition: color 200ms ease-in;
369   transition: color 200ms ease-in;
370 }
371
372 body.site-index #tabnav a#viewanchor,
373 body.site-edit #tabnav a#editanchor,
374 body.changeset-list #tabnav a#historyanchor,
375 body.site-export #tabnav a#exportanchor {
376   border-bottom: 1px solid #aaa;
377   background: #9ed485;
378   color: #000;
379 }
380
381 #tabnav a:link:hover, #tabnav a:visited:hover {
382   text-decoration:underline;
383 }
384
385 #tabnav a:link.disabled,
386 #tabnav a:visited.disabled,
387 #tabnav a:link:hover.disabled,
388 #tabnav a:visited:hover.disabled {
389   color: #ccc;
390   cursor: default;
391 }
392
393 #tabnav a:link.disabled:hover,
394 #tabnav a:visited.disabled:hover,
395 #tabnav a:link:hover.disabled:hover,
396 #tabnav a:visited:hover.disabled:hover {
397   text-decoration: none;
398 }
399
400 .count-number {
401   padding: 2px 5px;
402   border-radius: 3px;
403   background: #eee;
404   margin: 0 2px;
405   font-size: 11px;
406   color: #333;
407 }
408
409 /* Rules for greeting bar in the top right corner */
410
411 #greeting {
412   float: right;
413   height: 28px;
414   margin: 0px;
415   padding-right: 10px;
416   font-size: 13px;
417   line-height: 28px;
418 }
419
420 .greeting-bar-unread {
421   font-weight: bold;
422 }
423
424 /* Rules for the message shown in place of the map when javascript is disabled */
425
426 #noscript {
427   z-index: 20000000;
428   position: absolute;
429   top: 15px;
430   left: 15px;
431 }
432
433 /* Rules for OpenLayers maps */
434
435 #map {
436   margin: 0px;
437   border: 0px;
438   padding: 0px;
439 }
440
441 .olControlAttribution {
442   bottom: 15px !important;
443   left: 0px !important;
444   right: 0px !important;
445   text-align: center;
446 }
447
448 #permalink {
449   z-index: 10000;
450   position: absolute;
451   bottom: 0px;
452   right: 0px;
453   padding: 5px;
454   background:#fff;
455   text-align: right;
456   font-size: 12px;
457 }
458
459 #permalink a {
460   padding: 5px;
461 }
462
463 .site-index #map .SimpleLayerSwitcher,
464 .site-index #map .olControlSimplePanZoom,
465 .site-export #map .SimpleLayerSwitcher,
466 .site-export #map .olControlSimplePanZoom {
467   top: 40px !important;
468 }
469
470 .site-index #map .olControlScaleLine,
471 .site-export #map .olControlScaleLine {
472   left: 10px !important;
473 }
474
475 /* Rules for edit menu */
476
477 .menuicon {
478   padding: 5px;
479
480   &:hover {
481     background: #eee;
482     text-decoration: none !important;
483   }
484 }
485
486 .menu {
487   display: none;
488   z-index: 10000;
489   position: absolute;
490   background-color: #ffffff;
491   border: 1px solid #cccccc;
492   border-top: 0px;
493 }
494
495 .menu ul {
496   margin: 0px;
497   padding: 0px;
498 }
499
500 .menu li {
501   padding: 2px 5px;
502   margin: 0px;
503   list-style-type: none;
504   border-top: 1px solid #eee;
505   white-space: nowrap;
506 }
507
508 /* Rules for attribution text under the main map shown on printouts */
509
510 #attribution {
511   display: none;
512 }
513
514 .attribution_license {
515   text-align: left;
516 }
517
518 .attribution_notice {
519   text-align: center;
520 }
521
522 .attribution_project {
523   text-align: right;
524 }
525
526 /* Rules for the popout map sidebar */
527
528 #sidebar {
529   display: none;
530   position: absolute;
531   margin: 30px 0px 0px 0px;
532   padding: 0px;
533   border-right: 1px solid #ccc;
534   width: 30%;
535   top: 0px;
536   bottom: 0px;
537   left: 0px;
538 }
539
540 #sidebar #sidebar_content {
541   overflow: auto;
542   position: absolute;
543   font-size: 13px;
544   line-height: 15px;
545   top: 29px;
546   bottom: 0px;
547   left: 0px;
548   right: 0px;
549 }
550
551 #sidebar .sidebar_title {
552   margin: 0px;
553   padding: 3px 6px 4px 6px;
554   height: 29px;
555   font-size: 14px;
556   line-height: 15px;
557   background: #ccc;
558 }
559
560 #sidebar #sidebar_title {
561   text-align: left;
562 }
563
564 #sidebar #sidebar_close {
565   text-align: right;
566 }
567
568 /* Rules for the map key which appears in the popout sidebar */
569
570 #mapkey h3 {
571   font-size: 110%;
572   font-weight: normal;
573   text-align: center;
574 }
575
576 #mapkey .mapkey-table {
577   padding-left: 5px;
578   padding-right: 5px;
579 }
580
581 #mapkey .mapkey-table-key img {
582   display: block;
583   margin-left: auto;
584   margin-right: auto;
585 }
586
587 #mapkey .mapkey-table-value {
588   font-size: 90%;
589 }
590
591 /* Rules for search results which appear in the popout sidebar */
592
593 .search_searching {
594   margin-top: 5px;
595   margin-bottom: 5px;
596 }
597
598 .search_results_heading {
599   margin: 0px;
600   padding: 2px 5px;
601   border-bottom: 1px solid #ccc;
602   font-weight: bold;
603 }
604
605 .search_results_entry {
606   margin: 0px;
607   padding: 2px 5px;
608 }
609
610 .search_results_error {
611   margin: 0px;
612   padding: 2px 6px 0px;
613   color: #f00;
614 }
615
616 /* Rules for data browser information which appears in the popout sidebar */
617
618 .browse_heading {
619   margin: 0px;
620   padding: 3px 6px;
621   border: 1px solid #ccc;
622   background: #ddd;
623 }
624
625 .browse_details {
626   margin: 0px;
627   padding: 0px 6px;
628 }
629
630 /* Rules for export information which appears in the popout sidebar */
631
632 .export_heading {
633   margin: 0px;
634   padding: 2px 5px;
635   border-bottom: 1px solid #ccc;
636   font-weight: bold;
637 }
638
639 .export_bounds {
640   width: 100%;
641   text-align: center;
642 }
643
644 .export_bound {
645   margin: 5px;
646 }
647
648 .export_details {
649   padding: 2px 6px;
650 }
651
652 #export_osm {
653   display: none;
654 }
655
656 #export_mapnik {
657   display: none;
658 }
659
660 #export_osmarender {
661   display: none;
662 }
663
664 .export_hint {
665   padding: 0px 12px;
666   font-style: italic;
667 }
668
669 .export_buttons {
670   width: 100%;
671   text-align: center;
672 }
673
674 /* Rules for the main content area */
675
676 #content {
677   padding: 20px;
678   margin: 30px 0px 0px 185px;
679   border-left: 1px solid #ccc;
680   text-align: left;
681 }
682
683 .site-edit #content,
684 .site-index #content,
685 .site-export #content {
686   position: fixed;
687   margin-top: 0px;
688   left: 0px;
689   right: 0px;
690   top: 0px;
691   bottom: 0px;
692   padding: 0px;
693 }
694
695 .site-edit #content {
696   top: 30px;
697 }
698
699 #slim_container {
700   width: 100%;
701 }
702
703 #slim_container_content {
704   max-width: 50em;
705   background-color: #FFFFFF;
706   margin: 10px auto;
707   padding: 3px;
708   border-radius: 25px;
709   -moz-border-radius: 25px;
710   border: 1px solid #e6e6e6;
711 }
712
713 #slim_content {
714   margin: 10px;
715   margin-top: 90px;
716   max-width: 50em;
717 }
718
719 #slim_header {
720   margin: 10px;
721   position: absolute;
722   top: 0px;
723 }
724
725 #slim_header img {
726   vertical-align: middle;
727   margin-bottom: 5px;
728   margin-right: 5px;
729 }
730
731 /* Rules for text content pages */
732
733 .wide-table {
734   width: 100%;
735 }
736
737 /* Rules for the home page */
738
739 .site-index #map {
740   position: absolute;
741   top: 0px;
742   bottom: 0px;
743   left: 0px;
744   right: 0px;
745 }
746
747 .site-export #map {
748   position: absolute;
749   top: 0px;
750   bottom: 0px;
751   left: 0px;
752   right: 0px;
753 }
754
755 /* Rules for the edit page */
756
757 .site-edit #map {
758   position: absolute;
759   top: 0px;
760   bottom: 0px;
761   left: 0px;
762   right: 0px;
763   overflow: hidden;
764 }
765
766 /* Rules for the changeset list shown by the history tab etc */
767
768 #changeset_list_container {
769   position: relative;
770 }
771
772 #changeset_list {
773   width: 50%;
774   font-size: small;
775   border-collapse: collapse;
776   border-width: 0px;
777   margin-top: 1px;
778   margin-bottom: 1px;
779   text-align: left;
780 }
781
782 #changeset_list td {
783   vertical-align: top;
784   padding: 3px;
785 }
786
787 #changeset_list .date {
788   white-space: nowrap;
789 }
790
791 #changeset_list .user {
792   white-space: nowrap;
793 }
794
795 #changeset_list .area {
796   white-space: nowrap;
797 }
798
799 #changeset_list .selected {
800   background-color: rgb(255, 255, 160);
801   background-color: rgba(255, 255, 85, 0.5);
802 }
803
804 #changeset_list_map {
805   position: absolute;
806   float: right;
807   top: 0px;
808   bottom: 0px;
809   right: 0px;
810   width: 49%;
811   min-height: 400px;
812   border: solid 1px black;
813 }
814
815 /* Rules for the data browser */
816
817 #browse_navigation {
818   float: right;
819   width: 250px;
820   margin-left: 10px;
821   text-align: center;
822 }
823
824 table.browse_details th {
825   white-space: nowrap;
826 }
827
828 #browse_map {
829   float: right;
830   width: 250px;
831   text-align: right;
832   margin-left: 10px;
833 }
834
835 #browse_map #small_map {
836   width: 250px;
837   height: 300px;
838   border: solid 1px black;
839 }
840
841 #browse_map .geolink {
842   display: none;
843 }
844
845 /* Rules for the trace list shown by the traces tab etc */
846
847 #trace_list {
848   font-size: small;
849   border-collapse: collapse;
850   border-width: 0px;
851   text-align: right;
852 }
853
854 #trace_list .trace_summary {
855   font-size: 12px;
856   color: gray;
857 }
858
859 #trace_list .trace_pending {
860   color: red;
861 }
862
863 #trace_list .trace_public {
864   color: green;
865 }
866
867 #trace_list .trace_identifiable {
868   color: green;
869 }
870
871 #trace_list .trace_trackable {
872   color: red;
873 }
874
875 #trace_list .trace_private {
876   color: red;
877 }
878
879 /* Rules for the user list */
880
881 #user_list {
882   width: 100%;
883   font-size: small;
884 }
885
886 #user_list tr {
887   vertical-align: middle;
888 }
889
890 #user_list p {
891   margin-top: 0px;
892   margin-bottom: 0px;
893 }
894
895 #user_list_actions {
896   float: right;
897   margin-top: 10px;
898 }
899
900 /* Rules for the diary list */
901
902 .diary_entry-list img.user_image {
903   float: right;
904 }
905
906 .diary_entry-list img.user_thumbnail {
907   float: right;
908 }
909
910 /* Rules for the diary entry view */
911
912 .diary_entry-view img.user_image {
913   float: right;
914 }
915
916 .diary_entry-view img.user_thumbnail {
917   float: right;
918 }
919
920 /* Rules for the new diary entry page */
921
922 .diary_entry div#map {
923   position: relative;
924   width: 90%;
925   height: 400px;
926   border: 1px solid #ccc;
927   display: none;
928 }
929
930 /* Rules for the login page */
931
932 #login_wrapper div {
933   margin: 5px;
934   padding: 15px;
935   border-radius: 15px;
936   -moz-border-radius: 15px;
937 }
938
939 #login_login {
940   background-color: #f5f5ff;
941   border: 1px solid #f3f3ff;
942   border-radius: 15px;
943   -moz-border-radius: 15px;
944 }
945
946 #login_login h1 {
947   margin-top: 5px;
948 }
949
950 table#login_openid_buttons {
951   padding-bottom: 10px;
952 }
953
954 #login_openid_buttons td {
955   padding-left: 10px;
956   padding-right: 10px;
957   padding-top: 5px;
958   padding-bottom: 5px;
959 }
960
961 #login_openid_buttons img {
962   border: 0;
963 }
964
965 #login_signup form.button-to div {
966   margin: 0px;
967   padding: 0px;
968 }
969
970 /* Rules for the account confirmation page */
971
972 div#contributorTerms {
973   border: 1px solid black;
974   padding: 4px;
975   overflow: auto;
976   width: 95%;
977   height: 400px;
978 }
979
980 div#slim_content div#contributorTerms {
981   width: auto;
982 }
983
984 div#contributorTerms p#first {
985   margin-top: 0px;
986 }
987
988 div#contributorTerms p#last {
989   margin-bottom: 0px;
990 }
991
992 div#contributorTerms ol {
993   margin-bottom: 0px;
994 }
995
996 div#contributorTerms img {
997   display: block;
998   margin-left: auto;
999   margin-right: auto;
1000   margin-top: 10%;
1001 }
1002
1003 form#termsForm {
1004   width: 95%;
1005   margin-bottom: 3em;
1006 }
1007
1008 form#termsForm div#buttons {
1009   float: right;
1010 }
1011
1012 form#termsForm input#agree {
1013   margin-left: 50px;
1014 }
1015
1016 div#slim_content form#termsForm {
1017   width: auto;
1018 }
1019
1020 p#contributorGuidance {
1021   background-color: #f5f5ff;
1022   border: 1px solid #f3f3ff;
1023   border-radius: 15px;
1024   -moz-border-radius: 15px;
1025   padding: 10px;
1026 }
1027
1028 /* Rules for the account settings page */
1029
1030 #accountForm {
1031   margin-top: 20px;
1032 }
1033
1034 #accountForm td {
1035   padding-bottom: 10px;
1036 }
1037
1038 #accountForm .user_map {
1039   position: relative;
1040   width: 500px;
1041   height: 400px;
1042   border: 1px solid #ccc;
1043 }
1044
1045 #accountForm td.accountImage {
1046   img {
1047     vertical-align: top;
1048     margin-top: 3px;
1049   }
1050
1051   table {
1052     display: inline-block;
1053
1054     td {
1055       padding-bottom: 0px;
1056     }
1057   }
1058 }
1059
1060 .nohome .location {
1061   display: none;
1062 }
1063
1064 #homerow .message {
1065   display: none;
1066 }
1067
1068 .nohome .message {
1069   display: inline !important;
1070 }
1071
1072 #accountForm input[type=submit] {
1073   margin-top: 15px;
1074 }
1075
1076 /* Rules for the user view */
1077
1078 .user-view img.user_image {
1079   float: right;
1080 }
1081
1082 .user-view .user_map {
1083   float: right;
1084   position: relative;
1085   width: 400px;
1086   height: 400px;
1087   border: 1px solid #ccc;
1088 }
1089
1090 .user-view .user_map p#no_home_location {
1091   position: absolute;
1092   top: 0px;
1093   bottom: 0px;
1094   width: 90%;
1095   height: 30%;
1096   margin: auto 5%
1097 }
1098
1099 /* Rules for the user map */
1100
1101 .user_map .olControlSimplePanZoom {
1102   display: none;
1103 }
1104
1105 .user_map .olControlZoom {
1106   display: block;
1107 }
1108
1109 /* Rules for user popups on maps */
1110
1111 .user_popup p {
1112   padding-top: 3px;
1113   padding-bottom: 3px;
1114   margin-top: 0px;
1115   margin-bottom: 0px;
1116   margin-left: 55px;
1117   margin-right: 2px;
1118 }
1119
1120 .user_popup img.user_thumbnail {
1121   float: left;
1122 }
1123
1124 /* Rules for message in/out box page */
1125
1126 .messages {
1127   width: 100%;
1128   border-collapse: collapse;
1129   border-spacing: 0px;
1130   border-width: 0px;
1131 }
1132
1133 .messages tbody tr {
1134   border-top: 1px solid #ccc;
1135 }
1136
1137 .messages .inbox-row {
1138   background: #eee;
1139 }
1140
1141 .messages tr td,
1142 .messages tr th {
1143   padding: 0px 5px;
1144 }
1145
1146 .inbox-row .inbox-mark-read {
1147   display: none;
1148 }
1149
1150 .info-line {
1151   border-bottom: 1px solid #ccc;
1152   padding: 5px 0px 4px 0px;
1153 }
1154
1155 .info-line form,
1156 .info-line form div {
1157   display: inline;
1158 }
1159
1160 .info-line .user_thumbnail_tiny {
1161   vertical-align: middle;
1162 }
1163
1164 .right {
1165   float: right;
1166 }
1167
1168 .inbox-row-unread .inbox-mark-unread {
1169   display: none;
1170 }
1171
1172 /* Rules for "flash" notice boxes shown at the top of the content area */
1173
1174 #error {
1175   border: 1px solid red;
1176   padding: 7px;
1177   background-color: #fff0f0;
1178   margin-bottom: 20px;
1179   border-radius: 5px;
1180   -moz-border-radius: 5px;
1181 }
1182
1183 #warning {
1184   border: 1px solid orange;
1185   padding: 7px;
1186   background-color: #fff6f0;
1187   margin-bottom: 20px;
1188   border-radius: 5px;
1189   -moz-border-radius: 5px;
1190 }
1191
1192 #notice {
1193   border: 1px solid green;
1194   padding: 7px;
1195   background-color: #f0fff0;
1196   margin-bottom: 20px;
1197   border-radius: 5px;
1198   -moz-border-radius: 5px;
1199 }
1200
1201 /* Rules for highlighting fields with rails validation errors */
1202
1203 .field_with_errors {
1204   padding: 2px;
1205   background-color: red;
1206   display: table;
1207 }
1208
1209 /* Rules for rails validation error boxes */
1210
1211 #errorExplanation {
1212   width: 400px;
1213   border: 2px solid red;
1214   padding: 7px;
1215   padding-bottom: 12px;
1216   margin-bottom: 20px;
1217   background-color: #f0f0f0;
1218 }
1219
1220 #errorExplanation h2 {
1221   font-weight: bold;
1222   font-size: 12px;
1223   padding: 5px 5px 5px 15px;
1224   margin: -7px;
1225   background-color: #c00;
1226   color: #fff;
1227   text-align: left;
1228 }
1229
1230 #errorExplanation p {
1231   color: #333;
1232   margin-bottom: 0px;
1233   padding: 5px;
1234 }
1235
1236 #errorExplanation ul li {
1237   font-size: 12px;
1238   list-style: square;
1239 }
1240
1241 /* Rules for forms */
1242
1243 .fieldName {
1244   vertical-align: top;
1245   font-weight: bold;
1246   font-size: 12px;
1247   line-height: 20px;
1248   text-align: right;
1249 }
1250
1251 .submitButton {
1252   text-align: right;
1253 }
1254
1255 .minorNote {
1256   font-size: 0.8em;
1257 }
1258
1259 input[type="text"],
1260 input[type="email"],
1261 input[type="url"],
1262 input[type="password"],
1263 textarea {
1264   border: 1px solid #ccc;
1265 }
1266
1267 input.openid_url {
1268   background: image-url('openid_input.png') repeat-y left white;
1269   padding-left: 16px;
1270 }
1271
1272 /* Rules for user images */
1273
1274 img.user_image {
1275   max-width: 100px;
1276   max-height: 100px;
1277   border: 1px solid #ccc;
1278 }
1279
1280 img.user_thumbnail {
1281   max-width: 50px;
1282   max-height: 100px;
1283   border: 1px solid #ccc;
1284 }
1285
1286 img.user_thumbnail_tiny {
1287   max-width: 25px;
1288   max-height: 25px;
1289   border: 1px solid #ccc;
1290 }
1291
1292 /* Rule for "nowrap" class that can be applied to anything to stop wrapping */
1293
1294 .nowrap {
1295   white-space: nowrap;
1296 }
1297
1298 /* Rules for geo microformats */
1299
1300 abbr.geo {
1301   border-bottom: none;
1302 }
1303
1304 /* Rules for RSS buttons */
1305
1306 .rsssmall {
1307   position: relative;
1308   top: 4px;
1309 }
1310
1311 /* Rules for doing distinct colour of alternate table rows */
1312
1313 .table0 {
1314   background: #f6f6f6;
1315 }
1316
1317 .table1 {
1318   background: #fff;
1319 }
1320
1321 /* Rules for OpenID logo */
1322
1323 .openid_logo {
1324   vertical-align: text-bottom;
1325   border: 0;
1326 }
1327
1328 /* Rules for rich text editors */
1329
1330 .richtext_container {
1331   white-space: nowrap;
1332
1333   .richtext_content {
1334     display: inline-block;
1335     vertical-align: top;
1336
1337     .richtext_preview {
1338       display: inline-block;
1339       margin-top: 1px;
1340       margin-bottom: 1px;
1341       border: 4px solid #eee;
1342       background-color: #eee;
1343       white-space: normal;
1344
1345       &.loading {
1346         background-image: image-url("loading.gif");
1347         background-repeat: no-repeat;
1348         background-position: center;
1349       }
1350
1351       > :first-child {
1352         margin-top: 0px;
1353       }
1354     }
1355   }
1356
1357   .richtext_help {
1358     display: inline-block;
1359     vertical-align: top;
1360     background-color: #ddd;
1361     margin-left: 15px;
1362     padding: 5px 10px 10px 10px;
1363     font-size: 12px;
1364
1365     p {
1366       margin: 0px;
1367     }
1368
1369     th {
1370       vertical-align: top;
1371       text-align: left;
1372       padding: 0px 15px 0px 0px !important;
1373     }
1374
1375     td {
1376       text-align: left;
1377       font-family: fixed;
1378       line-height: 16px;
1379       padding: 0px !important;
1380     }
1381
1382     input.richtext_doedit {
1383       margin-top: 5px !important;
1384       margin-right: 10px !important;
1385     }
1386
1387     input.richtext_dopreview {
1388       margin-top: 5px !important;
1389       margin-left: 10px !important;
1390     }
1391   }
1392 }