Accessibility: 'weekscss' course format - layout table of weeks, now a list.

diff --git a/course/format/weekscss/format.php b/course/format/weekscss/format.php
index 6718b6dcd761f834682f5316536cb627c94d2222..708e3c0a86c94f6262e54c37203c2470afe6c033 100644 (file)
--- a/course/format/weekscss/format.php
+++ b/course/format/weekscss/format.php
@@ -80,7 +80,7 @@
 
 
 /// Layout the whole page as three big columns.
-    echo '<div id="layout-table" class="weekscss">';
+    echo '<div id="layout-table">';
 
 /// The left column ...
 
@@ -96,17 +96,20 @@
 
     print_heading_block(get_string('weeklyoutline'), 'outline');
 
-    echo '<table class="weeks" width="100%">';
+    //--echo '<table class="weeks" width="100%">';
+    echo "<ul class='weekscss'>\n"; //'weeks'
 
 /// If currently moving a file then show the current clipboard
     if (ismoving($course->id)) {
         $stractivityclipboard = strip_tags(get_string('activityclipboard', '', addslashes($USER->activitycopyname)));
         $strcancel= get_string('cancel');
-        echo '<tr class="clipboard">';
-        echo '<td colspan="3">';
+        //--echo '<tr class="clipboard">';
+        //echo '<td colspan="3">';
+        echo '<li class="clipboard">';
         echo $stractivityclipboard.'&nbsp;&nbsp;(<a href="mod.php?cancelcopy=true&amp;sesskey='.$USER->sesskey.'">'.$strcancel.'</a>)';
-        echo '</td>';
-        echo '</tr>';
+        echo "</li>\n";
+        //echo '</td>';
+        //--echo '</tr>';
     }
 
 /// Print Section 0 with general activities
@@ -115,9 +118,12 @@
     $thissection = $sections[$section];
 
     if ($thissection->summary or $thissection->sequence or isediting($course->id)) {
-        echo '<tr id="section-0" class="section main">';
+        /*--echo '<tr id="section-0" class="section main">';
         echo '<td class="left side">&nbsp;</td>';
         echo '<td class="content">';
+        */
+        echo '<li id="section-0" class="section main" >'; //'<div class="left side">&nbsp;</div>
+        echo '<div class="content">';
         
         echo '<div class="summary">';
         $summaryformatoptions->noclean = true;
@@ -136,12 +142,13 @@
             print_section_add_menus($course, $section, $modnames);
         }
 
-        echo '</td>';
+        /*--echo '</td>';
         echo '<td class="right side">&nbsp;</td>';
         echo '</tr>';
-        //TODO (nfreear): Accessibility: how to get rid of the 'separator' row??
         echo '<tr class="section separator"><td colspan="3" class="spacer"></td></tr>';
-
+        */
+        echo '</div><div class="right side" >&nbsp;</div><div class="clearer"></div>';
+        echo "</li>\n";
     }
 
 
@@ -201,10 +208,14 @@
                 $sectionstyle = '';
             }
 
-            echo '<tr id="section-'.$section.'" class="section main'.$sectionstyle.'">';
+            /*--echo '<tr id="section-'.$section.'" class="section main'.$sectionstyle.'">';
             echo '<td class="left side">&nbsp;</td>';
 
             echo '<td class="content">';
+            */
+            echo '<li id="section-'.$section.'" class="section main'.$sectionstyle.'" >'; //'<div class="left side">&nbsp;</div>';
+
+            echo '<div class="content">';
             if (!isteacher($course->id) and !$thissection->visible) {   // Hidden for students
                 echo '<div class="weekdates">'.$weekday.' - '.$endweekday.' ('.get_string('notavailable').')</div>';
 
@@ -227,10 +238,12 @@
                     print_section_add_menus($course, $section, $modnames);
                 }
             }
