improvements of info icon

Author: Cronus1007

src/Vocabulary/VInput.vue

@@ -12,21 +12,21 @@
       >{{ label }}
         <span
           v-if="rightIcon"
+          @click="openModalFunction"
         >
           <img
             class="info"
             src="../assets/info.svg"
             alt="Info"
-            @click="openModal=true"
           >
           <app-modal
             v-if="openModal==true"
             :title="$t(`help.context-for-creator-name.heading`)"
-            @close="openModal=false"
+            @close="closeModalFunction"
           >
             <section class="modal-body">
               <section
-                :class="['modal-content','modal-']"
+                :class="['modal-content','modal-0']"
               >
                 <article
                   v-html="$t(`help.context-for-creator-name.text`)">
@@ -127,6 +127,7 @@ export default {
   data() {
     return {
       localValue: this.value,
+      openModal: false,
     }
   },
   computed: {
@@ -156,6 +157,13 @@ export default {
       this.localValue = event.target.value
       this.computedValue = event.target.value
     },
+    openModalFunction() {
+      this.openModal=true
+    },
+    closeModalFunction() {
+      this.openModal = false
+      return this.openModal
+    },
   },
 }
 // <!--'', is-medium, is-large in vocabulary; normal, big, huge in DL-->

src/components/AttributionDetailsStep.vue

@@ -50,11 +50,6 @@ export default {
       },
     },
   },
-  data() {
-    return {
-      openModal: false,
-    }
-  },
   computed: {
     ...mapState(['attributionDetails', 'currentLicenseAttributes']),
     creatorName: {