fix #2114

Closes #2114

Merge request studip/studip!1876

resources/assets/stylesheets/scss/courseware.scss

@@ -2969,14 +2969,11 @@ c o n f i r m  b l o c k
     .cw-block-confirm-content{
         border: solid thin $content-color-40;
         padding: 1em;
-        display: flex;
-        .cw-block-confirm-checkbox img{
+        margin: 0;
+
+        input[type=checkbox] {
             margin-right: 2em;
-            vertical-align: middle;
-            height: 100%;
-        }
-        .cw-block-confirm-text {
-            margin: 0;
+            vertical-align: bottom;
         }
     }
 }

resources/vue/components/courseware/CoursewareConfirmBlock.vue

@@ -14,15 +14,12 @@
                 <div class="cw-block-title">
                     <translate>Bestätigung</translate>
                 </div>
-                <div class="cw-block-confirm-content">
-                    <div class="cw-block-confirm-checkbox">
-                        <studip-icon v-if="!confirm" shape="checkbox-unchecked" role="info" @click="setConfirm" />
-                        <studip-icon v-if="confirm" shape="checkbox-checked" role="info" />
-                    </div>
-                    <p class="cw-block-confirm-text">
-                        {{ currentText }}
-                    </p>
-                </div>
+                <form class="default cw-block-confirm-content" prevent.default="">
+                    <label>
+                        <input type="checkbox" :disabled="confirm" :checked="confirm" @click="setConfirm"/>
+                        <span>{{ currentText }}</span>
+                    </label>
+                </form>
             </template>
             <template v-if="canEdit" #edit>
                 <form class="default" @submit.prevent="">
@@ -41,14 +38,12 @@
 import CoursewareDefaultBlock from './CoursewareDefaultBlock.vue';
 import { mapActions, mapGetters } from 'vuex';
 import { blockMixin } from './block-mixin.js';
-import StudipIcon from '../StudipIcon.vue';
 
 export default {
     name: 'courseware-confirm-block',
     mixins: [blockMixin],
     components: {
-        CoursewareDefaultBlock,
-        StudipIcon,
+        CoursewareDefaultBlock
     },
     props: {
         block: Object,
@@ -88,6 +83,9 @@ export default {
             }
         },
         async setConfirm() {
+            if (this.confirm) {
+                return;
+            }
             let data = {};
             data.type = 'courseware-user-data-fields';
             data.id = this.block.relationships['user-data-field'].data.id;