Lots of improvements in markup and styles for courses.

Finalized and correctly distributed the calendar styles.

course/format/topics/format.php

@@ -70,7 +70,7 @@
 /// Start main column
     echo '<td id="middle-column">';
 
-    print_heading_block(get_string("topicoutline"), "100%", "outlineheadingblock");
+    print_heading_block(get_string('topicoutline'), 'outline');
     print_spacer(8, 1, true);
 
     echo "<table class=\"topicsoutline\" border=\"0\" cellpadding=\"8\" cellspacing=\"0\" width=\"100%\">";

course/format/weeks/format.php

@@ -60,7 +60,8 @@
 
 /// Start main column
     echo '<td id="middle-column">';
-    print_heading_block(get_string("weeklyoutline"), "100%", "outlineheadingblock");
+
+    print_heading_block(get_string('weeklyoutline'), 'outline');
     print_spacer(8, 1, true);
 
     echo "<table class=\"weeklyoutline\" border=\"0\" cellpadding=\"8\" cellspacing=\"0\" width=\"100%\">";

course/lib.php

@@ -977,7 +977,7 @@ function print_section($course, $section, $mods, $modnamesused, $absolute=false,
 
     $modinfo = unserialize($course->modinfo);
 
-    echo '<table width="'.$width.'" cellpadding="1" cellspacing="0">';
+    echo '<table width="'.$width.'" class="section">';
     if (!empty($section->sequence)) {
 
         $sectionmods = explode(",", $section->sequence);
@@ -989,15 +989,15 @@ function print_section($course, $section, $mods, $modnamesused, $absolute=false,
             $mod = $mods[$modnumber];
 
             if ($mod->visible or $isteacher) {
-                echo "<tr><td class=\"activity$mod->modname\">";
+                echo '<tr><td class="activity '.$mod->modname.'">';
                 if ($ismoving) {
                     if ($mod->id == $USER->activitycopy) {
                         continue;
                     }
                     echo '<a title="'.$strmovefull.'"'.
                          ' href="'.$CFG->wwwroot.'/course/mod.php?moveto='.$mod->id.'&amp;sesskey='.$USER->sesskey.'">'.
-                         '<img height="16" width="80" src="'.$CFG->pixpath.'/movehere.gif" '.
-                         ' alt="'.$strmovehere.'" border="0" /></a><br />
+                         '<img class="movetarget" src="'.$CFG->pixpath.'/movehere.gif" '.
+                         ' alt="'.$strmovehere.'" /></a><br />
                          ';
                 }
                 $instancename = urldecode($modinfo[$modnumber]->name);
@@ -1033,10 +1033,10 @@ function print_section($course, $section, $mods, $modnamesused, $absolute=false,
                 } else { // Normal activity
                     $linkcss = $mod->visible ? "" : " class=\"dimmed\" ";
                     echo '<img src="'.$icon.'"'.
-                         ' height="16" width="16" alt="'.$mod->modfullname.'" />'.
-                         ' <font size="2"><a title="'.$mod->modfullname.'" '.$linkcss.' '.$extra.
+                         ' class="activityicon" alt="'.$mod->modfullname.'" />'.
+                         ' <a title="'.$mod->modfullname.'" '.$linkcss.' '.$extra.
                          ' href="'.$CFG->wwwroot.'/mod/'.$mod->modname.'/view.php?id='.$mod->id.'">'.
-                         $instancename.'</a></font>';
+                         $instancename.'</a>';
                 }
                 if ($CFG->forum_trackreadposts && $mod->modname == 'forum') {
                     $groupmode = groupmode($course, $mod);
@@ -1077,8 +1077,8 @@ function print_section($course, $section, $mods, $modnamesused, $absolute=false,
     if ($ismoving) {
         echo '<tr><td><a title="'.$strmovefull.'"'.
              ' href="'.$CFG->wwwroot.'/course/mod.php?movetosection='.$section->id.'&amp;sesskey='.$USER->sesskey.'">'.
-             '<img height="16" width="80" src="'.$CFG->pixpath.'/movehere.gif" '.
-             ' alt="'.$strmovehere.'" border="0" /></a></td></tr>
+             '<img class="movetarget" src="'.$CFG->pixpath.'/movehere.gif" '.
+             ' alt="'.$strmovehere.'" /></a></td></tr>
              ';
     }
     echo "</table>\n\n";
@@ -1150,12 +1150,12 @@ function rebuild_course_cache($courseid=0) {
 }
 
 
-function print_heading_block($heading, $width="100%", $class="headingblock") {
-
-    echo "<table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"5\">";
-    echo "<tr><td class=\"$class\">";
-    echo stripslashes($heading);
-    echo "</td></tr></table>";
+function print_heading_block($heading, $class = NULL) {
+    $divclass = 'headingblock';
+    if(!empty($class)) {
+        $divclass .= ' '.$class;
+    }
+    echo '<div class="'.$divclass.'">'.stripslashes($heading).'</div>';
 }
 
 

theme/standard/styles_color.css

@@ -179,7 +179,7 @@ th {
 
 
 /* course */
-.outlineheadingblock {
+.headingblock.outline {
     border-color:#DDDDDD; /* borders */
 }
 .weeklyoutlinesidehidden,
@@ -350,6 +350,30 @@ table.message_search_results td {
 ***
 ******************************/
 
+#calendar .maincalendar,
+#calendar .sidecalendar
+{
+    border-color: #DDDDDD;
+}
+
+#calendar .maincalendar table.calendarmonth thead th {
+    border-color: #000000;
+}
+
+table.minicalendar {
+    border-color:#DDDDDD;
+}
+
+#calendar .maincalendar .eventlist .eventfull {
+    border-color:#DDDDDD;
+}
+
+#calendar .maincalendar .eventlist .eventfullheader,
+#calendar .maincalendar .eventlist .eventfullpicture,
+#calendar .maincalendar .eventlist .eventfullside {
+    background-color:#EEEEEE;
+}
+
 #calendar .event_global,
 .minicalendar .event_global,
 .block_calendar_month .event_global {

theme/standard/styles_fonts.css

@@ -255,8 +255,46 @@ h4 {
 ***
 ******************************/
 
+#calendar .maincalendar .eventfull .referer {
+    font-weight:bold;
+}
+
+#calendar .maincalendar table.calendarmonth tbody td {
+    font-size:0.8em;
+    line-height:1.2em;
+}
+
+#calendar .maincalendar .heading,
+#calendar .sidecalendar .heading
+{
+    font-weight:bold;
+}
+
+#calendar .sidecalendar .filters,
+.sideblock.block_calendar_month .filters
+{
+    font-size:0.75em;
+}
+
+#calendar .maincalendar .controls {
+    font-size:1.2em;
+}
+
+#calendar .maincalendar .day {
+    font-weight: bold;
+}
+
+table.minicalendar {
+    font-size:0.85em;
+}
+
+table.minicalendar tbody td {
+    text-align: center;
+}
+
 .sideblock.block_calendar_month .cal_popup_caption,
-.sideblock.block_calendar_month .cal_popup_fg div {
+.sideblock.block_calendar_month .cal_popup_fg div
+{
     font-size: 0.85em !important;
 }
 
@@ -272,10 +310,6 @@ h4 {
     font-weight:bold;
 }
 
-#calendar .maincalendar .referer {
-    font-weight:bold;
-}
-
 /*****************************
 ***
 *** Blocks

theme/standard/styles_layout.css

@@ -189,6 +189,18 @@ table.formtable td {
 *** Course
 ***
 ******************************/
+
+.section .activity img.activityicon {
+    vertical-align:middle;
+    height:16px;
+    weight:16px;
+}
+
+.section img.movetarget {
+    height:16px;
+    width:80px;
+}
+
 /* course, entry-page, login */
 .headingblock {
     background-image:url(gradient.jpg);
@@ -196,11 +208,12 @@ table.formtable td {
     background-repeat:repeat-x;
     border-width:1px;
     border-style:solid;
+    padding:5px;
 }
 
 
 /* course */
-.outlineheadingblock {
+.headingblock.outline {
     background-image:url(gradient.jpg);
     background-position:top;
     background-repeat:repeat-x;
@@ -306,6 +319,138 @@ table.message_search_results td {
 ******************************/
 /* calendar */
 
+#calendar {
+    width: 100%;
+    border-spacing: 5px;
+    border-collapse: separate;
+}
+
+#calendar .maincalendar,
+#calendar .sidecalendar
+{
+    vertical-align: top;
+    border: 1px solid;
+}
+
+#calendar .sidecalendar {
+    width: 25%;
+}
+
+#calendar .maincalendar table.calendarmonth {
+    border-collapse: separate;
+    margin: 0px auto;
+    width: 98%;
+}
+
+#calendar .maincalendar table.calendarmonth thead th {
+    padding:10px;
+    border-bottom:2px solid;
+}
+
+#calendar .maincalendar table.calendarmonth tbody td {
+    height: 5em;
+    padding-left: 4px;
+    padding-top: 4px;
+}
+
+#calendar .maincalendar table.calendarmonth tbody td,
+table.minicalendar tbody td,
+table.minicalendar thead th {
+    width:14%;
+    vertical-align:top;
+}
+
+#calendar .maincalendar table.calendarmonth tbody td table td {
+    height: auto;
+}
+
+#calendar .maincalendar .heading,
+#calendar .sidecalendar .heading
+{
+    background-image:url(gradient.jpg);
+    background-position:top;
+    background-repeat:repeat-x;
+    padding: 5px;
+}
+
+#calendar .maincalendar .heading .buttons {
+    float: right;
+}
+
+#calendar .maincalendar .filters table,
+#calendar .sidecalendar .filters table,
+.sideblock.block_calendar_month .filters table
+{
+    border-collapse:separate;
+    border-spacing: 2px;
+    background-color: #EEEEEE;
+    padding: 2px;
+    width: 100%;
+}
+
+#calendar .maincalendar .filters {
+    padding: 0px 10px;
+}
+
+#calendar .sidecalendar .filters,
+.sideblock.block_calendar_month .filters
+{
+    padding: 5px;
+}
+
+#calendar .maincalendar .controls {
+    clear:both;
+    padding:10px;
+}
+
+#calendar .maincalendar ul {
+    padding:0px;
+    margin:0px;
+    list-style-type:none;
+}
+
+#calendar .maincalendar ul li {
+    margin-top: 4px;
+}
+
+table.minicalendar {
+    margin:10px auto;
+    padding:2px;
+    border-width:1px;
+    border-style:solid;
+    border-collapse:separate;
+    border-spacing:1px !important;
+}
+
+table.minicalendar thead th {
+    padding: 0px 2px;
+}
+
+#calendar .maincalendar .eventlist {
+    padding: 10px;
+}
+
+#calendar .maincalendar .eventlist .eventfull {
+    width: 100%;
+    margin-bottom:10px;
+    border-spacing:0px;
+    border-collapse:separate;
+    border-width:1px;
+    border-style:solid;
+}
+
+#calendar .maincalendar .eventlist .eventfullmessage {
+    padding: 5px;
+}
+
+#calendar .maincalendar .eventlist .eventfullpicture {
+    padding:8px;
+}
+
+#calendar #selecteventtype table {
+    margin:auto;
+}
+
 #calendar .event_global,
 #calendar .event_course,
 #calendar .event_group,
