Biest #156

resources/assets/stylesheets/scss/courseware.scss

@@ -1451,9 +1451,6 @@ b l o c k a d d e r
 }
 
 .cw-block-adder-area {
-    @include background-icon(add, clickable);
-    background-repeat: no-repeat;
-    background-position: calc(50% - 5em) calc(50% - 1px);
     border: solid thin $content-color-40;
     padding: 1em 0;
     color: $base-color;
@@ -1465,13 +1462,11 @@ b l o c k a d d e r
     &.cw-block-adder-active {
         border: solid thin $base-color;
         background-color: $base-color;
-        @include background-icon(add, info-alt);
         color: $white;
     }
-    &.cw-block-adder-disabled {
-        @include background-icon(add, inactive);
-        color: $dark-gray-color-80;
-        cursor: default;
+
+    img {
+        vertical-align: text-bottom;
     }
 }
 .cw-block-helper-buttons {

resources/vue/components/courseware/CoursewareBlockAdderArea.vue

 <template>
     <div
         class="cw-block-adder-area"
-        :class="{ 'cw-block-adder-active': adderActive, 'cw-block-adder-disabled': adderDisable }"
+        :class="{ 'cw-block-adder-active': adderActive }"
         @click="selectBlockAdder"
     >
-        <translate>Block hinzufügen</translate>
+        <studip-icon v-show="!adderActive" shape="add" />
+        <studip-icon v-show="adderActive" shape="add" role="info_alt"/>
+        <span v-show="!adderActive"><translate>Block zu diesem Abschnitt hinzufügen</translate></span>
+        <span v-show="adderActive"><translate>Abschnitt aktiv - Blöcke werden hier eingefügt</translate></span>
     </div>
 </template>
 
 <script>
+import StudipIcon from '../StudipIcon.vue';
 export default {
+  components: { StudipIcon },
     name: 'courseware-block-adder-area',
     props: {
         container: Object,
@@ -30,9 +35,6 @@ export default {
     },
     methods: {
         selectBlockAdder() {
-            if (this.adderDisable) {
-                return false;
-            }
             if (this.adderActive) {
                 this.adderActive = false;
                 this.$store.dispatch('coursewareBlockAdder', {});
@@ -47,7 +49,13 @@ export default {
         adderStorage(newValue, oldValue) {
             if (Object.keys(newValue).length === 0) {
                 this.adderActive = false;
-                this.$emit('updateContainerContent', oldValue)
+                this.$emit('updateContainerContent', oldValue);
+            } else {
+                if (newValue.container.id === this.container.id && newValue.section === this.section) {
+                    this.adderActive = true;
+                } else {
+                    this.adderActive = false;
+                }
             }
         },
     },