From 6972de67bd75228bbadd9d86e0838a1ae83e3941 Mon Sep 17 00:00:00 2001
From: Hykilpikonna <me@hydev.org>
Date: Tue, 21 Jun 2022 16:52:20 -0400
Subject: [PATCH] [+] Checkbox group

---
 src/App.vue                 | 54 ++++++++++++++++++-------------------
 src/views/Home.vue          | 14 ++++++++--
 src/views/PrimarySymbol.vue |  4 +--
 3 files changed, 41 insertions(+), 31 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 86a1c3e..aeac74a 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -5,34 +5,34 @@
     <router-link class="rlink" to="/">tf</router-link>
     |
     <router-link class="rlink" to="/about">About</router-link>
-    <div id="application">
-      <Navbar />
-    </div>
   </p>
-  <input
-    v-model="contentType"
-    type="checkbox"
-    value="Video"
-    name="video"/>
-  <label for="video">Video</label>
-  <input v-model="contentType" 
-          type="checkbox" 
-          value="Text" 
-          name="text" />
-  <label for="text">Text</label>
-  <input
-    v-model="contentType"
-    type="checkbox"
-    value="Examples"
-    name="examples"/>
-  <label for="examples">Examples</label>
-  <input
-    v-model="contentType"
-    type="checkbox"
-    value="QnA"
-    name="qna"/>
-  <label for="qna">QnA</label>
-  <p>Content Type: {{ contentType }}</p>
+  <div id="application">
+    <Navbar />
+  </div>
+<!--  <input-->
+<!--    v-model="contentType"-->
+<!--    type="checkbox"-->
+<!--    value="Video"-->
+<!--    name="video"/>-->
+<!--  <label for="video">Video</label>-->
+<!--  <input v-model="contentType" -->
+<!--          type="checkbox" -->
+<!--          value="Text" -->
+<!--          name="text" />-->
+<!--  <label for="text">Text</label>-->
+<!--  <input-->
+<!--    v-model="contentType"-->
+<!--    type="checkbox"-->
+<!--    value="Examples"-->
+<!--    name="examples"/>-->
+<!--  <label for="examples">Examples</label>-->
+<!--  <input-->
+<!--    v-model="contentType"-->
+<!--    type="checkbox"-->
+<!--    value="QnA"-->
+<!--    name="qna"/>-->
+<!--  <label for="qna">QnA</label>-->
+<!--  <p>Content Type: {{ contentType }}</p>-->
 
   <router-view></router-view>
 </template>
diff --git a/src/views/Home.vue b/src/views/Home.vue
index cdfb35d..b48d5a5 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -1,5 +1,12 @@
 <template>
     <div id="Home">
+        <el-checkbox-group v-model="options">
+            <el-checkbox label="Text" />
+            <el-checkbox label="Video" />
+            <el-checkbox label="Examples" />
+            <el-checkbox label="Q&A" />
+        </el-checkbox-group>
+
         <div class="category" v-for="ty of types" :key="ty">
             <h2>{{ty}}</h2>
             <div class="api" v-for="api of apis(ty)" :key="api.name">
@@ -18,8 +25,9 @@
 <script lang="ts">
 import {Options, Vue} from 'vue-class-component';
 import meta from '../meta.json';
+import metaYT from '../meta_yt_links.json'
 import { marked } from 'marked';
-import {$} from '../main';
+import {$} from '@/main';
 
 interface APIEntry
 {
@@ -37,6 +45,8 @@ function onlyUnique(value, index, self) {
 @Options({components: {}})
 export default class Home extends Vue
 {
+    options = ['Text']
+
     get types(): string[]
     {
         return meta.map(it => it.type).filter(onlyUnique)
@@ -96,4 +106,4 @@ export default class Home extends Vue
 
     h1, h2
         font-size: 1em !important
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/PrimarySymbol.vue b/src/views/PrimarySymbol.vue
index d57f94d..24a7074 100644
--- a/src/views/PrimarySymbol.vue
+++ b/src/views/PrimarySymbol.vue
@@ -19,7 +19,7 @@
 import {Options, Vue} from 'vue-class-component';
 import meta from '../meta_primary_symbol.json';
 import { marked } from 'marked';
-import {$} from '../main';
+import {$} from '@/main';
 
 interface APIEntry
 {
@@ -95,4 +95,4 @@ export default class PrimarySymbol extends Vue
 
     h1, h2
         font-size: 1em !important
-</style>
\ No newline at end of file
+</style>