@@ -350,6 +495,13 @@ table.message_search_results td {
     margin-right:5px;
 }
 
+.cal_popup_caption {
+    background-image:url(gradient.jpg);
+    border-bottom-width:1px;
+    border-bottom-style:solid;
+    padding-bottom:2px;
+}
+
 /*****************************
 ***
 *** Blocks
@@ -496,170 +648,3 @@ body#admin-config .confighelp {
     display: block;
     padding-bottom: 20px;
 }
-
-
-
-
-/*
-CALENDAR STYLES -- PROVISIONALLY PLACED HERE UNTIL FINALIZED
-*/
-
-.cal_popup_caption {
-    background-image:url(gradient.jpg);
-    border-bottom-width:1px;
-    border-bottom-style:solid;
-    padding-bottom:2px;
-}
-
-#calendar .maincalendar .calendarmonth tbody td {
-    height: 5em;
-    font-size:0.8em;
-    line-height:1.2em;
-    padding-left: 4px;
-    padding-top: 4px;
-}
-
-#calendar .maincalendar .calendarmonth tbody td table td{
-    height: auto;
-}
-
-#calendar .maincalendar table.calendarmonth {
-    -moz-border-radius: 10px;
-    margin: 0px auto;
-    width: 98%;
-}
-
-#calendar .maincalendar table.calendarmonth thead th {
-    padding:10px;
-    border-bottom:2px #000000 solid;
-}
-
-#calendar {
-    width: 100%;
-    border-spacing: 5px;
-}
-
-#calendar,
-#calendar .maincalendar table.calendarmonth {
-    border-collapse: separate;
-}
-
-#calendar .maincalendar .controls {
-    clear:both;
-    padding:10px;
-    font-size:1.2em;
-}
-
-table.calendarmonth tbody td, table.minicalendar tbody td, table.minicalendar thead th {
-    width:14%;
-    vertical-align:top;
-}
-
-#calendar .sidecalendar, #calendar .maincalendar {
-    vertical-align: top;
-    border: 1px #DDDDDD solid;
-    -moz-border-radius-bottomright:20px;
-    -moz-border-radius-bottomleft:20px;
-}
-
-#calendar .sidecalendar {
-    width: 25%;
-}
-
-#calendar .maincalendar .heading .buttons {
-    float: right;
-}
-
-#calendar .maincalendar .filters table,
-#calendar .sidecalendar .filters table,
-.sideblock.block_calendar_month .filters table {
-    border-collapse:separate;
-    border-spacing: 2px;
-    -moz-border-radius:4px;
-    background-color: #EEEEEE;
-    padding: 2px;
-    width: 100%;
-}
-
-#calendar .sidecalendar .filters,
-.sideblock.block_calendar_month .filters {
-    font-size:0.75em;
-    padding: 5px;
-}
-
-#calendar .maincalendar .filters {
-    padding: 0px 10px;
-}
-
-#calendar .maincalendar .day {
-    font-weight: bold;
-}
-
-#calendar .maincalendar .heading, #calendar .sidecalendar .heading {
-    background-image:url(gradient.jpg);
-    background-position:top;
-    background-repeat:repeat-x;
-    font-weight:bold;
-    padding: 5px;
-}
-
-table.minicalendar {
-    font-size:0.85em;
-    border-collapse:separate;
-    -moz-border-radius:10px;
-    border-color:#DDDDDD;
-    margin:10px auto;
-    padding:2px;
-    border-width:1px;
-    border-style:solid;
-    border-spacing:1px !important;
-}
-
-table.minicalendar thead th {
-    padding: 0px 2px;
-}
-
-table.minicalendar tbody td {
-    -moz-border-radius:4px;
-    text-align: center;
-}
-
-#calendar .eventlist {
-    padding: 10px;
-}
-
-#calendar .eventlist .eventfull {
-    margin-bottom:10px;
-    width: 100%;
-    border-spacing:0px;
-    border-collapse:separate;
-    border-width:1px;
-    border-style:solid;
-    border-color:#DDDDDD;
-}
-
-#calendar .eventfullheader, #calendar .eventfullpicture, #calendar .eventfullside {
-    background-color:#EEEEEE;
-}
-
-#calendar .eventlist .eventfullmessage {
-    padding: 5px;
-}
-
-#calendar .eventlist .eventfullpicture {
-    padding:8px;
-}
-
-#calendar .maincalendar ul {
-    padding:0px;
-    margin:0px;
-    list-style-type:none;
-}
-
-#calendar .maincalendar ul li {
-    margin-top: 4px;
-}
-
-#calendar #selecteventtype table {
-    margin:auto;
-}

theme/standard/styles_moz.css

@@ -83,6 +83,28 @@
     -moz-border-radius-bottomright:15px;
 }
 
+#calendar .maincalendar,
+#calendar .sidecalendar
+{
+    -moz-border-radius-bottomright:20px;
+    -moz-border-radius-bottomleft:20px;
+}
+
+#calendar .maincalendar .filters table,
+#calendar .sidecalendar .filters table,
+.sideblock.block_calendar_month .filters table
+{
+    -moz-border-radius:4px;
+}
+
+table.minicalendar {
+    -moz-border-radius:10px;
+}
+
+table.minicalendar tbody td {
+    -moz-border-radius:4px;
+}
+
 .block_course_summary, .block_course_summary .sideblockmain {
     -moz-border-radius:20px;
 }
@@ -95,7 +117,7 @@
     -moz-border-radius:15px;
 }
 
-.headingblock, .outlineheadingblock {
+.headingblock {
     -moz-border-radius:3px;
 }