From 3adbfb5017710f32e5fe26fc9464242c5f61d774 Mon Sep 17 00:00:00 2001
From: Jan-Hendrik Willms <tleilax+studip@gmail.com>
Date: Wed, 5 Jan 2022 13:09:28 +0000
Subject: [PATCH] Biest 475
---
app/views/my_courses/groups.php | 36 ++++++++++++-------
.../assets/stylesheets/scss/my_courses.scss | 34 ++++++++++++++++++
resources/assets/stylesheets/studip.less | 12 -------
resources/assets/stylesheets/studip.scss | 14 ++++++++
4 files changed, 71 insertions(+), 25 deletions(-)
diff --git a/app/views/my_courses/groups.php b/app/views/my_courses/groups.php
index 654f54ca27e..7dce404040b 100644
--- a/app/views/my_courses/groups.php
+++ b/app/views/my_courses/groups.php
@@ -4,18 +4,24 @@
<input type="hidden" name="cid" value="<?= $cid ?>">
<table class="default collapsable">
<caption><?= _('Gruppenzuordnung') ?></caption>
+ <colgroup>
+ <col>
+ <? for ($i = 0; $i < 9; $i += 1): ?>
+ <col style="width: 32px">
+ <? endfor; ?>
+ </colgroup>
<thead>
- <tr>
- <th><?= _('Veranstaltung') ?></th>
- <th colspan="100%"><?= _('Gruppen/Farbe') ?></th>
- </tr>
+ <tr>
+ <th><?= _('Veranstaltung') ?></th>
+ <th colspan="100%"><?= _('Gruppen/Farbe') ?></th>
+ </tr>
</thead>
<? foreach ($groups as $group_id => $group_members): ?>
<tbody class="<?= $current_semester != $semesters[$group_id]['semester_id'] ? 'collapsed' : ''?>">
<? if ($group_field !== 'not_grouped'): ?>
<tr class="table_header header-row">
- <th colspan='100%' class="toggle-indicator">
+ <th colspan="10" class="toggle-indicator">
<a class="toggler">
<? if (is_array($group_names[$group_id])): ?>
<?= htmlReady(my_substr($group_names[$group_id][1] . ' > ' . $group_names[$group_id][0], 0, 70)) ?>
@@ -31,19 +37,23 @@
<td>
<a href="<?= URLHelper::getLink('seminar_main.php?auswahl=' . $member['seminar_id']) ?>">
<?= htmlReady(Config::get()->IMPORTANT_SEMNUMBER ? $my_sem[$member['seminar_id']]['sem_nr'] : '') ?>
- <?= htmlReady(my_substr($my_sem[$member['seminar_id']]['name'], 0, 70)) ?>
+ <?= htmlReady($my_sem[$member['seminar_id']]['name']) ?>
</a>
<? if (!$my_sem[$member['seminar_id']]['visible']): ?>
<?= _('(versteckt)') ?>
<? endif; ?>
</td>
- <? for ($i = 0; $i < 9; $i++): ?>
- <td class="gruppe<?= $i ?>" width="28">
- <input type="radio" name="gruppe[<?= $member['seminar_id'] ?>]" value="<?= $i ?>"
- aria-label="<?= _('Zugeordnet zu Gruppe ') . $i ?>"
- <? if ($my_sem[$member['seminar_id']]['gruppe'] == $i) echo 'checked'; ?>>
- </td>
- <? endfor; ?>
+ <? 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) ?>"
+ 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) ?>
+ </label>
+ </td>
+ <? endfor; ?>
</tr>
<? endforeach; ?>
</tbody>
diff --git a/resources/assets/stylesheets/scss/my_courses.scss b/resources/assets/stylesheets/scss/my_courses.scss
index 7666f2da33f..89125b243c4 100644
--- a/resources/assets/stylesheets/scss/my_courses.scss
+++ b/resources/assets/stylesheets/scss/my_courses.scss
@@ -8,3 +8,37 @@
margin: 5px 0;
background: $white;
}
+
+.mycourses-group-selector {
+ position: relative;
+
+ background-clip: padding-box;
+ border: 1px solid fade-out($brand-color-lighter, 0.8);
+
+ input[type="radio"] {
+ @extend .sr-only;
+
+ &:checked + label {
+ @include background-icon(accept, info);
+ }
+ }
+
+ &:hover label {
+ @include background-icon(accept, info);
+ }
+
+ label {
+ @include hide-text();
+
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+
+ background-position: center;
+ background-repeat: no-repeat;
+
+ cursor: pointer;
+ }
+}
diff --git a/resources/assets/stylesheets/studip.less b/resources/assets/stylesheets/studip.less
index b3515ac28a9..4d2c59a0e85 100644
--- a/resources/assets/stylesheets/studip.less
+++ b/resources/assets/stylesheets/studip.less
@@ -94,18 +94,6 @@
@import "less/feedback.less";
-// Class for DOM elements that should only be visible to Screen readers
-.sr-only {
- position: absolute;
- width: 1px;
- height: 1px;
- padding: 0;
- margin: -1px;
- overflow: hidden;
- clip: rect(0,0,0,0);
- border: 0;
-}
-
/* --- Standardvorgaben ----------------------------------------------------- */
//TODO: the Body-Background color should be similar to A:link.toolbar and A:visited.toolbar for best effect!!
html, body {
diff --git a/resources/assets/stylesheets/studip.scss b/resources/assets/stylesheets/studip.scss
index 8d5dfb7e606..4a157b2456f 100644
--- a/resources/assets/stylesheets/studip.scss
+++ b/resources/assets/stylesheets/studip.scss
@@ -29,3 +29,17 @@
@import "scss/wiki";
@import "scss/grid";
+
+// Class for DOM elements that should only be visible to Screen readers
+.sr-only {
+ border: 0;
+ clip: rect(0 0 0 0);
+ clip-path: inset(100%);
+ height: 1px;
+ margin: -1px;
+ overflow: hidden;
+ padding: 0;
+ position: absolute;
+ white-space: nowrap;
+ width: 1px;
+}
--
GitLab