refactor: ♻️ move nsfw functionality into root component

src/App.vue

@@ -19,6 +19,9 @@ export default {
   components: { Navigation },
   data() {
     return {
+      nsfw: false,
+      isConfirmedHorny: false,
+      isWarn: false,
       routes: [
         { path: "/", name: "Home" },
         { path: "/general", name: "General" },
@@ -29,6 +32,13 @@ export default {
       ],
     };
   },
+  methods: {
+    showWarning() {
+      if (!this.isConfirmedHorny) {
+        this.isWarn = true;
+      }
+    },
+  }
 };
 </script>
 

src/components/NsfwWarning.vue

@@ -23,9 +23,9 @@
 export default {
   methods: {
     confirmNsfw(input) {
-      this.$parent.nsfw = input;
+      this.$root.nsfw = input;
-      this.$parent.isConfirmedHorny = input;
+      this.$root.isConfirmedHorny = input;
-      this.$parent.isWarn = false;
+      this.$root.isWarn = false;
     },
   },
 };

src/views/Anatomy.vue

@@ -1,5 +1,5 @@
 <template>
-  <nsfw-warning v-show="isWarn">
+  <nsfw-warning v-show="$root.isWarn">
     <template #heading>
       ⚠️⚠️⚠️<br />
       Whoa, Nelly!
@@ -15,14 +15,14 @@
   </nsfw-warning>
 
   <prose>
-    <nsfw-switch id="nsfw-switch" v-model="nsfw" @change="showWarning()" />
+    <nsfw-switch id="nsfw-switch" v-model="$root.nsfw" @change="$root.showWarning()" />
 
     <h2>Anatomy</h2>
 
     <ref-figure>
       <template #img>
         <img
-          v-if="nsfw"
+          v-if="$root.nsfw"
           src="@/assets/refs/sebin-ref-body-NSFW.png"
           alt="Sebin Full Body Ref"
         />
@@ -184,8 +184,8 @@
         </div>
         <nsfw-switch
           id="nsfw-switch-muscle"
-          v-model="nsfw"
+          v-model="$root.nsfw"
-          @change="showWarning()"
+          @change="$root.showWarning()"
         />
       </div>
     </div> -->
@@ -339,21 +339,7 @@ export default {
     DataTable,
     RefGallery,
   },
-  data() {
-    return {
-      nsfw: false,
-      isWarn: false,
-      isConfirmedHorny: false,
-    };
-  },
   mixins: [Sebin, Helper],
-  methods: {
-    showWarning() {
-      if (!this.isConfirmedHorny) {
-        this.isWarn = true;
-      }
-    },
-  },
 };
 </script>