Some layout fixes
[moodle.git] / theme / standard / styles_layout.css
CommitLineData
7005a81c 1/*************************************************
2***
3*** layout
4***
5**************************************************/
a8e1f343 6
992b5971 7/*************************************************
8***
9*** This CSS file contains all layout definitions
10*** like positioning, floats,
11*** margins, paddding,
12*** borders etc.
13***
14*** Shortindex:
15*** basic and general styles
16*** header and footer styles
17*** content styles (alphabetically)
7005a81c 18*** admin, course, activities, calendar, blocks
992b5971 19***
20*** Please sort new styles for existing content
21*** into the appropriate part of this CSS file.
22*** Styles for new Blocks or Activities please
23*** place at the end.
24*** Wouldn't the alphabetical order be better?
25***
26**************************************************/
a8e1f343 27
7005a81c 28
a8e1f343 29/* basic styles */
30.clearer {
31 clear:both;
32 margin:0px;
33 padding:0px;
34 height:1px;
35 border:none;
36 background:transparent;
37}
38
ac91569f 39.continuebutton {
40 text-align: center;
41}
42
a8e1f343 43
44/* general styles */
45th {
46 background-image:url(gradient.jpg);
47 background-position:top;
48 background-repeat:repeat-x;
49}
50
51form {
52 margin-bottom:0px;
53}
54
9cbf12c0 55table {
56 border-spacing: 0px;
57 border-collapse: collapse;
58}
a8e1f343 59
2ad2cbc3 60a img {
61 border:none;
62}
63
a8e1f343 64/* header styles */
65#header-home {
66 padding:1em 0.5em;
67 height:2em;
68}
69
70#header {
71 padding:0.1em 0.5em;
72}
73
74.headermain {
75 float:left;
76}
77
78#header .headermain {
79 margin:0.2em 0em;
80}
81
82.headermenu {
83 float:right;
056bb94e 84 text-align:right;
a8e1f343 85}
86
87#nav-bar {
88 padding:3px 0.5em;
89 height:1.3em;
90 background-image:url(gradient.jpg);
91 background-position:top;
92 background-repeat:repeat-x;
93}
94
95#breadcrumb {
96 float:left;
97 margin:0.2em 0em;
98}
99
100#navbutton {
101 float:right;
102}
103
e96ba29d 104#layout-table {
105 width:100%;
106 border-spacing:5px;
107 border-collapse:separate;
108}
109
110#layout-table #left-column,
111#layout-table #middle-column,
112#layout-table #right-column
113{
114 vertical-align:top;
115}
a8e1f343 116
117/* footer styles */
118
119
992b5971 120/*****************************
121***
122*** content styles
123***
124******************************/
a8e1f343 125/* many places */
992b5971 126.generalbox {
a8e1f343 127 border-width:1px;
128 border-style:solid;
129}
992b5971 130.noticebox {
a8e1f343 131 border-width:1px;
132 border-style:solid;
133}
81e6a0a5 134.errorbox {
135 border-width:1px;
136 border-style:solid;
137 margin: 1em 15%;
138 width: 70%;
139}
140.errorbox .title {
141 padding: 5px;
142}
2f71f2a2 143.informationbox {
144 border-width:1px;
145 border-style:solid;
146}
a59a00b7 147.feedbackbox {
148 border-width:1px;
149 border-style:solid;
150}
151.feedbackby {
152}
153.feedback {
154}
9d034c94 155.initialbar {
156 text-align: center;
157}
7005a81c 158
a8e1f343 159/* summary of a user in a nice little box - weblib.php */
160.userinfobox {
7005a81c 161 margin-bottom:5px;
a8e1f343 162 border-width:1px;
163 border-style:solid;
a8e1f343 164}
165
166.userinfoboxside,
167.userinfoboxsummary,
168.userinfoboxlinkcontent { }
169
7005a81c 170
992b5971 171/* weblib.php table */
172.tabledivider {
173 border-width:1px;
174 border-style:solid;
175 border-left:0px;
176 border-right:0px;
177 border-top:0px;
178}
179
7005a81c 180
992b5971 181/* entry-page index.php */
182.sitetopic {
183 border-width:1px;
184 border-style:solid;
185}
186
7005a81c 187
2f945146 188/* paging bar */
189.pagingbar {
190 text-align:center;
191}
192.pagingbar a {
193 padding-left: 10px;
194}
195.pagingbar .thispage {
196 padding-left: 10px;
197}
198
992b5971 199/*****************************
200***
7005a81c 201*** Admin
992b5971 202***
203******************************/
204/* admin, calendar */
b8a6c0da 205table.formtable {
b8a6c0da 206 margin: auto;
207}
208
209table.formtable tbody th {
210 background: none;
211 vertical-align: top;
a8e1f343 212}
213
05afaf25 214table.formtable tbody td,
215table.formtable tbody th
216{
217 padding: 5px;
218}
992b5971 219
7005a81c 220/*****************************
221***
222*** Course
223***
224******************************/
446390fb 225
226.section .activity img.activityicon {
227 vertical-align:middle;
228 height:16px;
a5afe3ec 229 width:16px;
446390fb 230}
231
232.section img.movetarget {
233 height:16px;
234 width:80px;
235}
236
992b5971 237/* course, entry-page, login */
238.headingblock {
239 background-image:url(gradient.jpg);
240 background-position:top;
241 background-repeat:repeat-x;
242 border-width:1px;
243 border-style:solid;
446390fb 244 padding:5px;
992b5971 245}
246
7005a81c 247
992b5971 248/* course */
a5afe3ec 249
250#course-view .section td {
a5afe3ec 251 vertical-align:top;
252}
253
254#course-view .section .content {
255 padding:5px;
256 border-style:solid;
992b5971 257 border-width:1px;
a8e1f343 258 border-left:0px;
259 border-right:0px;
992b5971 260}
261
a5afe3ec 262#course-view .section .side {
263 padding:5px;
264 border-style:solid;
992b5971 265 border-width:1px;
a5afe3ec 266}
267
268#course-view .section .left {
992b5971 269 border-right:0px;
d80a9029 270 text-align:center;
62c0f37e 271 font-weight:bold;
d80a9029 272 width: 1.5em;
992b5971 273}
274
a5afe3ec 275#course-view .section .right {
992b5971 276 border-left:0px;
d80a9029 277 text-align:center;
278 width: 1.5em;
992b5971 279}
280
476f1aec 281#course-view .current .side {
a5afe3ec 282}
283
284#course-view .topics {
285 margin-top: 9px;
286}
287
288#course-view .weeks {
289 margin-top: 9px;
290}
291
292#course-view .section .spacer {
293 height:0.5em;
294}
295
476f1aec 296#course-view .section .weekdates {
297}
a5afe3ec 298
299
992b5971 300.categoryboxcontent,
301.courseboxcontent {
302 border-width:1px;
303 border-style:solid;
a8e1f343 304}
305
7005a81c 306
25ecf09a 307/* user */
308.userinfobox {
309 border-width: 1px;
310 border-style: solid;
311 border-collapse: separate;
312}
313
314.userinfobox .left {
315 padding: 10px;
316 width: 100px;
317}
318
319.userinfobox .content {
320 padding: 10px;
321 vertical-align: top;
322}
323
324.userinfobox .links {
ebc4968b 325 width: 100px;
25ecf09a 326 padding: 5px;
327 vertical-align: bottom;
328}
329
330.userinfobox .username {
331 padding-bottom: 20px;
332}
333
334
335table.userinfobox {
336 width: 80%;
337 margin-left: 10%;
338 margin-right: 10%;
339}
340
341
342
7005a81c 343/*****************************
344***
345*** Activities
346***
347******************************/
348/* assignment, forum, glossary */
349.forumheaderlist,
350.forumpost {
351 border-width:1px;
352 border-style:solid;
233bc4bb 353 border-collapse:separate;
7005a81c 354}
355
4c7f1eb6 356.forumpost {
357 margin-top: 15px;
358}
359
360.forumpost .topic {
361 padding: 4px;
362}
363
364
365.forumpost .commands {
366 padding-top: 0.5em;
367 text-align:right;
368}
369
370.forumpost .ratings {
371 padding-top: 1em;
372 text-align:right;
373}
374
375.forumpost .content {
376 padding: 4px;
377}
378
3cc9a26c 379.forumpost .footer {
380 padding-top: 0.5em;
381 text-align:right;
382}
383
ec00f824 384.forumpost .link {
385 padding-top: 0.5em;
386 text-align:right;
387}
388
389
4c7f1eb6 390.forumpost .left {
25c0b58d 391 width: 35px;
4c7f1eb6 392 padding: 4px;
393 text-align: center;
394 vertical-align: top;
395}
396
7005a81c 397.forumpostindent {
398 margin-left: 30px;
399}
400
af328e4b 401body#user-view .forumpost,
402.course .forumpost {
ec00f824 403 width: 100%;
404}
405
b6b8055c 406body#mod-forum-search .c0 {
407 text-align: right;
408}
409
410body#mod-forum-search .introcontent {
411 padding: 15px;
412 font-weight:bold;
413}
414
3cc9a26c 415.forumolddiscuss {
416 text-align: right;
417}
418
233bc4bb 419.forumheaderlist {
420 width: 100%;
421}
422
423.forumheaderlist td {
424 border-width:1px 0px 0px 1px;
425 border-style:solid;
426}
427
428.forumheaderlist .replies {
429 text-align: center;
430}
431
432.forumheaderlist .picture {
433 width: 35px;
434}
435
436.forumheaderlist .discussion .starter {
62c0f37e 437 vertical-align: middle;
233bc4bb 438}
439
25ecf09a 440.forumheaderlist .discussion .lastpost {
441 white-space: nowrap;
442}
443
444.forumheaderlist .discussion .author {
445 white-space: nowrap;
446}
447
448.paging {
449 text-align: center;
450 margin: 10px 0px 10px 0px;
451}
233bc4bb 452
546739f6 453.unread {
454 padding-right:2px;
455}
456
7005a81c 457
458/* calendar, course, weblib,php, attandance
459dialouge, exercise, forum, lesson, quiz */
1ea6500d 460table.generaltable td.header,
461table.generaltable th.header,
7005a81c 462.generaltableheader {
463 background-image:url(gradient.jpg);
464 background-position:top;
465 background-repeat:repeat-x;
466}
467
468
992b5971 469/* glossary, wiki */
470.generaltab,
ebc4968b 471.generaltabselected,
472.generaltabinactive {
992b5971 473 background:none;
474}
475
1bc9b2ec 476.glossarypost .commands {
ebc4968b 477 width: 200px;
478 white-space: nowrap;
479}
480
5e497e4e 481.entryboxheader {
ebc4968b 482 border-width: 1px 1px 0px 1px;
483 border-style: solid;
484}
485
5e497e4e 486.entrybox {
ebc4968b 487 border-width: 0px 1px 1px 1px;
488 border-style: solid;
489}
490
5e497e4e 491.glossarypost {
492 width: 95%;
493 border-width:1px;
494 border-style:solid;
495 border-collapse:separate;
62c0f37e 496 margin-bottom: 5px;
f2c485e3 497 text-align: left;
498}
499
500
501.entrylist {
502 border-width:0px;
503}
504
505.entrylowersection {
506 padding-top: 10px;
507}
508.entrylowersection table{
509 width: 100%;
510}
511.entrylowersection .aliases {
512 text-align:center;
513 font-size: 0.8em;
514}
515.entrylowersection .icons,
516.entrylowersection .ratings {
517 text-align:right;
518 font-size: 0.8em;
5e497e4e 519}
520
521.glossarypost .entry {
522 padding: 3px;
523}
524
62c0f37e 525.glossarypost .picture {
526 width: 35px;
527}
7005a81c 528
36996192 529.glossarycomment {
530 border-width:1px;
531 border-style:solid;
532 border-collapse:separate;
533 margin-bottom: 5px;
534 text-align: left;
535}
536
537
538.glossarycomment .entry {
539 padding: 3px;
540}
541
542.glossarycomment .picture {
543 width: 35px;
544}
545
546.glossarycomment .icons {
547 text-align: right;
548}
549
f2c485e3 550
992b5971 551/* message */
552.message_link {
62c0f37e 553 vertical-align:middle;
992b5971 554}
555
556.message_search_results {
557 border-collapse:collapse;
558 border-spacing:0px;
559}
560
561table.message_search_results td {
562 padding:5px;
563 border-width:1px;
564 border-style:solid;
565}
566
7005a81c 567
992b5971 568/* quiz */
569.feedbacktext {
570 display:block;
571}
572
9d034c94 573body#mod-quiz-report table#attempts,
574body#mod-quiz-report table#commands
575{
576 width: 80%;
577 margin: auto;
578}
579body#mod-quiz-report table#attempts {
580 margin: 20px auto;
581}
582body#mod-quiz-report table#attempts .header,
583body#mod-quiz-report table#attempts .cell
584{
585 padding: 4px;
586}
587body#mod-quiz-report table#attempts .header .commands {
588 display: inline;
589}
590body#mod-quiz-report table#attempts .picture {
591 width: 40px;
592}
593body#mod-quiz-report table#attempts td {
594 border-left-width: 1px;
595 border-right-width: 1px;
596 border-left-style: solid;
597 border-right-style: solid;
598}
599
7005a81c 600
992b5971 601/*****************************
602***
603*** Calendar
604***
605******************************/
a8e1f343 606/* calendar */
a8e1f343 607
446390fb 608#calendar {
609 width: 100%;
610 border-spacing: 5px;
611 border-collapse: separate;
612}
613
614#calendar .maincalendar,
615#calendar .sidecalendar
616{
617 vertical-align: top;
618 border: 1px solid;
619}
620
621#calendar .sidecalendar {
622 width: 25%;
623}
624
625#calendar .maincalendar table.calendarmonth {
626 border-collapse: separate;
627 margin: 0px auto;
628 width: 98%;
629}
630
a0c7341a 631#calendar .maincalendar table.calendarmonth th {
446390fb 632 padding:10px;
633 border-bottom:2px solid;
634}
635
a0c7341a 636#calendar .maincalendar table.calendarmonth td {
446390fb 637 height: 5em;
638 padding-left: 4px;
639 padding-top: 4px;
640}
641
a0c7341a 642#calendar .maincalendar table.calendarmonth td,
643table.minicalendar td,
644table.minicalendar th {
446390fb 645 width:14%;
646 vertical-align:top;
647}
648
a0c7341a 649#calendar .maincalendar table.calendarmonth td table td {
446390fb 650 height: auto;
651}
652
653#calendar .maincalendar .heading,
654#calendar .sidecalendar .heading
655{
656 background-image:url(gradient.jpg);
657 background-position:top;
658 background-repeat:repeat-x;
659 padding: 5px;
660}
661
662#calendar .maincalendar .heading .buttons {
663 float: right;
664}
665
666#calendar .maincalendar .filters table,
667#calendar .sidecalendar .filters table,
668.sideblock.block_calendar_month .filters table
669{
670 border-collapse:separate;
671 border-spacing: 2px;
672 background-color: #EEEEEE;
673 padding: 2px;
674 width: 100%;
675}
676
677#calendar .maincalendar .filters {
678 padding: 0px 10px;
679}
680
681#calendar .sidecalendar .filters,
682.sideblock.block_calendar_month .filters
683{
684 padding: 5px;
685}
686
687#calendar .maincalendar .controls {
688 clear:both;
689 padding:10px;
690}
691
760e522b 692#calendar .maincalendar table.calendarmonth ul.events-new,
693#calendar .maincalendar table.calendarmonth ul.events-underway
694{
446390fb 695 padding:0px;
696 margin:0px;
697 list-style-type:none;
698}
699
760e522b 700#calendar .maincalendar table.calendarmonth ul li {
446390fb 701 margin-top: 4px;
702}
703
704table.minicalendar {
91417a70 705 width: 100%;
446390fb 706 margin:10px auto;
707 padding:2px;
708 border-width:1px;
709 border-style:solid;
710 border-collapse:separate;
711 border-spacing:1px !important;
712}
713
a0c7341a 714table.minicalendar th {
446390fb 715 padding: 0px 2px;
716}
717
718#calendar .maincalendar .eventlist {
719 padding: 10px;
720}
721
ed8ea92b 722#calendar .maincalendar .eventlist .event {
723 width:100%;
446390fb 724 margin-bottom:10px;
725 border-spacing:0px;
726 border-collapse:separate;
727 border-width:1px;
728 border-style:solid;
729}
730
ed8ea92b 731#calendar .maincalendar .eventlist .event .name {
732 float:left;
733}
734
735#calendar .maincalendar .eventlist .event .course {
736 float:left;
737 clear:left;
738}
739
740#calendar .maincalendar .eventlist .event .date {
741 float:right;
446390fb 742}
743
ed8ea92b 744#calendar .maincalendar .eventlist .event .description .commands {
745 width:100%;
746}
747
748#calendar .maincalendar .eventlist .event .description {
749 padding:5px;
750}
751
752#calendar .maincalendar .eventlist .event .picture {
446390fb 753 padding:8px;
754}
755
ed8ea92b 756#calendar .maincalendar .eventlist .event .side {
757 width:32px;
758}
759
446390fb 760#calendar #selecteventtype table {
761 margin:auto;
762}
763
e96ba29d 764#calendar .event_global,
765#calendar .event_course,
766#calendar .event_group,
767#calendar .event_user,
768.minicalendar .event_global,
769.minicalendar .event_course,
770.minicalendar .event_group,
771.minicalendar .event_user,
772.block_calendar_month .event_global,
773.block_calendar_month .event_course,
774.block_calendar_month .event_group,
775.block_calendar_month .event_user
776{
a8e1f343 777 border:2px solid !important;
778}
779
e96ba29d 780#calendar .duration_global,
781#calendar .duration_course,
782#calendar .duration_group,
783#calendar .duration_user,
784.minicalendar .duration_global,
785.minicalendar .duration_course,
786.minicalendar .duration_group,
787.minicalendar .duration_user
788{
a8e1f343 789 border-top:2px solid !important;
790 border-bottom:2px solid !important;
791}
792
e96ba29d 793#calendar .today,
794.minicalendar .today {
a8e1f343 795 border:2px solid !important;
796}
e96ba29d 797
a8e1f343 798.cal_popup_bg {
799 padding:0px;
800 margin:0px;
e96ba29d 801 border:1px solid;
a8e1f343 802}
803
804.cal_popup_close {
805 margin-right:5px;
806}
807
446390fb 808.cal_popup_caption {
809 background-image:url(gradient.jpg);
62c0f37e 810 border-width:0px 0px 1px 0px;
811 border-style:solid;
446390fb 812 padding-bottom:2px;
813}
814
1f473774 815table.calendar-controls {
816 width: 100%;
817}
818
819table.calendar-controls .previous,
820table.calendar-controls .next
821{
822 width: 12%;
823}
824
825#calendar .maincalendar .calendar-controls .previous,
826#calendar .maincalendar .calendar-controls .next
827{
828 width: 30%;
829}
830
992b5971 831/*****************************
832***
833*** Blocks
834***
835******************************/
e0840dee 836/* block_search_forums.php */
837
838.block_search_forums.sideblock .searchform {
839 text-align: center;
840}
841
842.block_search_forums.sideblock .searchform img {
843 vertical-align: center;
844}
845
a8e1f343 846/* block_rss_client.php */
847.rssclientlink {
848 padding-bottom:5px;
849 border-top:1px solid;
850}
851
852.rssclientdescription {
853 padding-left:10px;
854 padding-bottom:8px;
855}
856
7005a81c 857
992b5971 858/* sideblock */
859.sideblock {
860 width: 100%;
861 margin-bottom:1em;
9cbf12c0 862 border-collapse:separate;
a8e1f343 863 border-width:1px;
864 border-style:solid;
865}
7005a81c 866
78857721 867.sideblock .heading {
a8e1f343 868 background-image:url(gradient.jpg);
869 background-position:top;
870 background-repeat:repeat-x;
9cbf12c0 871 padding:4px;
a8e1f343 872}
873
78857721 874.sideblock .heading .hide-show {
c24a1ccd 875 float:right;
876}
877
78857721 878.sideblock .heading .hide-show img.hide-show-image {
36b51cb5 879 height:11px;
880 width:11px;
2ad2cbc3 881 margin-top:0.25em;
c24a1ccd 882}
883
78857721 884.sideblock .heading .commands {
96803c88 885 float: right;
886 margin-top: 0.3em;
887}
888
5a46b156 889.sideblock .heading .title {
890 float: left;
891}
892
78857721 893.sideblock .heading .commands a {
96803c88 894 margin: 0px 2px;
895}
896
78857721 897.sideblock .content {
9cbf12c0 898 padding:4px;
899}
900
78857721 901.sideblock .content hr {
992b5971 902 height:1px;
903 margin-top:4px;
904 margin-bottom:4px;
905 border:none;
906 border-top:1px solid;
af7a6386 907}
908
78857721 909.sideblock .heading .hide-show img.hide-show-image {
5bf2ef9f 910 background: url('../../pix/t/switch_minus.gif') no-repeat bottom;
d4f7a815 911}
912
486589c9 913.sideblock.hidden .heading .hide-show img.hide-show-image {
5bf2ef9f 914 background: url('../../pix/t/switch_plus.gif') no-repeat bottom;
d4f7a815 915}
916
486589c9 917.sideblock.hidden .content {
d4f7a815 918 display: none;
919}
7005a81c 920
78857721 921.sideblock .list {
9ecf051d 922 width: 100%;
923}
924
78857721 925.sideblock .list .c0{
926 padding: 2px;
927}
928
9ecf051d 929.sideblock .footer {
930 margin-top:4px;
931}
932
5a46b156 933.sideblock .heading .icon.hide,
934.sideblock .heading .icon.edit {
935 margin-right: 6px;
936}
937
a8e1f343 938/* sideblock weblib.php */
78857721 939.block_course_summary .content {
a8e1f343 940 padding:10px;
941}
942
0fdce319 943/* blocklib.php */
944
78857721 945.block_adminblock .content {
0fdce319 946 text-align: center;
ec7e2e5f 947 padding: 10px;
0fdce319 948}
949
744fd5bb 950/* block_quiz_results.php */
29ba5158 951.block_quiz_results table.grades {
cae0f35b 952 width: 100%;
cae0f35b 953}
954
29ba5158 955.block_quiz_results table.grades caption {
9c581405 956 margin: 1em 0px 0px 0px;
957 border-bottom: 1px solid;
cae0f35b 958}
959
29ba5158 960.block_quiz_results table.grades .number, .block_quiz_results table.grades .grade {
9c581405 961 width: 10%;
9c581405 962}
963
29ba5158 964.block_quiz_results h1 {
9c581405 965 margin: 4px;
eb111397 966}
744fd5bb 967
968/*****************************
969***
970*** Doc
971***
972******************************/
973
974/* contents.php */
975
46767225 976.cell { /* Very generic table cell*/
9184faa4 977 vertical-align: top;
978}
979
744fd5bb 980body#doc-contents h1 {
981 font-size: 1em;
982 margin: 1em 0px 0px 0px;
983}
984
985body#doc-contents ul {
986 list-style-type: none;
987 margin: 0px;
988 padding: 0px;
989 font-size: 0.8em;
990 width: 90%; /* try it on IE without this and see what happens */
991}
be37582e 992
993body#course-view .unread {
994 margin-left: 3em;
995}
d897c9c4 996
997body#admin-index .c0 {
998 vertical-align: top;
999 background: #FAFAFA;
1000}
bdfd3103 1001
1ea6500d 1002body#admin-modules table.generaltable td.cell,
bdfd3103 1003body#admin-modules .generaltablecell {
b258c9a8 1004 padding-top: 2px;
1005 padding-bottom: 2px;
bdfd3103 1006}
ac91569f 1007
1ea6500d 1008body#admin-blocks table.generaltable td.cell,
ac91569f 1009body#admin-blocks .generaltablecell {
1010 padding-top: 1px;
1011 padding-bottom: 1px;
1012}
2f71f2a2 1013
1014body#admin-config .confighelp {
1015 display: block;
1016 padding-bottom: 20px;
1017}
2efa8aa3 1018body#course-enrol .generalbox {
1019 margin-top: 20px;
1020}
1021body#course-enrol .coursebox {
1022 margin-top: 20px;
1023}
af328e4b 1024
1025.headingblock .link {
1026 text-align:right;
1027}
1028