From 31f436aea1509a62cf5dfd5938fe411124d8650d Mon Sep 17 00:00:00 2001
From: Moritz Strohm <strohm@data-quest.de>
Date: Mon, 22 Apr 2024 14:17:26 +0200
Subject: [PATCH] fixed accessibility issues when assigning courses to a colour
 group

---
 app/views/my_courses/groups.php               |  7 ++--
 .../assets/stylesheets/scss/my_courses.scss   | 35 ++++++++++++++++---
 templates/header.php                          |  3 +-
 3 files changed, 38 insertions(+), 7 deletions(-)

diff --git a/app/views/my_courses/groups.php b/app/views/my_courses/groups.php
index 22628c52435..1d16a78aed2 100644
--- a/app/views/my_courses/groups.php
+++ b/app/views/my_courses/groups.php
@@ -58,11 +58,14 @@
                 <? for ($i = 0; $i < 9; $i++): ?>
                     <td class="gruppe<?= $i ?> mycourses-group-selector" onclick="this.querySelector('input').checked = true;">
                         <input type="radio" name="gruppe[<?= $member['seminar_id'] ?>]" value="<?= $i ?>"
-                               aria-label="<?= _('Zugeordnet zu Gruppe ') . ($i + 1) ?>"
+                               aria-label="<?= sprintf(_('Gruppe %u zuordnen'), ($i + 1)) ?>"
                                id="course-group-<?= htmlReady($member['seminar_id']) ?>-<?= $i ?>"
                             <? if ($my_sem[$member['seminar_id']]['gruppe'] == $i) echo 'checked'; ?>>
                         <label for="course-group-<?= htmlReady($member['seminar_id']) ?>-<?= $i ?>">
-                            <?= sprintf(_('Gruppe %u zuordnen'), $i + 1) ?>
+                            <span class="group-number"><?= $i + 1 ?></span>
+                            <span class="checked-icon">
+                                <?= Icon::create('accept', in_array($i, [3,4,5,7]) ? Icon::ROLE_INFO : Icon::ROLE_INFO_ALT)->asImg(20) ?>
+                            </span>
                         </label>
                     </td>
                 <? endfor; ?>
diff --git a/resources/assets/stylesheets/scss/my_courses.scss b/resources/assets/stylesheets/scss/my_courses.scss
index b82ec2bc3ef..814fe438a93 100644
--- a/resources/assets/stylesheets/scss/my_courses.scss
+++ b/resources/assets/stylesheets/scss/my_courses.scss
@@ -9,7 +9,7 @@
     background: var(--white);
 }
 
-.mycourses-group-selector {
+form.default .mycourses-group-selector {
     position: relative;
 
     background-clip: padding-box;
@@ -19,16 +19,32 @@
         @extend .sr-only;
 
         &:checked + label {
-            @include background-icon(accept, info);
+            .group-number {
+                display: none;
+            }
+            .checked-icon {
+                display: inline;
+            }
         }
     }
 
     &:hover label {
-        @include background-icon(accept, info);
+        .group-number {
+            display: none;
+        }
+        .checked-icon {
+            display: inline;
+        }
     }
 
     label {
-        @include hide-text();
+        /*@include hide-text();*/
+
+        text-indent: 0;
+        text-align: center;
+        font-size: large;
+        font-weight: bold;
+        margin-top: 0.5ex;
 
         position: absolute;
         top: 0;
@@ -40,5 +56,16 @@
         background-repeat: no-repeat;
 
         cursor: pointer;
+
+        .group-number {
+            display: inline;
+        }
+        .checked-icon {
+            display: none;
+        }
     }
 }
+
+.mycourses-group-selector:not(.gruppe3, .gruppe4, .gruppe5, .gruppe7) {
+    color: $white;
+}
diff --git a/templates/header.php b/templates/header.php
index 5a935b3f60c..b8750389556 100644
--- a/templates/header.php
+++ b/templates/header.php
@@ -277,7 +277,8 @@ if ($navigation) {
                 <? $membership = CourseMember::find([Context::get()->id, $GLOBALS['user']->id]) ?>
                 <? if ($membership) : ?>
                     <a href="<?= URLHelper::getLink('dispatch.php/my_courses/groups') ?>"
-                       data-dialog
+                       data-dialog aria-label="<?= _('Gruppenzuordnung der Veranstaltung ändern') ?>"
+                       title="<?= _('Gruppenzuordnung der Veranstaltung ändern') ?>"
                        class="colorblock gruppe<?= $membership ? $membership['gruppe'] : 1 ?>"></a>
                 <? endif ?>
             <? endif ?>
-- 
GitLab