[LON-CAPA-cvs] cvs: loncom /homework radiobuttonresponse.pm /homework/caparesponse caparesponse.pm /interface loncommon.pm

[raeburn]

raeburn		Sun Jun 21 19:46:38 2026 EDT

  Modified files:              
    /loncom/homework	radiobuttonresponse.pm 
    /loncom/homework/caparesponse	caparesponse.pm 
    /loncom/interface	loncommon.pm 
  Log:
  - WCAG 2 compliance
    - Replace use of <table> for layout with <div>.
    - Group form elements in fieldset with legend for screenreaders.
  
  
Index: loncom/homework/radiobuttonresponse.pm
diff -u loncom/homework/radiobuttonresponse.pm:1.166 loncom/homework/radiobuttonresponse.pm:1.167
--- loncom/homework/radiobuttonresponse.pm:1.166	Tue Mar 17 19:59:25 2026
+++ loncom/homework/radiobuttonresponse.pm	Sun Jun 21 19:46:33 2026
@@ -1,7 +1,7 @@
 # The LearningOnline Network with CAPA
 # multiple choice style responses
 #
-# $Id: radiobuttonresponse.pm,v 1.166 2026/03/17 19:59:25 raeburn Exp $
+# $Id: radiobuttonresponse.pm,v 1.167 2026/06/21 19:46:33 raeburn Exp $
 #
 # Copyright Michigan State University Board of Trustees
 #
@@ -592,7 +592,8 @@
 sub html_direction_fragments {
     my $direction = shift;
     if ($direction eq 'horizontal') {
-	return ('<table><tr>', '</tr></table>', '<td>', '</td>');
+        return ('<div class="LC_grid" role="grid" style="margin: 0;"><div class="LC_grid_row" role="row">',
+                '</div></div>', '<div class="LC_gridcell_radio" role="gridcell">', '</div>');
     } else {
 	return ('', '', '<div class="LC_radiofoil">', '</div>');
     }
@@ -950,6 +951,8 @@
 	my $lastresponse = &get_last_response($part);
 	
 	my $item_no = 0;
+        $result .= '<fieldset class="LC_borderless" style="display: block;">'
+                  .'<legend class="LC_visually_hidden">'.&mt('Choose answer').'</legend>';
 	foreach my $name (@{$whichfoils}) {
 	    $result .= $item_pretext;
 	    $result .= &html_radiobutton(
@@ -959,7 +962,8 @@
 	    $result .= $item_posttext;
 	    $item_no++;
 	}
-	
+        $result .= '</fieldset>';
+
     }
     $result .= $finalclose;
 
Index: loncom/homework/caparesponse/caparesponse.pm
diff -u loncom/homework/caparesponse/caparesponse.pm:1.266 loncom/homework/caparesponse/caparesponse.pm:1.267
--- loncom/homework/caparesponse/caparesponse.pm:1.266	Thu Feb 20 06:36:00 2025
+++ loncom/homework/caparesponse/caparesponse.pm	Sun Jun 21 19:46:36 2026
@@ -1,7 +1,7 @@
 # The LearningOnline Network with CAPA
 # caparesponse definition
 #
-# $Id: caparesponse.pm,v 1.266 2025/02/20 06:36:00 raeburn Exp $
+# $Id: caparesponse.pm,v 1.267 2026/06/21 19:46:36 raeburn Exp $
 #
 # Copyright Michigan State University Board of Trustees
 #
@@ -646,19 +646,32 @@
 	    if ($target eq 'web') {
 		if ($tag eq 'numericalresponse') {
 		    if ($unit=~/\S/) {$result.=' (in '.$unit.')<br /><br />';}
-		    $result.= '<table border="1"><tr>';
+                    my $solid = '1px solid black;';
+                    $result .= '<fieldset class="LC_borderless" style="display: block;">'
+                              .'<legend class="LC_visually_hidden">'.&mt('Choose answer').'</legend>'
+                              .'<div class="LC_grid" role="grid" style="margin: 5px 0; border: '.$solid.'">'
+                              .'<div class="LC_grid_row" role="row">';
 		    my $previous=$Apache::lonhomework::history{"resource.$Apache::inputtags::part.$id.submission"};
 		    for (my $ind=0;$ind<$number_of_bubbles;$ind++) {
 			my $checked='';
 			if ($previous eq $bubble_values->[$ind]) {
 			    $checked=" checked='on' ";
 			}
-			$result.='<td><label><input type="radio" name="HWVAL_'.$id.
-			    '" value="'.$bubble_values->[$ind].'" '.$checked
-			    .' /><b>'.$alphabet[$ind].'</b>: '.
-			    $bubble_display->[$ind].'</label></td>';
+                        my $style = 'padding-right: 5px;';
+                        if ($ind) {
+                            if ($ind+1 == $number_of_bubbles) {
+                                $style = 'border-left: '.$solid;
+                            } else {
+                                $style .= ' border-left: '.$solid;
+                            }
+                        }
+                        $result.='<div class="LC_gridcell_radio" role="gridcell" style="'.$style.'">'
+                                .'<label><input type="radio" name="HWVAL_'.$id
+                                .'" value="'.$bubble_values->[$ind].'" '.$checked
+                                .' /><b>'.$alphabet[$ind].'</b>: '
+                                .$bubble_display->[$ind].'</label></div>';
 		    }
-		    $result.='</tr></table>';
+		    $result.='</div></div></fieldset>';
 		}
 	    } elsif ($target eq 'tex') {
 		if ((defined $unit) and ($unit=~/\S/) and ($Apache::lonhomework::type eq 'exam')) {
Index: loncom/interface/loncommon.pm
diff -u loncom/interface/loncommon.pm:1.1530 loncom/interface/loncommon.pm:1.1531
--- loncom/interface/loncommon.pm:1.1530	Sun Jun 21 17:18:12 2026
+++ loncom/interface/loncommon.pm	Sun Jun 21 19:46:38 2026
@@ -1,7 +1,7 @@
 # The LearningOnline Network with CAPA
 # a pile of common routines
 #
-# $Id: loncommon.pm,v 1.1530 2026/06/21 17:18:12 raeburn Exp $
+# $Id: loncommon.pm,v 1.1531 2026/06/21 19:46:38 raeburn Exp $
 #
 # Copyright Michigan State University Board of Trustees
 #
@@ -7972,6 +7972,11 @@
   padding: 2px 4px 2px 4px;
 }
 
+div.LC_gridcell_radio {
+  display: table-cell;
+  padding: 2px;
+}
+
 div.LC_gridcell_even {
   background-color: $data_table_dark;
 }