-            echo '</td>';
+            /*--echo '</td>';
 
             echo '<td class="right side">';
-
+            */
+            echo '</div><div class="right side">';
+            
             if ($displaysection == $section) {
                 echo '<a href="view.php?id='.$course->id.'&amp;week=all#section-'.$section.'" title="'.$strshowallweeks.'">'.
                      '<img src="'.$CFG->pixpath.'/i/all.gif" class="icon wkall" alt="'.$strshowallweeks.'" /></a><br />';
@@ -259,15 +272,18 @@
                 }
             }
 
-            echo '</td></tr>';
-            //TODO (nfreear): Accessibility: how to get rid of the 'separator' row??
+            /*--echo '</td></tr>';
             echo '<tr class="section separator"><td colspan="3" class="spacer"></td></tr>';
+            */
+            echo '</div><div class="clearer"></div>';
+            echo "</li>\n";
         }
 
         $section++;
         $weekdate = $nextweekdate;
     }
-    echo '</table>';
+    //--echo '</table>';
+    echo "</ul>\n";
 
     if (!empty($sectionmenu)) {
         echo '<div align="center" class="jumpmenu">';

diff --git a/theme/standard/styles_color.css b/theme/standard/styles_color.css
index e009288d4d2bb342999de215711fbe79e4125cad..dd54b6d345c459f0b26587fa1b46a577be0a8d3f 100644 (file)
--- a/theme/standard/styles_color.css
+++ b/theme/standard/styles_color.css
@@ -415,13 +415,11 @@ table.minicalendar {
   border-color:#DDDDDD;
 }
 
+#course-view li.section,
 #course-view .section td {
   border-color:#DDDDDD;
 }
 
-#course-view .section .content {
-}
-
 #course-view .section .side {
 }
 
@@ -431,10 +429,15 @@ table.minicalendar {
 #course-view .section .right {
 }
 
-#course-view .current .side{
+#course-view .weekscss .current,
+#course-view .weeks .current .side{
   background: #FFD991;
 }
 
+#course-view .current .content {
+  background: white;
+}
+
 #course-view .topics {
 }
 

diff --git a/theme/standard/styles_layout.css b/theme/standard/styles_layout.css
index f84fd03202481b6a7db6402079d194520154d4f5..5257fc54b87cf205001917269943cdc1711cc34d 100644 (file)
--- a/theme/standard/styles_layout.css
+++ b/theme/standard/styles_layout.css
@@ -822,7 +822,7 @@ span.current {
   vertical-align:top;
 }
 
-#course-view .section .content {
+#course-view .weeks .section .content {
   padding:5px;
   border-style:solid;
   border-width:1px;
@@ -834,19 +834,19 @@ span.current {
   clear: both;
 }
 
-#course-view .section .side {
+#course-view .weeks .section .side {
   padding:5px;
   border-style:solid;
   border-width:1px;
 }
 
-#course-view .section .left {
+#course-view .weeks .section .left {
   border-right:0px;
   text-align:center;
   width: 1.5em;
 }
 
-#course-view .section .right {
+#course-view .weeks .section .right {
   border-left:0px;
   text-align:center;
   width: 1.5em;
@@ -862,6 +862,36 @@ span.current {
 #course-view .section .weekdates {
 }
 
+
+/*Accessibility: No-tables course format. */
+#course-view ul.weekscss, .weekscss li {
+  margin: 0;
+  padding: 0;
+  text-indent: 0;
+  list-style: none;
+}
+.weekscss li.section {
+  margin-bottom: 0.5em;
+  width: 100%;
+  border-style:solid;
+  border-width:1px;
+}
+.weekscss .content, .weekscss .side {
+  padding: 5px;
+}
+.weekscss .content {
+  margin-left: 4%;  /* Why? Firefox 8%; IE 4% */
+  width: 80%;
+  float: left;
+}
+.weekscss .side {
+  width: 8%;
+  float: left;
+}
+.weekscss .clearer {
+  height: 0;
+}
+
 .section .activity img.activityicon {
   vertical-align:middle;
   height:16px;