CSS styles color.css
The CSS styles_color.css file contains all color definitions like background-color, font-color, border-color etc. Styles are organised into the following sections: core, header, footer, admin, blocks, calendar, course, doc, login, message, question, tabs, user, various modules.
Core
a:link, a:visited { color:#0000FF; }
a.dimmed:link, a.dimmed:visited { color:#AAAAAA; }
a:hover { color:#FF0000; }
a.autolink:link, a.autolink:visited { color:#000000; background: #DDDDDD; }
a.autolink.glossary:hover { cursor: help; }
img.userpicture, img.grouppicture { border-color:#000 }
.block_online_users .listentry img { border:#888 }
body { background-color:#FAFAFA; }
th.header, td.header, div.header { border-color:#DDDDDD; }
.navbar { border-color:#DDDDDD; }
table.formtable tbody th { background: none; }
.highlight { background-color:#AAFFAA; }
.highlight2 { color:#AA0000; /* highlight missing terms in forum search */ }
/* Alternate rows even */
.r0 { }
/* Alternate rows odd */
.r1 { }
/* notification messages (can be good or bad) */
.notifyproblem { color:#660000; } .notifysuccess { color:#006600; } .notifytiny { color:#000044; }
.required { background-color:#DDDDDD; }
.generalbox { border-color:#DDDDDD; } .informationbox { border-color:#DDDDDD; } .feedbackbox { border-color: #888888; } .feedbackby { background-color:#BBBBBB; }
.noticebox { border-color:#DDDDDD; }
.errorbox { color:#ffffff; border-color:#660000; background-color:#990000; }
.errorboxcontent { background-color:#FFBBBB; }
.tabledivider { border-color:#DDDDDD; }
.sitetopic { }
.sitetopiccontent { border-color:#DDDDDD; background-color:#FFFFFF; }
.dimmed_text { color:#AAAAAA; }
.teacheronly { color:#990000; }
.unread { background: #FFD991; }
.censoredtext { color:#000000; background:#000000; }
/* kept for backward compatibility with some non-standard modules
which use these classes for various things */ .generaltab, .generaltabinactive { background-color:#BBBBBB; } .generaltabselected { background-color:#DDDDDD; } .generaltabinactive { color:#CCCCCC; }
.generaltable .cell { background-color:#FFFFFF; border-color:#EEEEEE; }
.generaltable { border-color:#EEEEEE; }
Header
.breadcrumb .sep { color:#aaa; }
.headerskip a:link, .headerskip a:visited, .headerskip a:hover { color: #FFF; }
/*Accessibility: .debugwarn */
.debugwarn { text-align: center; background: #FDD; }
.homelink a:link, .homelink a:visited, .homelink a:hover { color: #000; text-decoration: none; } .homelink a:link, .homelink a:visited { border-top: 1px solid #cecece; border-bottom: 2px solid #4a4a4a; border-left: 1px solid #cecece; border-right: 2px solid #4a4a4a; } .homelink a:hover { border-bottom: 1px solid #cecece; border-top: 2px solid #4a4a4a; border-right: 1px solid #cecece; border-left: 2px solid #4a4a4a; }
Admin
.admin .generalboxcontent { background-color:#EEEEEE; }
.admin .generalbox { border-color:#BBBBBB; }
.admin .informationbox { border-color:#BBBBBB; background-color:#FFFFFF; }
body#admin-index .c0 { background-color: #FAFAFA; }
body#admin-blocks table#blocks .r0, body#admin-blocks table#incompatible .r0 { background-color: #f0f0f0; }
body#admin-blocks table#blocks .r1, body#admin-blocks table#incompatible .r1 { background-color: #fafafa; }
body#admin-blocks table#incompatible td.c0 { color: #ff0000; }
table.flexible .r0 { background-color: #f0f0f0; }
table.flexible .r1 { background-color: #fafafa; }
#admin-report-simpletest-index span.notice { color: teal; }
#admin-report-simpletest-index b.pass { color: green; }
#admin-report-simpletest-index b.fail, b.exception { color: red; }
#admin-report-simpletest-index .exception, .exception pre { background-color: #fdd; }
#admin-report-simpletest-index .unittestsummary { color: white; }
#admin-report-simpletest-index .unittestsummary.fail { background-color: red; }
#admin-report-simpletest-index .unittestsummary.pass { background-color: green; }
#adminsettings fieldset { background-color: #EEE; border-color: #BBB; color: #000; }
#adminsettings .form-shortname { color: #888; }
.block_admin_tree.sideblock .link.current { background-color:#EEEEEE; }
Blocks
.sideblock .header { border-color: #dddddd; }
.sideblock .content { border-color: #dddddd; background-color:#FCFCFC; }
.sideblock .content hr { border-top-color:#999999; }
#left-column .hidden .header, #right-column .hidden .header
{
border-bottom-color: #dddddd; }
.sideblock .header .hide-show img.hide-show-image { background: url('../../pix/t/switch_minus.gif') no-repeat bottom; }
.sideblock.hidden .header .hide-show img.hide-show-image { background: url('../../pix/t/switch_plus.gif') no-repeat bottom; }
.blockconfigtable { background-color:#FFFFFF; border-left:1px solid; border-right:1px solid; border-bottom:1px solid; border-color:#AAAAAA; }
Blogs
.blogpost.blogdraft .content { background-color:#EEEEEE; }
.block_blog_tags .official { color: #0000cc; }
.block_blog_tags .personal { color: #666699; }
Calendar
#calendar .maincalendar, #calendar .sidecalendar { border-color: #DDDDDD; }
#calendar .maincalendar table.calendarmonth th { border-color: #000000; }
table.minicalendar { border-color: #DDDDDD; }
#calendar .maincalendar .eventlist .event { border-color:#DDDDDD; }
#calendar .maincalendar .eventlist .event .topic, #calendar .maincalendar .eventlist .event .picture, #calendar .maincalendar .eventlist .event .side { background-color:#EEEEEE; }
#calendar .maincalendar table.calendarmonth ul.events-underway { color:#999999; }
/*Accessibility: increase contrast, darker link/weekend colors, lighter event backgrounds. */
.minicalendar a, .calendarmonth a { color:#000077; }
#calendar .event_global, .minicalendar .event_global, .block_calendar_month .event_global { border-color:#D6F8CD !important; /* #C5E7BC */ background-color:#D6F8CD; }
#calendar .event_course, .minicalendar .event_course, .block_calendar_month .event_course { border-color:#FFD3BD !important; /* #EEC2AC */ background-color:#FFD3BD; }
#calendar .event_group, .minicalendar .event_group, .block_calendar_month .event_group { border-color:#FEE7AE !important; /* #EDD69D */ background-color:#FEE7AE; }
#calendar .event_user, .minicalendar .event_user, .block_calendar_month .event_user { border-color:#DCE7EC !important; /* #CBD6DB */ background-color:#DCE7EC; }
#calendar .duration_global, .minicalendar .duration_global { border-top-color:#66D14D !important; border-bottom-color:#66D14D !important; }
#calendar .duration_course, .minicalendar .duration_course { border-top-color:#FF9966 !important; border-bottom-color:#FF9966 !important; }
#calendar .duration_group, .minicalendar .duration_group { border-top-color:#FBBB23 !important; border-bottom-color:#FBBB23 !important; }
#calendar .duration_user, .minicalendar .duration_user { border-top-color:#A1BECB !important; border-bottom-color:#A1BECB !important; }
#calendar .weekend, .minicalendar .weekend { color:#990000; }
#calendar .today, .minicalendar .today { border-color:#444444; }
.cal_popup_fg { background-color:#FFFFFF; }
.cal_popup_bg { border-color:#000000; background-color:#FFFFFF; }
#calendar .maincalendar .filters table, #calendar .sidecalendar .filters table, .block_calendar_month .filters table { background-color: #EEEEEE; }
Course
/* course, entry-page, login */
.headingblock { border-color:#DDDDDD; }
/* course */
.headingblock .outline { border-color:#DDDDDD; }
#course-view .weekscss .section, #course-view .section td { border-color:#DDDDDD; }
/* .content should match the body background, sides are white. */
#course-view .weekscss .content { background: #FAFAFA; }
#course-view .weekscss .section, #course-view .section td.side { background: #FFFFFF; }
#course-view .section .side { }
#course-view .section .left { }
#course-view .section .right { }
#course-view .weekscss .current, #course-view .current td.side { background: #FFD991; }
#course-view .weekscss .hidden, #course-view .hidden td.side { background: #DDDDDD; }
#course-view .topics { }
#course-view .weeks { }
#course-view .section .spacer { }
#course-view .section .weekdates { color: #777777; }
#course-view .weekscss .weekdates { color: #333333; }
.categoryboxcontent, .courseboxcontent { border-color:#DDDDDD; } body#course-user .section { border-color:#AAAAAA; }
#admin-report .plugin, #course-report .plugin, #course-import .plugin { margin-bottom: 20px; margin-left:10%; margin-right:10%;
border-bottom: 1px solid #cecece; border-top: 1px solid #cecece; border-right: 1px solid #cecece; border-left: 1px solid #cecece;
background-color: #fdfdfd; }
Grades
body#grade-index .grades { border-color:black; }
body#grade-index .grades td { border-color:#e0e0e0; }
body#grade-index .grades .r0 { background-color: #ffffff; }
body#grade-index .grades .r1 { background-color: #f0f0f0; }
Login
.loginbox .content { border-color:#DDDDDD; }
Message
table.message_search_results td { border-color:#DDDDDD; }
.message.other .author { color: #8888CC; }
.message.me .author { color: #999999; }
.message .time { color: #999999; }
.message .content { }
Question
.que { border-color: #DDD; } .que .r0 { background-color: #F5F5F5; } .que .r1 { background-color: #EEE; } .calculated .answer, .numerical .answer, .shortanswer .answer, .truefalse .answer { background-color: #EEE; } .que .feedback { border-color: #DDD; } .que.multianswer .incorrect { background-color: #faa; } .que.multianswer .partiallycorrect { background-color: #ff9; } .que.multianswer .correct { background-color: #afa; }
Logs
.logtable .r1 { background-color:#EEEEEE; }
Tabs
.tablink a:link, .tablink a:visited { color:#000066; }
.selected .tablink a:link, .selected .tablink a:visited { color:#000000; } .tabs .side, .tabrow td { border-color: #AAAAAA; } .tabrow td { background:url(pix/tab/left.gif) top left no-repeat; } .tabrow td .tablink { background:url(pix/tab/right.gif) top right no-repeat; } .tabrow td:hover { background-image:url(pix/tab/left_hover.gif); } .tabrow td:hover .tablink { background-image:url(pix/tab/right_hover.gif); } .tabrow .last { background: transparent url(pix/tab/right_end.gif) top right no-repeat; } .tabrow .selected { background:url(pix/tab/left_active.gif) top left no-repeat; } .tabrow .selected .tablink { background:url(pix/tab/right_active.gif) top right no-repeat; } .tabrow td.selected:hover { background-image:url(pix/tab/left_active_hover.gif); } .tabrow td.selected:hover .tablink { background-image:url(pix/tab/right_active_hover.gif); }
User
.userpicture { }
.userinfobox { border-color: #DDDDDD; } .groupinfobox { border-color: #DDDDDD; }
Modules:
Chat
#mod-chat-gui_header_js-jsupdate .text { color:#000 } #mod-chat-gui_header_js-jsupdate .event, #mod-chat-gui_header_js-jsupdate .title { color:#888 }
#mod-chat-gui_header_js-chatinput .wait { background: #dddddd; }
Forum
.forumheaderlist, .forumpost { border-color:#DDDDDD; }
.forumpost .content { background: #FFFFFF; }
.forumpost .left { background:#EEEEEE; }
.forumpost .topic { border-bottom-color: #EEEEEE; }
.forumpost .starter { background:#DDDDDD; }
.forumheaderlist .discussion .starter { background:#DDDDDD; }
.forumheaderlist td { border-color: #FFFFFF; }
.sideblock .post .head { color:#555555; }
.forumthread .unread { background: #FFD991; } #mod-forum-discuss .forumpost { background: none; }
#mod-forum-discuss .forumpost.unread .content { border-color: #FFD991; }
#mod-forum-discuss .forumthread .unread { }
#mod-forum-index .unread { }
Glossary
.entryboxheader { border-color: #BBBBBB; }
.entrybox { border-color: #BBBBBB; }
.entry { }
.glossarypost { border-color: #DDDDDD; }
.glossarypost .entryheader, .glossarypost .entryapproval, .glossarypost .picture, .glossarypost .entryattachment, .glossarypost .left { background-color: #F0F0F0; }
.glossarycomment { border-color: #DDDDDD; }
.glossarycomment .entryheader, .glossarycomment .picture, .glossarycomment .left { background-color: #F0F0F0;
}
#mod-glossary-report .generalbox .teacher { background: #F0F0F0; }
.categoryheader { background-color: #dddddd; }
.glossaryformatheader { background-color: #dddddd; }
Journal
#mod-journal-view .feedbackbox .left, #mod-journal-view .feedbackbox .entryheader { background-color: #dddddd; }
Quiz
/* body#mod-quiz-report table#attempts td {
border-color: #dddddd; } body#mod-quiz-report table#attempts .r1 { background-color: #eeeeee; } */
Resource
.ims-nav-dimmed { color: #AAAAAA; text-decoration: none; }
.ims-nav-button a:link, .ims-nav-button a:visited, .ims-nav-button a:hover { color: #000; text-decoration: none; }
.ims-nav-dimmed, .ims-nav-button a:link, .ims-nav-button a:visited { border-top: 1px solid #cecece; border-bottom: 2px solid #4a4a4a; border-left: 1px solid #cecece; border-right: 2px solid #4a4a4a; }
.ims-nav-button a:hover { border-bottom: 1px solid #cecece; border-top: 2px solid #4a4a4a; border-right: 1px solid #cecece; border-left: 2px solid #4a4a4a; }
#ims-contentframe, #ims-contentframe-no-nav { border-color: #cecece; }
Survey
#mod-survey-view .r0 { background-color: #EEEEEE; } #mod-survey-view .r1 { background-color: #DDDDDD; }
Workshop
.workshoppostpicture { background-color:#FEE6B9; }
.workshopassessmentheading { background-color:#DDDDDD; }
.error { color:#ff0000; }
#admin-roles-override .capcurrent { background-color:#FFFFFF; border: 1px solid #cecece; }
#admin-roles-manage .rolecap, #admin-roles-override .rolecap { border:none; border-bottom:1px solid; border-bottom-color: #cecece; }
#admin-roles-manage .rolecap .cap-desc .cap-name, #admin-roles-override .rolecap .cap-desc .cap-name { color: #888; }