From bfe8b40f4412d851123f29a2cc9503e8955d2088 Mon Sep 17 00:00:00 2001
From: "Adrian O.V" <83074853+CodexAdrian@users.noreply.github.com>
Date: Thu, 30 Mar 2023 18:37:45 -0400
Subject: [PATCH] Library page (#53)

* launcher base gui initial

* Bootstraps router, Omorphia, and prettier.

* Adds pages. Adds Vuex. SideBar nav contains user section and pages section.

* Adds Instance markup. Instances added to Home page.

* Adds News to home page.

* Adds settings to nav. Other touches.

* Polishing initial base GUI.

* Moves some styling to assets. Changes px values to rem.

* Removes pointless border-radius CSS.

* Implements Omorphia vars.

* Adds trending mods section.

* Updates home page.

* Swaps Vuex implementation for Pinia.

* Fixes invalid CSS on instance list item hover.

* Adds @ path resolve for imports.

* Fix some styling of row display

* Gridview on library page

* Cleaning up styles and markup.

* Fixes overall layout issues.

* Cleans up more styling. Modifies AppBar coloring.

* instance routing

* Allows pagination arrows to conditionally appear in RowDisplay.

* Adds paging behavior in RowDisplay.

* Initial modlist layout

* Updates nav and settings button styling.

* Brings in Knossos style for trending mods. Polishes News CSS.

* Page redesign

* More tweaks

* Base library pages

* Remove errant css

* Update play.svg

* Addressed issues

---------

Co-authored-by: Jai A <jaiagr+gpg@pm.me>
Co-authored-by: Zachary Baird <zdb1994@yahoo.com>
Co-authored-by: Zach Baird <30800863+ZachBaird@users.noreply.github.com>
---
 theseus_gui/package.json                      |   3 +-
 theseus_gui/src-tauri/tauri.conf.json         |   4 +-
 theseus_gui/src/App.vue                       | 130 ++--
 theseus_gui/src/assets/icons/folder-open.svg  |   4 +
 .../src/assets/icons/folder-search.svg        |   6 +
 theseus_gui/src/assets/icons/index.js         |   3 +
 theseus_gui/src/assets/icons/play.svg         |   4 +
 theseus_gui/src/components/GridDisplay.vue    | 132 ++++
 theseus_gui/src/components/RowDisplay.vue     |  42 +-
 theseus_gui/src/components/ui/Instance.vue    |  33 +-
 theseus_gui/src/components/ui/News.vue        |  13 +-
 theseus_gui/src/pages/AddInstance.vue         |   7 +
 theseus_gui/src/pages/Library.vue             |  11 +-
 theseus_gui/src/pages/instance/Index.vue      | 269 +++++++++
 theseus_gui/src/pages/instance/Logs.vue       | 121 ++++
 theseus_gui/src/pages/instance/Mods.vue       | 247 ++++++++
 theseus_gui/src/pages/instance/Options.vue    | 230 +++++++
 theseus_gui/src/pages/instance/index.js       |   6 +
 theseus_gui/src/pages/instances/Instance.vue  |  14 -
 theseus_gui/src/routes.js                     |  29 +
 theseus_gui/vite.config.js                    |  15 +
 theseus_gui/yarn.lock                         | 571 +++++++++++-------
 22 files changed, 1555 insertions(+), 339 deletions(-)
 create mode 100644 theseus_gui/src/assets/icons/folder-open.svg
 create mode 100644 theseus_gui/src/assets/icons/folder-search.svg
 create mode 100644 theseus_gui/src/assets/icons/index.js
 create mode 100644 theseus_gui/src/assets/icons/play.svg
 create mode 100644 theseus_gui/src/components/GridDisplay.vue
 create mode 100644 theseus_gui/src/pages/AddInstance.vue
 create mode 100644 theseus_gui/src/pages/instance/Index.vue
 create mode 100644 theseus_gui/src/pages/instance/Logs.vue
 create mode 100644 theseus_gui/src/pages/instance/Mods.vue
 create mode 100644 theseus_gui/src/pages/instance/Options.vue
 create mode 100644 theseus_gui/src/pages/instance/index.js
 delete mode 100644 theseus_gui/src/pages/instances/Instance.vue

diff --git a/theseus_gui/package.json b/theseus_gui/package.json
index 1f12b40b2..08c49f08c 100644
--- a/theseus_gui/package.json
+++ b/theseus_gui/package.json
@@ -12,8 +12,9 @@
   "dependencies": {
     "@tauri-apps/api": "^1.2.0",
     "axios": "^1.3.4",
-    "omorphia": "^0.4.0",
+    "omorphia": "^0.4.2",
     "pinia": "^2.0.33",
+    "vite-svg-loader": "^4.0.0",
     "vue": "^3.2.45",
     "vue-router": "4"
   },
diff --git a/theseus_gui/src-tauri/tauri.conf.json b/theseus_gui/src-tauri/tauri.conf.json
index 8f4367fe9..e71ba2006 100644
--- a/theseus_gui/src-tauri/tauri.conf.json
+++ b/theseus_gui/src-tauri/tauri.conf.json
@@ -59,7 +59,9 @@
         "height": 650,
         "resizable": true,
         "title": "Modrinth Launcher",
-        "width": 1140
+        "width": 1140,
+        "minHeight": 630,
+        "minWidth": 1100
       }
     ]
   }
diff --git a/theseus_gui/src/App.vue b/theseus_gui/src/App.vue
index 8aa478030..22f5b1f80 100644
--- a/theseus_gui/src/App.vue
+++ b/theseus_gui/src/App.vue
@@ -32,33 +32,19 @@ watch(theme, (newState) => {
 
 <template>
   <div class="container">
-    <div class="navigation">
-      <div class="nav-container">
-        <section class="user-section">
-          <Avatar size="sm" src="https://cdn.modrinth.com/data/AANobbMI/icon.png" />
-          <section>
-            <p class="username">OreoViking</p>
-            <a href="#">Manage accounts</a>
-          </section>
-        </section>
+    <div class="nav-container">
+      <div class="nav-section">
+        <Avatar size="sm" src="https://cdn.modrinth.com/data/AANobbMI/icon.png" />
         <div class="pages-list">
-          <RouterLink to="/" class="btn"> <ClientIcon />Home</RouterLink>
-          <RouterLink to="/browse" class="btn"> <SearchIcon />Browse</RouterLink>
-          <RouterLink to="/library" class="btn"> <BookIcon />Library</RouterLink>
-        </div>
-        <div class="instance-list">
-          <p>Instances</p>
-          <Instance v-for="instance in instances.instances" display="list" :instance="instance" />
-        </div>
-        <Button class="add-instance-btn">
-          <PlusIcon />
-          Create Instance
-        </Button>
-
-        <div class="settings">
-          <RouterLink to="/settings" class="btn"><SettingsIcon /> Settings</RouterLink>
+          <RouterLink to="/" class="button-base nav-button"><ClientIcon /></RouterLink>
+          <RouterLink to="/browse" class="button-base nav-button"> <SearchIcon /></RouterLink>
+          <RouterLink to="/library" class="button-base nav-button"> <BookIcon /></RouterLink>
+          <button color="primary" class="button-base primary nav-button" icon-only><PlusIcon /></button>
         </div>
       </div>
+      <div class="settings pages-list">
+        <RouterLink to="/settings" class="button-base nav-button"><SettingsIcon /></RouterLink>
+      </div>
     </div>
     <div class="view">
       <div class="appbar">
@@ -72,34 +58,42 @@ watch(theme, (newState) => {
           <p>123 mods installed</p>
         </section>
       </div>
-      <RouterView />
+      <div class="router-view">
+        <RouterView />
+      </div>
     </div>
   </div>
 </template>
 
 <style lang="scss" scoped>
 .container {
-  min-width: 100%;
-  min-height: 100vh;
-  overflow-x: hidden;
+  height: 100vh;
+  display: flex;
+  flex-direction: row;
+  overflow: hidden;
 
-  .navigation {
-    position: fixed;
+  .router-view {
+    width: 100%;
+    height: calc(100% - 2rem);
+    overflow: auto;
+    overflow-x: hidden;
+    margin-top: 2rem;
   }
 
   .view {
-    height: 100%;
-    margin-left: 210px;
-
+    margin-left: 5rem;
+    width: calc(100% - 5rem);
+    height: calc(100%);
     .appbar {
+      position: absolute;
       display: flex;
       justify-content: space-between;
       align-items: center;
-      width: 100%;
-      height: 30px;
+      height: 2rem;
+      width: calc(100% - 5rem);
       border-bottom: 1px solid rgba(64, 67, 74, 0.2);
       background: var(--color-button-bg);
-      padding: 1.2rem;
+      text-align: center;
 
       .navigation-controls {
         display: inherit;
@@ -149,12 +143,14 @@ watch(theme, (newState) => {
 }
 
 .nav-container {
+  position: absolute;
   display: flex;
   flex-direction: column;
   align-items: center;
-  width: 210px;
-  height: 100vh;
+  justify-content: space-between;
+  height: 100%;
   box-shadow: var(--shadow-inset-sm), var(--shadow-floating);
+  padding: 1rem;
 }
 
 .dark-mode {
@@ -162,28 +158,27 @@ watch(theme, (newState) => {
     background: var(--color-bg);
   }
 }
+
 .pages-list {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: flex-start;
   width: 100%;
+  gap: 0.5rem;
 
   a {
     display: flex;
     align-items: center;
-    width: 80%;
-    margin: 0.2rem auto;
-    text-align: left;
     font-size: 0.9rem;
     font-weight: 400;
     word-spacing: 3px;
     background: inherit;
     transition: all ease-in-out 0.1s;
-    color: var(--color-primary);
+    color: var(--color-base);
 
     &.router-link-active {
-      color: #000;
+      color: var(--color-accent-contrast);
       background: var(--color-button-bg);
     }
 
@@ -193,12 +188,25 @@ watch(theme, (newState) => {
       box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
       text-decoration: none;
     }
+  }
+}
 
-    svg {
-      margin-right: 1rem;
-      width: 1.2rem;
-      height: 1.2rem;
-    }
+.nav-button {
+  height: 3rem;
+  width: 3rem;
+  padding: .75rem;
+  border-radius: var(--radius-md);
+
+  svg {
+    width: 1.5rem;
+    height: 1.5rem;
+    max-width: 1.5rem;
+    max-height: 1.5rem;
+  }
+
+  &.primary {
+    color: var(--color-accent-contrast);
+    background-color: var(--color-brand);
   }
 }
 
@@ -246,19 +254,12 @@ watch(theme, (newState) => {
 }
 
 .settings {
-  display: flex;
-  align-items: center;
-  margin: auto auto 0.5rem 1rem;
-  width: 9.375rem;
-
   a {
     display: flex;
-    background: inherit;
-    color: var(--color-primary);
-
-    svg {
-      margin-right: 0.9em;
-    }
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: center;
+    gap: 1rem;
 
     &:hover {
       text-decoration: none;
@@ -272,7 +273,6 @@ watch(theme, (newState) => {
   align-items: center;
   width: 100%;
   height: 4.375rem;
-  margin-left: 3rem;
 
   section {
     display: flex;
@@ -296,4 +296,14 @@ watch(theme, (newState) => {
     color: var(--color-secondary);
   }
 }
+
+.nav-section {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  gap: 1rem;
+}
 </style>
diff --git a/theseus_gui/src/assets/icons/folder-open.svg b/theseus_gui/src/assets/icons/folder-open.svg
new file mode 100644
index 000000000..53f88f92c
--- /dev/null
+++ b/theseus_gui/src/assets/icons/folder-open.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+  <path d="m6 14 1.45-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.55 6a2 2 0 0 1-1.94 1.5H4a2 2 0 0 1-2-2V5c0-1.1.9-2 2-2h3.93a2 2 0 0 1 1.66.9l.82 1.2a2 2 0 0 0 1.66.9H18a2 2 0 0 1 2 2v2"></path>
+
+</svg>
\ No newline at end of file
diff --git a/theseus_gui/src/assets/icons/folder-search.svg b/theseus_gui/src/assets/icons/folder-search.svg
new file mode 100644
index 000000000..7737ed611
--- /dev/null
+++ b/theseus_gui/src/assets/icons/folder-search.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+  <path d="M11 20H4a2 2 0 0 1-2-2V5c0-1.1.9-2 2-2h3.93a2 2 0 0 1 1.66.9l.82 1.2a2 2 0 0 0 1.66.9H20a2 2 0 0 1 2 2v4"></path>
+  <circle cx="17" cy="17" r="3"></circle>
+  <path d="m21 21-1.5-1.5"></path>
+
+</svg>
\ No newline at end of file
diff --git a/theseus_gui/src/assets/icons/index.js b/theseus_gui/src/assets/icons/index.js
new file mode 100644
index 000000000..6f4dbb10d
--- /dev/null
+++ b/theseus_gui/src/assets/icons/index.js
@@ -0,0 +1,3 @@
+export { default as PlayIcon } from './play.svg'
+export { default as OpenFolderIcon } from './folder-open.svg'
+export { default as BrowseIcon } from './folder-search.svg'
\ No newline at end of file
diff --git a/theseus_gui/src/assets/icons/play.svg b/theseus_gui/src/assets/icons/play.svg
new file mode 100644
index 000000000..3dc33cb08
--- /dev/null
+++ b/theseus_gui/src/assets/icons/play.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+  <polygon points="5 3 19 12 5 21 5 3"></polygon>
+
+</svg>
\ No newline at end of file
diff --git a/theseus_gui/src/components/GridDisplay.vue b/theseus_gui/src/components/GridDisplay.vue
new file mode 100644
index 000000000..1aab9f5b0
--- /dev/null
+++ b/theseus_gui/src/components/GridDisplay.vue
@@ -0,0 +1,132 @@
+<script setup>
+import {ChevronLeftIcon, ChevronRightIcon} from 'omorphia'
+import Instance from '@/components/ui/Instance.vue'
+import News from '@/components/ui/News.vue'
+import {onMounted, onUnmounted, ref} from 'vue'
+
+const props = defineProps({
+  instances: Array,
+  news: Array,
+  label: String,
+  canPaginate: Boolean,
+})
+const allowPagination = ref(false)
+const modsRow = ref(null)
+const newsRow = ref(null)
+// Remove after state is populated with real data
+const shouldRenderNormalInstances = props.instances && props.instances?.length !== 0
+const shouldRenderNews = props.news && props.news?.length !== 0
+onUnmounted(() => {
+  if (props.canPaginate) window.removeEventListener('resize', handlePaginationDisplay)
+})
+const handleLeftPage = () => {
+  if (shouldRenderNormalInstances) modsRow.value.scrollLeft -= 170
+  else if (shouldRenderNews) newsRow.value.scrollLeft -= 170
+}
+const handleRightPage = () => {
+  if (shouldRenderNormalInstances) modsRow.value.scrollLeft += 170
+  else if (shouldRenderNews) newsRow.value.scrollLeft += 170
+}
+</script>
+<template>
+  <div class="row">
+    <div class="header">
+      <p>{{ props.label }}</p>
+      <hr>
+      <div v-if="allowPagination" class="pagination">
+        <ChevronLeftIcon @click="handleLeftPage"/>
+        <ChevronRightIcon @click="handleRightPage"/>
+      </div>
+    </div>
+    <section ref="modsRow" class="instances">
+      <Instance
+        v-for="instance in props.instances"
+        :key="instance.id"
+        display="card"
+        :instance="instance"
+      />
+    </section>
+  </div>
+</template>
+<style lang="scss" scoped>
+.row {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 100%;
+  padding: 1rem;
+
+  .header {
+    display: flex;
+    justify-content: space-between;
+    align-items: inherit;
+    width: 100%;
+    margin-bottom: 1rem;
+    gap: 1rem;
+
+    p {
+      font-size: 1rem;
+      white-space: nowrap;
+      color: var(--color-contrast);
+    }
+
+    hr {
+      background-color: var(--color-gray);
+      height: 1px;
+      width: 100%;
+      border: none;
+    }
+
+    .pagination {
+      display: inherit;
+      align-items: inherit;
+
+      svg {
+        background: var(--color-raised-bg);
+        border-radius: var(--radius-lg);
+        width: 1.3rem;
+        height: 1.2rem;
+        cursor: pointer;
+        margin-right: 0.5rem;
+        transition: all ease-in-out 0.1s;
+
+        &:hover {
+          filter: brightness(150%);
+        }
+      }
+    }
+  }
+
+  section {
+    display: flex;
+    align-items: inherit;
+    transition: all ease-in-out 0.4s;
+    gap: 1rem;
+  }
+
+  .instances {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
+    width: 100%;
+    gap: 1rem;
+    margin-right: auto;
+    margin-top: 0.8rem;
+    scroll-behavior: smooth;
+    overflow-x: scroll;
+    overflow-y: hidden;
+
+    &::-webkit-scrollbar {
+      width: 0px;
+      background: transparent;
+    }
+  }
+}
+
+.dark-mode {
+  .row {
+    &:nth-child(odd) {
+      background-color: rgb(30, 31, 34);
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/theseus_gui/src/components/RowDisplay.vue b/theseus_gui/src/components/RowDisplay.vue
index a148b1167..8e9816e45 100644
--- a/theseus_gui/src/components/RowDisplay.vue
+++ b/theseus_gui/src/components/RowDisplay.vue
@@ -1,8 +1,8 @@
 <script setup>
-import { ChevronLeftIcon, ChevronRightIcon } from 'omorphia'
+import {ChevronLeftIcon, ChevronRightIcon} from 'omorphia'
 import Instance from '@/components/ui/Instance.vue'
 import News from '@/components/ui/News.vue'
-import { onMounted, onUnmounted, ref } from 'vue'
+import {onMounted, onUnmounted, ref} from 'vue'
 
 const props = defineProps({
   instances: Array,
@@ -10,76 +10,64 @@ const props = defineProps({
   label: String,
   canPaginate: Boolean,
 })
-
 const allowPagination = ref(false)
 const modsRow = ref(null)
 const newsRow = ref(null)
-
 // Remove after state is populated with real data
 const shouldRenderNormalInstances = props.instances && props.instances?.length !== 0
 const shouldRenderNews = props.news && props.news?.length !== 0
-
 const handlePaginationDisplay = () => {
   let parentsRow
   if (shouldRenderNormalInstances) parentsRow = modsRow.value
   if (shouldRenderNews) parentsRow = newsRow.value
-
   if (!parentsRow) return
-
   const children = parentsRow.children
   const lastChild = children[children.length - 1]
   const childBox = lastChild.getBoundingClientRect()
-
   if (childBox.x + childBox.width > window.innerWidth) allowPagination.value = true
   else allowPagination.value = false
 }
-
 onMounted(() => {
   if (props.canPaginate) window.addEventListener('resize', handlePaginationDisplay)
-
   // Check if pagination should be rendered on mount
   handlePaginationDisplay()
 })
-
 onUnmounted(() => {
   if (props.canPaginate) window.removeEventListener('resize', handlePaginationDisplay)
 })
-
 const handleLeftPage = () => {
   if (shouldRenderNormalInstances) modsRow.value.scrollLeft -= 170
   else if (shouldRenderNews) newsRow.value.scrollLeft -= 170
 }
-
 const handleRightPage = () => {
   if (shouldRenderNormalInstances) modsRow.value.scrollLeft += 170
   else if (shouldRenderNews) newsRow.value.scrollLeft += 170
 }
 </script>
-
 <template>
   <div class="row">
     <div class="header">
       <p>{{ props.label }}</p>
-      <hr aria-hidden="true" />
+      <hr aria-hidden="true"/>
       <div v-if="allowPagination" class="pagination">
-        <ChevronLeftIcon @click="handleLeftPage" />
-        <ChevronRightIcon @click="handleRightPage" />
+        <ChevronLeftIcon @click="handleLeftPage"/>
+        <ChevronRightIcon @click="handleRightPage"/>
       </div>
     </div>
     <section ref="modsRow" class="instances" v-if="shouldRenderNormalInstances">
       <Instance
-        v-for="instance in props.instances"
-        :key="instance.id"
-        display="card"
-        :instance="instance"
+          v-for="instance in props.instances"
+          :key="instance.id"
+          display="card"
+          :instance="instance"
+          class="row-instance"
       />
     </section>
     <section ref="newsRow" class="news" v-else-if="shouldRenderNews">
-      <News v-for="news in props.news" :key="news.id" :news="news" />
+      <News v-for="news in props.news" :key="news.id" :news="news"/>
     </section>
   </div>
 </template>
-
 <style lang="scss" scoped>
 .row {
   display: flex;
@@ -161,7 +149,6 @@ const handleRightPage = () => {
     margin-right: auto;
     margin-top: 0.8rem;
     scroll-behavior: smooth;
-
     overflow-x: scroll;
     overflow-y: hidden;
 
@@ -179,4 +166,9 @@ const handleRightPage = () => {
     }
   }
 }
-</style>
+
+.row-instance {
+  min-width: 12rem;
+  max-width: 12rem;
+}
+</style>
\ No newline at end of file
diff --git a/theseus_gui/src/components/ui/Instance.vue b/theseus_gui/src/components/ui/Instance.vue
index eb69ef6a7..c5cb4c2f1 100644
--- a/theseus_gui/src/components/ui/Instance.vue
+++ b/theseus_gui/src/components/ui/Instance.vue
@@ -1,7 +1,7 @@
 <script setup>
 import { RouterLink } from 'vue-router'
-import { Card, PlusIcon } from 'omorphia'
-
+import { Card } from 'omorphia'
+import { PlayIcon } from '@/assets/icons'
 const props = defineProps({
   display: String,
   instance: Object,
@@ -10,16 +10,16 @@ const props = defineProps({
 
 <template>
   <div>
-    <RouterLink v-if="display === 'list'" class="instance-list-item" :to="`${props.instance.id}`">{{
-      props.instance.name
-    }}</RouterLink>
-    <Card class="instance-card-item" v-else-if="display === 'card'">
+    <RouterLink v-if="display === 'list'" class="instance-list-item" :to="`/instance/${props.instance.id}`">{{
+        props.instance.name
+      }}</RouterLink>
+    <Card class="instance-card-item" v-else-if="display === 'card'" @click="this.$router.push(`/instance/${props.instance.id}`)">
       <img :src="props.instance.img" alt="Trending mod card" />
       <div class="project-info">
         <p class="title">{{ props.instance.name }}</p>
         <p class="description">{{ props.instance.version }}</p>
       </div>
-      <div class="cta"><PlusIcon /></div>
+      <div class="cta"><PlayIcon /></div>
     </Card>
   </div>
 </template>
@@ -32,32 +32,26 @@ const props = defineProps({
   transition: all ease-out 0.1s;
   font-size: 0.8rem;
   color: var(--color-primary);
-
   &:hover {
     text-decoration: none;
     filter: brightness(150%);
   }
 }
-
 .instance-card-item {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   cursor: pointer;
-  width: 180px;
   padding: 0.75rem;
   transition: 0.1s ease-in-out all;
-
   &:hover {
     filter: brightness(0.85);
-
     .cta {
       opacity: 1;
       bottom: 4.5rem;
     }
   }
-
   .cta {
     position: absolute;
     display: flex;
@@ -72,27 +66,24 @@ const props = defineProps({
     opacity: 0;
     transition: 0.3s ease-in-out bottom, 0.1s ease-in-out opacity;
     cursor: pointer;
-
     svg {
       color: #fff;
+      width: 1.5rem;
+      height: 1.5rem;
     }
-
     &:hover {
       filter: brightness(0.75);
       box-shadow: var(--shadow-floating);
     }
   }
-
   img {
-    width: 160px;
+    width: 100%;
     border-radius: var(--radius-sm);
     filter: none !important;
   }
-
   .project-info {
     margin-top: 1rem;
     width: 100%;
-
     .title {
       color: var(--color-contrast);
       max-width: 6rem;
@@ -105,7 +96,6 @@ const props = defineProps({
       line-height: 110%;
       display: inline-block;
     }
-
     .description {
       display: -webkit-box;
       -webkit-line-clamp: 2;
@@ -118,10 +108,9 @@ const props = defineProps({
     }
   }
 }
-
 .dark-mode {
   .cta > svg {
     color: #000;
   }
 }
-</style>
+</style>
\ No newline at end of file
diff --git a/theseus_gui/src/components/ui/News.vue b/theseus_gui/src/components/ui/News.vue
index 080ce5f9c..dc7773f1c 100644
--- a/theseus_gui/src/components/ui/News.vue
+++ b/theseus_gui/src/components/ui/News.vue
@@ -1,6 +1,5 @@
 <script setup>
 import { Card, ChevronRightIcon } from 'omorphia'
-
 const props = defineProps({
   news: Object,
 })
@@ -33,59 +32,49 @@ const props = defineProps({
   box-shadow: var(--shadow-raised-lg);
   cursor: pointer;
   transition: all ease-in-out 0.1s;
-
   &:hover {
     box-shadow: var(--shadow-floating);
     filter: brightness(0.85);
   }
-
   img {
     display: flex;
     width: 8.4375rem; /* from wireframe */
     height: 8.5rem; /* from wireframe */
     border-radius: 0.9rem 0 0 0.9rem;
   }
-
   .body {
     display: flex;
     flex-direction: column;
     width: 100%;
     height: 8.5rem; /* from wireframe */
     padding: 0.45rem;
-
     .headline {
       display: inherit;
       flex-direction: inherit;
       margin: 0.4rem 0;
       width: 100%;
-
       h2 {
         font-size: 1rem;
         text-transform: uppercase;
       }
-
       p {
         font-size: 0.7rem;
       }
     }
-
     .underline {
       display: flex;
       justify-content: space-between;
       align-items: center;
       width: 100%;
       margin-top: auto;
-
       p {
         font-size: 0.7rem;
       }
-
       a {
         transition: all ease-in-out 0.2s;
         width: 1.5rem;
         color: var(--color-primary);
         font-size: 1.3rem;
-
         &:hover {
           transform: translate(1px);
           filter: brightness(150%);
@@ -94,4 +83,4 @@ const props = defineProps({
     }
   }
 }
-</style>
+</style>
\ No newline at end of file
diff --git a/theseus_gui/src/pages/AddInstance.vue b/theseus_gui/src/pages/AddInstance.vue
new file mode 100644
index 000000000..68d916608
--- /dev/null
+++ b/theseus_gui/src/pages/AddInstance.vue
@@ -0,0 +1,7 @@
+<script setup></script>
+
+<template>
+  <div>
+    <p>Add Instance</p>
+  </div>
+</template>
diff --git a/theseus_gui/src/pages/Library.vue b/theseus_gui/src/pages/Library.vue
index b5a136d09..832592057 100644
--- a/theseus_gui/src/pages/Library.vue
+++ b/theseus_gui/src/pages/Library.vue
@@ -1,7 +1,14 @@
-<script setup></script>
+<script setup>
+import { useInstances } from '@/store/state'
+import GridDisplay from '@/components/GridDisplay.vue'
+
+const instances = useInstances()
+instances.fetchInstances()
+</script>
 
 <template>
   <div>
-    <p>Library</p>
+    <GridDisplay label="Instances" :instances="instances.instances" />
+    <GridDisplay label="Modpacks" :instances="instances.instances" />
   </div>
 </template>
diff --git a/theseus_gui/src/pages/instance/Index.vue b/theseus_gui/src/pages/instance/Index.vue
new file mode 100644
index 000000000..745649d2c
--- /dev/null
+++ b/theseus_gui/src/pages/instance/Index.vue
@@ -0,0 +1,269 @@
+<template>
+  <div class="instance-container">
+    <div class="side-cards">
+      <Card class="instance-card">
+        <Avatar size="lg" :src="getInstance(instances).img"/>
+        <div class="instance-info">
+          <h2 class="name">{{getInstance(instances).name}}</h2>
+          Fabric {{ getInstance(instances).version }}
+        </div>
+        <span class="button-group">
+          <Button color="primary" class="instance-button">
+            <PlayIcon />
+            Play
+          </Button>
+          <Button class="instance-button" icon-only>
+            <OpenFolderIcon />
+          </Button>
+        </span>
+      </Card>
+      <div class="pages-list">
+        <RouterLink :to="`/instance/${this.$route.params.id}/`" class="btn">
+          <BoxIcon/>
+          Mods
+        </RouterLink>
+        <RouterLink :to="`/instance/${this.$route.params.id}/options`" class="btn">
+          <SettingsIcon/>
+          Options
+        </RouterLink>
+        <RouterLink :to="`/instance/${this.$route.params.id}/logs`" class="btn">
+          <FileIcon/>
+          Logs
+        </RouterLink>
+      </div>
+    </div>
+    <div class="content">
+      <Promotion />
+      <router-view/>
+    </div>
+  </div>
+</template>
+<script setup>
+import {BoxIcon, SettingsIcon, FileIcon, Button, Avatar, Card, Promotion} from 'omorphia'
+import {PlayIcon, OpenFolderIcon} from "@/assets/icons";
+import {useInstances} from '@/store/state'
+
+const instances = useInstances();
+instances.fetchInstances();
+</script>
+<script>
+export default {
+  methods: {
+    getInstance(instances) {
+      return instances.instances.find((i) => i.id === parseInt(this.$route.params.id));
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.instance-card {
+  background: var(--color-bg);
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  width: 15rem;
+}
+
+Button {
+  width: 100%;
+}
+
+.button-group {
+  display: flex;
+  flex-direction: row;
+  gap: 0.5rem;
+}
+
+.side-cards {
+  position: absolute;
+  display: flex;
+  flex-direction: column;
+  padding: 1rem;
+  background: var(--color-raised-bg);
+  min-height: calc(100% - 2rem);
+  overflow: hidden;
+}
+
+.instance-nav {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: center;
+  padding: 1rem;
+  gap: 0.5rem;
+  background: var(--color-raised-bg);
+  height: 100%;
+}
+
+.name {
+  font-size: 1.25rem;
+  color: var(--color-contrast);
+}
+
+.instance-container {
+  display: flex;
+  flex-direction: row;
+  overflow: auto;
+  gap: 1rem;
+}
+
+.content {
+  margin-left: 18rem;
+}
+
+.instance-info {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+}
+
+.badge {
+  display: flex;
+  align-items: center;
+  font-weight: bold;
+  width: fit-content;
+  color: var(--color-orange);
+}
+
+.pages-list {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+
+  a {
+    font-size: 100%;
+    font-weight: 400;
+    background: inherit;
+    transition: all ease-in-out 0.1s;
+    width: 100%;
+    color: var(--color-primary);
+    padding: var(--gap-md);
+
+    &.router-link-exact-active {
+      background: var(--color-button-bg);
+    }
+
+    &:hover {
+      background-color: var(--color-button-bg);
+      color: var(--color-contrast);
+      box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+      text-decoration: none;
+    }
+
+    svg {
+      width: 1.3rem;
+      height: 1.3rem;
+    }
+  }
+}
+
+.header-nav {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: center;
+  padding: 0.5rem;
+  gap: 0.5rem;
+  background: var(--color-raised-bg);
+}
+
+.project-card {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: center;
+  gap: 1rem;
+  background: var(--color-raised-bg);
+  width: 20rem;
+}
+
+.instance-nav {
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  justify-content: left;
+  padding: 1rem;
+  gap: 0.5rem;
+  background: var(--color-raised-bg);
+  height: min-content;
+  width: 100%;
+}
+
+.instance-button {
+  width: fit-content;
+}
+
+.actions {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  gap: 0.5rem;
+}
+
+.content {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  padding: 1rem 1rem 0 0;
+  overflow: auto;
+}
+
+.stats {
+  grid-area: stats;
+  display: flex;
+  flex-direction: column;
+  flex-wrap: wrap;
+  gap: var(--gap-md);
+
+  .stat {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    width: fit-content;
+    gap: var(--gap-xs);
+    --stat-strong-size: 1.25rem;
+
+    strong {
+      font-size: var(--stat-strong-size);
+    }
+
+    p {
+      margin: 0;
+    }
+
+    svg {
+      height: var(--stat-strong-size);
+      width: var(--stat-strong-size);
+    }
+  }
+
+  .date {
+    margin-top: auto;
+  }
+
+  @media screen and (max-width: 750px) {
+    flex-direction: row;
+    column-gap: var(--gap-md);
+    margin-top: var(--gap-xs);
+  }
+
+  @media screen and (max-width: 600px) {
+    margin-top: 0;
+
+    .stat-label {
+      display: none;
+    }
+  }
+}
+
+.card-divider {
+  background-color: var(--color-button-bg);
+  border: none;
+  color: var(--color-button-bg);
+  height: 1px;
+  margin: var(--gap-xl) 0;
+}
+</style>
\ No newline at end of file
diff --git a/theseus_gui/src/pages/instance/Logs.vue b/theseus_gui/src/pages/instance/Logs.vue
new file mode 100644
index 000000000..0ddcd5b0e
--- /dev/null
+++ b/theseus_gui/src/pages/instance/Logs.vue
@@ -0,0 +1,121 @@
+<template>
+  <Card class="log-card">
+    <div class="button-row">
+      <DropdownSelect :options="['logs/latest.log']" />
+      <div class="button-group">
+        <Button>
+          <ClipboardCopyIcon/>
+          Copy
+        </Button>
+        <Button color="primary">
+          <SendIcon/>
+          Share
+        </Button>
+        <Button color="danger">
+          <TrashIcon/>
+          Delete
+        </Button>
+      </div>
+    </div>
+    <div class="log-text">
+      <div v-for="line in fileContents.value.split('\n')"> {{ line }} </div>
+    </div>
+  </Card>
+</template>
+
+<script setup>
+import { Card, Button, TrashIcon, SendIcon, ClipboardCopyIcon, DropdownSelect } from 'omorphia'
+</script>
+<script>
+
+  export default {
+    data() {
+      return {
+        fileContents: {
+          value: "'ServerLevel[New World]'/minecraft:the_end\n" +
+              "[22:13:02] [Server thread/INFO]: venashial lost connection: Disconnected\n" +
+              "[22:13:02] [Server thread/INFO]: venashial left the game\n" +
+              "[22:13:02] [Server thread/INFO]: Stopping singleplayer server as player logged out\n" +
+              "[22:13:02] [Server thread/INFO]: Stopping server\n" +
+              "[22:13:02] [Server thread/INFO]: Saving players\n" +
+              "[22:13:02] [Server thread/INFO]: Saving worlds\n" +
+              "[22:13:02] [Server thread/INFO]: Saving chunks for level 'ServerLevel[New World]'/minecraft:overworld\n" +
+              "[22:13:05] [Server thread/INFO]: Saving chunks for level 'ServerLevel[New World]'/minecraft:the_nether\n" +
+              "[22:13:05] [Server thread/INFO]: Saving chunks for level 'ServerLevel[New World]'/minecraft:the_end\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage (New World): All chunks are saved\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage (DIM-1): All chunks are saved\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage (DIM1): All chunks are saved\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage: All dimensions are saved\n" +
+              "[22:13:06] [Render thread/INFO]: Stopping worker threads\n" +
+              "[22:13:07] [Render thread/INFO]: Stopping!\n" +
+              "[22:13:07] [CraftPresence-ShutDown-Handler/INFO]: Shutting down CraftPresence...\n" +
+              "'ServerLevel[New World]'/minecraft:the_end\n" +
+              "[22:13:02] [Server thread/INFO]: venashial lost connection: Disconnected\n" +
+              "[22:13:02] [Server thread/INFO]: venashial left the game\n" +
+              "[22:13:02] [Server thread/INFO]: Stopping singleplayer server as player logged out\n" +
+              "[22:13:02] [Server thread/INFO]: Stopping server\n" +
+              "[22:13:02] [Server thread/INFO]: Saving players\n" +
+              "[22:13:02] [Server thread/INFO]: Saving worlds\n" +
+              "[22:13:02] [Server thread/INFO]: Saving chunks for level 'ServerLevel[New World]'/minecraft:overworld\n" +
+              "[22:13:05] [Server thread/INFO]: Saving chunks for level 'ServerLevel[New World]'/minecraft:the_nether\n" +
+              "[22:13:05] [Server thread/INFO]: Saving chunks for level 'ServerLevel[New World]'/minecraft:the_end\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage (New World): All chunks are saved\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage (DIM-1): All chunks are saved\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage (DIM1): All chunks are saved\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage: All dimensions are saved\n" +
+              "[22:13:06] [Render thread/INFO]: Stopping worker threads\n" +
+              "[22:13:07] [Render thread/INFO]: Stopping!\n" +
+              "[22:13:07] [CraftPresence-ShutDown-Handler/INFO]: Shutting down CraftPresence...\n" +
+              "'ServerLevel[New World]'/minecraft:the_end\n" +
+              "[22:13:02] [Server thread/INFO]: venashial lost connection: Disconnected\n" +
+              "[22:13:02] [Server thread/INFO]: venashial left the game\n" +
+              "[22:13:02] [Server thread/INFO]: Stopping singleplayer server as player logged out\n" +
+              "[22:13:02] [Server thread/INFO]: Stopping server\n" +
+              "[22:13:02] [Server thread/INFO]: Saving players\n" +
+              "[22:13:02] [Server thread/INFO]: Saving worlds\n" +
+              "[22:13:02] [Server thread/INFO]: Saving chunks for level 'ServerLevel[New World]'/minecraft:overworld\n" +
+              "[22:13:05] [Server thread/INFO]: Saving chunks for level 'ServerLevel[New World]'/minecraft:the_nether\n" +
+              "[22:13:05] [Server thread/INFO]: Saving chunks for level 'ServerLevel[New World]'/minecraft:the_end\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage (New World): All chunks are saved\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage (DIM-1): All chunks are saved\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage (DIM1): All chunks are saved\n" +
+              "[22:13:05] [Server thread/INFO]: ThreadedAnvilChunkStorage: All dimensions are saved\n" +
+              "[22:13:06] [Render thread/INFO]: Stopping worker threads\n" +
+              "[22:13:07] [Render thread/INFO]: Stopping!\n" +
+              "[22:13:07] [CraftPresence-ShutDown-Handler/INFO]: Shutting down CraftPresence..."
+        }
+      };
+    }
+  };
+</script>
+
+<style scoped lang="scss">
+.log-card {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+.button-row {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+
+.button-group {
+  display: flex;
+  flex-direction: row;
+  gap: 0.5rem;
+}
+
+.log-text {
+  width: 100%;
+  aspect-ratio: 2/1;
+  font-family: var(--mono-font);
+  background-color: var(--color-accent-contrast);
+  color: var(--color-contrast);
+  border-radius: var(--radius-lg);
+  padding: 1.5rem;
+  overflow: auto;
+  white-space: normal;
+}
+</style>
\ No newline at end of file
diff --git a/theseus_gui/src/pages/instance/Mods.vue b/theseus_gui/src/pages/instance/Mods.vue
new file mode 100644
index 000000000..14ee3e056
--- /dev/null
+++ b/theseus_gui/src/pages/instance/Mods.vue
@@ -0,0 +1,247 @@
+<template>
+  <Card class="mod-card">
+    <div class="card-row">
+      <div class="iconified-input">
+        <SearchIcon/>
+        <input
+          type="text"
+          placeholder="Search Mods"
+          v-model="searchFilter"
+        />
+      </div>
+      <span class="manage">
+        <span class="text-combo">
+          Sort By
+          <DropdownSelect :options="['Name', 'Version', 'Author']" v-model="sortFilter" default-value="Name" class="dropdown"/>
+        </span>
+        <Button color="primary">
+        <PlusIcon />
+        Add Mods
+      </Button>
+      </span>
+    </div>
+    <div class="table-container">
+      <div class="table-row table-head">
+        <div class="table-cell table-text">
+          <Button color="success" iconOnly>
+            <UpdatedIcon />
+          </Button>
+        </div>
+        <div class="table-cell table-text name-cell"> Name </div>
+        <div class="table-cell table-text"> Version </div>
+        <div class="table-cell table-text"> Author </div>
+        <div class="table-cell table-text"> Actions </div>
+      </div>
+      <div class="table-row" v-for="mod in search" :key="mod.name">
+        <div class="table-cell table-text">
+          <Button v-if="mod.outdated" iconOnly>
+            <UpdatedIcon />
+          </Button>
+          <Button v-else disabled iconOnly>
+            <CheckCircleIcon/>
+          </Button>
+        </div>
+        <div class="table-cell table-text name-cell">
+          <span class="mod-text">
+            <Avatar :src="mod.icon"/>
+            {{ mod.name }}
+          </span>
+        </div>
+        <div class="table-cell table-text"> {{ mod.version }} </div>
+        <div class="table-cell table-text"> {{ mod.author }} </div>
+        <div class="table-cell table-text manage">
+          <Button iconOnly>
+            <TrashIcon />
+          </Button>
+          <input
+            type="checkbox"
+            class="switch stylized-toggle"
+            id="switch-1"
+            checked
+          />
+        </div>
+      </div>
+    </div>
+  </Card>
+</template>
+
+<script>
+export default {
+  name: "Mods",
+  data() {
+    return {
+      searchFilter: "",
+      sortFilter: "",
+      mods: [
+        {
+          name: "Fabric API",
+          icon: "https://cdn.modrinth.com/data/P7dR8mSH/icon.png",
+          version: "0.76.0+1.19.4",
+          author: "modmuss50",
+          description: "Lightweight and modular API providing common hooks and intercompatibility measures utilized by mods using the Fabric toolchain.",
+          outdated: true
+        },
+        {
+          name: "Spirit",
+          icon: "https://cdn.modrinth.com/data/b1LdOZlE/465598dc5d89f67fb8f8de6def21240fa35e3a54.png",
+          version: "2.2.4",
+          author: "CodexAdrian",
+          description: "Create your own configurable mob spawner!",
+          outdated: true
+        },
+        {
+          name: "Botarium",
+          icon: "https://cdn.modrinth.com/data/2u6LRnMa/98b286b0d541ad4f9409e0af3df82ad09403f179.gif",
+          version: "2.0.5",
+          author: "CodexAdrian",
+          description: "A crossplatform API for devs that makes transfer and storage of items, fluids and energy easier, as well as some other helpful things",
+          outdated: true
+        },
+        {
+          name: "Tempad",
+          icon: "https://cdn.modrinth.com/data/gKNwt7xu/icon.gif",
+          version: "2.2.4",
+          author: "CodexAdrian",
+          description: "Create a portal to anywhere from anywhere",
+          outdated: false
+        },
+        {
+          name: "Sodium",
+          icon: "https://cdn.modrinth.com/data/AANobbMI/icon.png",
+          version: "0.4.10",
+          author: "jellysquid3",
+          description: "Modern rendering engine and client-side optimization mod for Minecraft",
+          outdated: false
+        }
+      ]
+    }
+  },
+  methods: {
+    updateSort(projects, sort) {
+      switch (sort) {
+        case 'Version':
+          return projects.slice().sort((a, b) => {
+            if (a.version < b.version) {
+              return -1
+            }
+            if (a.version > b.version) {
+              return 1
+            }
+            return 0
+          })
+        case 'Author':
+          return projects.slice().sort((a, b) => {
+            if (a.author < b.author) {
+              return -1
+            }
+            if (a.author > b.author) {
+              return 1
+            }
+            return 0
+          })
+        default:
+          return projects.slice().sort((a, b) => {
+            if (a.name < b.name) {
+              return -1
+            }
+            if (a.name > b.name) {
+              return 1
+            }
+            return 0
+        })
+      }
+    },
+  },
+  computed: {
+    search() {
+      const filtered = this.mods.filter((mod) => {
+        return mod.name.toLowerCase().includes(this.searchFilter.toLowerCase())
+      })
+
+      return this.updateSort(filtered, this.sortFilter);
+    }
+  }
+}
+</script>
+<script setup>
+import { Avatar, Button, TrashIcon, PlusIcon, Card, CheckCircleIcon, SearchIcon, UpdatedIcon, DropdownSelect } from 'omorphia'
+</script>
+
+<style scoped lang="scss">
+.table-container {
+  display: grid;
+  grid-template-rows: repeat(auto-fill, auto);
+  width: 100%;
+  border-radius: var(--radius-md);
+  overflow: hidden;
+}
+
+.table-row {
+  display: grid;
+  grid-template-columns: min-content 2fr 1fr 1fr 8rem;
+}
+
+.table-head {
+  .table-cell {
+    background-color: var(--color-accent-contrast);
+  }
+}
+
+.table-cell {
+  padding: 1rem;
+  height: 100%;
+  align-items: center;
+  vertical-align: center;
+  display: flex;
+}
+
+.table-text {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: fade;
+}
+
+.manage {
+  display: flex;
+  gap: 0.5rem;
+}
+
+.mod-text {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  color: var(--color-contrast);
+}
+
+.table-row:nth-child(even) .table-cell {
+  background-color: var(--color-bg);
+}
+
+.card-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  background-color: var(--color-raised-bg);
+}
+
+.mod-card {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  overflow: hidden;
+}
+
+.text-combo {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.name-cell {
+  padding-left: 0;
+}
+
+.dropdown {
+  width: 7rem !important;
+}
+</style>
\ No newline at end of file
diff --git a/theseus_gui/src/pages/instance/Options.vue b/theseus_gui/src/pages/instance/Options.vue
new file mode 100644
index 000000000..5ddda4cd2
--- /dev/null
+++ b/theseus_gui/src/pages/instance/Options.vue
@@ -0,0 +1,230 @@
+<template>
+  <Card class="settings-card">
+    <h2 class="settings-title"> Java </h2>
+    <div class="settings-group">
+      <h3>Installation</h3>
+      <input
+          type="text"
+          class="input installation-input"
+          placeholder="/Library/Java/JavaVirtualMachines/zulu-17.jdk/Contents/Home"
+          ref="javaPath"
+          v-model="javaPath"
+      />
+      <span class="installation-buttons">
+          <Button @click="saveJavaPath">
+            <SearchIcon/>
+            Auto Detect
+          </Button>
+          <Button @click="saveJavaPath">
+            <BrowseIcon/>
+            Browse
+          </Button>
+          <Button @click="saveJavaPath">
+            <PlayIcon/>
+            Test
+          </Button>
+        </span>
+    </div>
+    <hr class="card-divider">
+    <div class="settings-group">
+      <h3>Arguments</h3>
+      <input
+          type="text"
+          class="input installation-input"
+          ref="javaArgs"
+          v-model="javaArgs"
+      />
+    </div>
+    <hr class="card-divider">
+    <div class="settings-group">
+      <div class="sliders">
+          <span class="slider">
+            Minimum Memory
+            <Slider
+                v-model="javaMemory"
+                :min="1024"
+                :max="8192"
+                :step="1024"
+            />
+          </span>
+        <span class="slider">
+            Maximum Memory
+            <Slider
+                v-model="javaMemory"
+                :min="1024"
+                :max="8192"
+                :step="1024"
+            />
+          </span>
+      </div>
+    </div>
+  </Card>
+  <Card class="settings-card">
+    <h2 class="settings-title"> Window </h2>
+    <div class="settings-group">
+      <div class="settings-group">
+        <div class="sliders">
+          <span class="slider">
+            Width
+            <Slider
+                v-model="javaMemory"
+                :min="1024"
+                :max="8192"
+                :step="1024"
+            />
+          </span>
+          <span class="slider">
+            Height
+            <Slider
+                v-model="javaMemory"
+                :min="1024"
+                :max="8192"
+                :step="1024"
+            />
+          </span>
+        </div>
+        <div class="toggle-setting">
+          Start in Fullscreen
+          <input
+              type="checkbox"
+              id="fullscreen"
+              name="fullscreen"
+              v-model="fullscreen"
+              class="switch stylized-toggle"
+          />
+        </div>
+      </div>
+      <hr class="card-divider">
+      <div class="settings-group">
+        <h3>Console</h3>
+        <div class="toggle-setting">
+          Show console while game is running
+          <input
+              type="checkbox"
+              id="fullscreen"
+              name="fullscreen"
+              v-model="fullscreen"
+              class="switch stylized-toggle"
+          />
+        </div>
+        <div class="toggle-setting">
+          Close console when game quits
+          <input
+              type="checkbox"
+              id="fullscreen"
+              name="fullscreen"
+              v-model="fullscreen"
+              class="switch stylized-toggle"
+          />
+        </div>
+        <div class="toggle-setting">
+          Show console when game crashes
+          <input
+              type="checkbox"
+              id="fullscreen"
+              name="fullscreen"
+              v-model="fullscreen"
+              class="switch stylized-toggle"
+          />
+        </div>
+      </div>
+    </div>
+  </Card>
+  <Card class="settings-card">
+    <h2 class="settings-title"> Commands </h2>
+    <div class="settings-group">
+      <div class="toggle-setting">
+        Pre Launch
+        <input
+            type="text"
+            class="input"
+            ref="javaArgs"
+            v-model="javaArgs"
+        />
+      </div>
+      <div class="toggle-setting">
+        Wrapper
+        <input
+            type="text"
+            class="input"
+            ref="javaArgs"
+            v-model="javaArgs"
+        />
+      </div>
+      <div class="toggle-setting">
+        Post Launch
+        <input
+            type="text"
+            class="input"
+            ref="javaArgs"
+            v-model="javaArgs"
+        />
+      </div>
+    </div>
+  </Card>
+</template>
+
+<script setup>
+import {Card, Button, SearchIcon, Slider } from 'omorphia'
+import {BrowseIcon, PlayIcon} from "@/assets/icons";
+</script>
+
+<style scoped lang="scss">
+.settings-card {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.settings-title {
+  color: var(--color-contrast)
+}
+
+.settings-group {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+}
+
+.installation-input {
+  width: 100%;
+}
+
+.installation-buttons {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: .5rem;
+  margin: 0;
+
+}
+
+.sliders {
+  display: flex;
+  flex-wrap: wrap;
+  flex-direction: row;
+  gap: 1rem;
+  width: 100%;
+
+  .slider {
+    flex-grow: 1;
+  }
+}
+
+.toggle-setting {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.card-divider {
+  background-color: var(--color-button-bg);
+  border: none;
+  color: var(--color-button-bg);
+  height: 1px;
+  margin: var(--gap-sm) 0;
+}
+</style>
diff --git a/theseus_gui/src/pages/instance/index.js b/theseus_gui/src/pages/instance/index.js
new file mode 100644
index 000000000..4fc643a26
--- /dev/null
+++ b/theseus_gui/src/pages/instance/index.js
@@ -0,0 +1,6 @@
+import Index from './Index.vue'
+import Mods from "./Mods.vue";
+import Options from "./Options.vue";
+import Logs from "./Logs.vue";
+
+export { Index, Mods, Options, Logs }
\ No newline at end of file
diff --git a/theseus_gui/src/pages/instances/Instance.vue b/theseus_gui/src/pages/instances/Instance.vue
deleted file mode 100644
index b480dbdab..000000000
--- a/theseus_gui/src/pages/instances/Instance.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<script setup>
-import { useRoute } from 'vue-router'
-
-const route = useRoute()
-
-console.log(route.path)
-</script>
-
-<template>
-  <div>
-    AAAAAH
-    {{ route.params.name }}
-  </div>
-</template>
diff --git a/theseus_gui/src/routes.js b/theseus_gui/src/routes.js
index 2718bf2fb..a87bae77f 100644
--- a/theseus_gui/src/routes.js
+++ b/theseus_gui/src/routes.js
@@ -1,5 +1,6 @@
 import { createRouter, createWebHistory } from 'vue-router'
 import * as Pages from '@/pages'
+import * as Instance from '@/pages/instance'
 
 /**
  * Configures application routing. Add page to pages/index and then add to route table here.
@@ -22,6 +23,11 @@ export default new createRouter({
       name: 'Library',
       component: Pages.Library,
     },
+    {
+      path: '/add-instance',
+      name: 'Add Instance',
+      component: Pages.AddInstance,
+    },
     {
       path: '/project',
       name: 'Project',
@@ -32,6 +38,29 @@ export default new createRouter({
       name: 'Settings',
       component: Pages.Settings,
     },
+    {
+      path: '/instance/:id',
+      name: 'Instance',
+      component: Instance.Index,
+      props: true,
+      children: [
+        {
+            path: '',
+            name: 'Mods',
+            component: Instance.Mods,
+        },
+        {
+          path: 'options',
+          name: 'Options',
+          component: Instance.Options,
+        },
+        {
+          path: 'logs',
+          name: 'Logs',
+          component: Instance.Logs,
+        }
+      ]
+    }
   ],
   linkActiveClass: 'router-link-active',
   linkExactActiveClass: 'router-link-exact-active',
diff --git a/theseus_gui/vite.config.js b/theseus_gui/vite.config.js
index 694912473..ca2c6083c 100644
--- a/theseus_gui/vite.config.js
+++ b/theseus_gui/vite.config.js
@@ -2,6 +2,7 @@ import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import alias from '@rollup/plugin-alias'
 import { resolve } from 'path'
+import svgLoader from "vite-svg-loader";
 
 const projectRootDir = resolve(__dirname)
 
@@ -17,6 +18,20 @@ export default defineConfig({
         },
       ],
     }),
+    svgLoader({
+      svgoConfig: {
+        plugins: [
+          {
+            name: 'preset-default',
+            params: {
+              overrides: {
+                removeViewBox: false,
+              },
+            },
+          },
+        ],
+      },
+    }),
   ],
 
   // Vite options tailored for Tauri development and only applied in `tauri dev` or `tauri build`
diff --git a/theseus_gui/yarn.lock b/theseus_gui/yarn.lock
index 5b34cc219..a40f7b38f 100644
--- a/theseus_gui/yarn.lock
+++ b/theseus_gui/yarn.lock
@@ -3,140 +3,140 @@
 
 
 "@babel/parser@^7.16.4":
-  version "7.21.2"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.21.2.tgz#dacafadfc6d7654c3051a66d6fe55b6cb2f2a0b3"
-  integrity sha512-URpaIJQwEkEC2T9Kn+Ai6Xe/02iNaVCuT/PtoRz3GPVJVDpPd7mLo+VddTbhCRU9TXqW5mSrQfXZyi8kDKOVpQ==
+  version "7.21.3"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.21.3.tgz#1d285d67a19162ff9daa358d4cb41d50c06220b3"
+  integrity sha512-lobG0d7aOfQRXh8AyklEAgZGvA4FShxo6xQbUrrT/cNBPUdIDojlokwJsQyCC/eKia7ifqM0yP+2DRZ4WKw2RQ==
 
-"@esbuild/android-arm64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.16.17.tgz#cf91e86df127aa3d141744edafcba0abdc577d23"
-  integrity sha512-MIGl6p5sc3RDTLLkYL1MyL8BMRN4tLMRCn+yRJJmEDvYZ2M7tmAf80hx1kbNEUX2KJ50RRtxZ4JHLvCfuB6kBg==
+"@esbuild/android-arm64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.17.14.tgz#4624cea3c8941c91f9e9c1228f550d23f1cef037"
+  integrity sha512-eLOpPO1RvtsP71afiFTvS7tVFShJBCT0txiv/xjFBo5a7R7Gjw7X0IgIaFoLKhqXYAXhahoXm7qAmRXhY4guJg==
 
-"@esbuild/android-arm@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.16.17.tgz#025b6246d3f68b7bbaa97069144fb5fb70f2fff2"
-  integrity sha512-N9x1CMXVhtWEAMS7pNNONyA14f71VPQN9Cnavj1XQh6T7bskqiLLrSca4O0Vr8Wdcga943eThxnVp3JLnBMYtw==
+"@esbuild/android-arm@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.17.14.tgz#74fae60fcab34c3f0e15cb56473a6091ba2b53a6"
+  integrity sha512-0CnlwnjDU8cks0yJLXfkaU/uoLyRf9VZJs4p1PskBr2AlAHeEsFEwJEo0of/Z3g+ilw5mpyDwThlxzNEIxOE4g==
 
-"@esbuild/android-x64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.16.17.tgz#c820e0fef982f99a85c4b8bfdd582835f04cd96e"
-  integrity sha512-a3kTv3m0Ghh4z1DaFEuEDfz3OLONKuFvI4Xqczqx4BqLyuFaFkuaG4j2MtA6fuWEFeC5x9IvqnX7drmRq/fyAQ==
+"@esbuild/android-x64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.17.14.tgz#f002fbc08d5e939d8314bd23bcfb1e95d029491f"
+  integrity sha512-nrfQYWBfLGfSGLvRVlt6xi63B5IbfHm3tZCdu/82zuFPQ7zez4XjmRtF/wIRYbJQ/DsZrxJdEvYFE67avYXyng==
 
-"@esbuild/darwin-arm64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.16.17.tgz#edef4487af6b21afabba7be5132c26d22379b220"
-  integrity sha512-/2agbUEfmxWHi9ARTX6OQ/KgXnOWfsNlTeLcoV7HSuSTv63E4DqtAc+2XqGw1KHxKMHGZgbVCZge7HXWX9Vn+w==
+"@esbuild/darwin-arm64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.17.14.tgz#b8dcd79a1dd19564950b4ca51d62999011e2e168"
+  integrity sha512-eoSjEuDsU1ROwgBH/c+fZzuSyJUVXQTOIN9xuLs9dE/9HbV/A5IqdXHU1p2OfIMwBwOYJ9SFVGGldxeRCUJFyw==
 
-"@esbuild/darwin-x64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.16.17.tgz#42829168730071c41ef0d028d8319eea0e2904b4"
-  integrity sha512-2By45OBHulkd9Svy5IOCZt376Aa2oOkiE9QWUK9fe6Tb+WDr8hXL3dpqi+DeLiMed8tVXspzsTAvd0jUl96wmg==
+"@esbuild/darwin-x64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.17.14.tgz#4b49f195d9473625efc3c773fc757018f2c0d979"
+  integrity sha512-zN0U8RWfrDttdFNkHqFYZtOH8hdi22z0pFm0aIJPsNC4QQZv7je8DWCX5iA4Zx6tRhS0CCc0XC2m7wKsbWEo5g==
 
-"@esbuild/freebsd-arm64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.16.17.tgz#1f4af488bfc7e9ced04207034d398e793b570a27"
-  integrity sha512-mt+cxZe1tVx489VTb4mBAOo2aKSnJ33L9fr25JXpqQqzbUIw/yzIzi+NHwAXK2qYV1lEFp4OoVeThGjUbmWmdw==
+"@esbuild/freebsd-arm64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.17.14.tgz#480923fd38f644c6342c55e916cc7c231a85eeb7"
+  integrity sha512-z0VcD4ibeZWVQCW1O7szaLxGsx54gcCnajEJMdYoYjLiq4g1jrP2lMq6pk71dbS5+7op/L2Aod+erw+EUr28/A==
 
-"@esbuild/freebsd-x64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.16.17.tgz#636306f19e9bc981e06aa1d777302dad8fddaf72"
-  integrity sha512-8ScTdNJl5idAKjH8zGAsN7RuWcyHG3BAvMNpKOBaqqR7EbUhhVHOqXRdL7oZvz8WNHL2pr5+eIT5c65kA6NHug==
+"@esbuild/freebsd-x64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.17.14.tgz#a6b6b01954ad8562461cb8a5e40e8a860af69cbe"
+  integrity sha512-hd9mPcxfTgJlolrPlcXkQk9BMwNBvNBsVaUe5eNUqXut6weDQH8whcNaKNF2RO8NbpT6GY8rHOK2A9y++s+ehw==
 
-"@esbuild/linux-arm64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.16.17.tgz#a003f7ff237c501e095d4f3a09e58fc7b25a4aca"
-  integrity sha512-7S8gJnSlqKGVJunnMCrXHU9Q8Q/tQIxk/xL8BqAP64wchPCTzuM6W3Ra8cIa1HIflAvDnNOt2jaL17vaW+1V0g==
+"@esbuild/linux-arm64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.17.14.tgz#1fe2f39f78183b59f75a4ad9c48d079916d92418"
+  integrity sha512-FhAMNYOq3Iblcj9i+K0l1Fp/MHt+zBeRu/Qkf0LtrcFu3T45jcwB6A1iMsemQ42vR3GBhjNZJZTaCe3VFPbn9g==
 
-"@esbuild/linux-arm@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.16.17.tgz#b591e6a59d9c4fe0eeadd4874b157ab78cf5f196"
-  integrity sha512-iihzrWbD4gIT7j3caMzKb/RsFFHCwqqbrbH9SqUSRrdXkXaygSZCZg1FybsZz57Ju7N/SHEgPyaR0LZ8Zbe9gQ==
+"@esbuild/linux-arm@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.17.14.tgz#18d594a49b64e4a3a05022c005cb384a58056a2a"
+  integrity sha512-BNTl+wSJ1omsH8s3TkQmIIIQHwvwJrU9u1ggb9XU2KTVM4TmthRIVyxSp2qxROJHhZuW/r8fht46/QE8hU8Qvg==
 
-"@esbuild/linux-ia32@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.16.17.tgz#24333a11027ef46a18f57019450a5188918e2a54"
-  integrity sha512-kiX69+wcPAdgl3Lonh1VI7MBr16nktEvOfViszBSxygRQqSpzv7BffMKRPMFwzeJGPxcio0pdD3kYQGpqQ2SSg==
+"@esbuild/linux-ia32@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.17.14.tgz#f7f0182a9cfc0159e0922ed66c805c9c6ef1b654"
+  integrity sha512-91OK/lQ5y2v7AsmnFT+0EyxdPTNhov3y2CWMdizyMfxSxRqHazXdzgBKtlmkU2KYIc+9ZK3Vwp2KyXogEATYxQ==
 
-"@esbuild/linux-loong64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.16.17.tgz#d5ad459d41ed42bbd4d005256b31882ec52227d8"
-  integrity sha512-dTzNnQwembNDhd654cA4QhbS9uDdXC3TKqMJjgOWsC0yNCbpzfWoXdZvp0mY7HU6nzk5E0zpRGGx3qoQg8T2DQ==
+"@esbuild/linux-loong64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.17.14.tgz#5f5305fdffe2d71dd9a97aa77d0c99c99409066f"
+  integrity sha512-vp15H+5NR6hubNgMluqqKza85HcGJgq7t6rMH7O3Y6ApiOWPkvW2AJfNojUQimfTp6OUrACUXfR4hmpcENXoMQ==
 
-"@esbuild/linux-mips64el@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.16.17.tgz#4e5967a665c38360b0a8205594377d4dcf9c3726"
-  integrity sha512-ezbDkp2nDl0PfIUn0CsQ30kxfcLTlcx4Foz2kYv8qdC6ia2oX5Q3E/8m6lq84Dj/6b0FrkgD582fJMIfHhJfSw==
+"@esbuild/linux-mips64el@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.17.14.tgz#a602e85c51b2f71d2aedfe7f4143b2f92f97f3f5"
+  integrity sha512-90TOdFV7N+fgi6c2+GO9ochEkmm9kBAKnuD5e08GQMgMINOdOFHuYLPQ91RYVrnWwQ5683sJKuLi9l4SsbJ7Hg==
 
-"@esbuild/linux-ppc64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.16.17.tgz#206443a02eb568f9fdf0b438fbd47d26e735afc8"
-  integrity sha512-dzS678gYD1lJsW73zrFhDApLVdM3cUF2MvAa1D8K8KtcSKdLBPP4zZSLy6LFZ0jYqQdQ29bjAHJDgz0rVbLB3g==
+"@esbuild/linux-ppc64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.17.14.tgz#32d918d782105cbd9345dbfba14ee018b9c7afdf"
+  integrity sha512-NnBGeoqKkTugpBOBZZoktQQ1Yqb7aHKmHxsw43NddPB2YWLAlpb7THZIzsRsTr0Xw3nqiPxbA1H31ZMOG+VVPQ==
 
-"@esbuild/linux-riscv64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.16.17.tgz#c351e433d009bf256e798ad048152c8d76da2fc9"
-  integrity sha512-ylNlVsxuFjZK8DQtNUwiMskh6nT0vI7kYl/4fZgV1llP5d6+HIeL/vmmm3jpuoo8+NuXjQVZxmKuhDApK0/cKw==
+"@esbuild/linux-riscv64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.17.14.tgz#38612e7b6c037dff7022c33f49ca17f85c5dec58"
+  integrity sha512-0qdlKScLXA8MGVy21JUKvMzCYWovctuP8KKqhtE5A6IVPq4onxXhSuhwDd2g5sRCzNDlDjitc5sX31BzDoL5Fw==
 
-"@esbuild/linux-s390x@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.16.17.tgz#661f271e5d59615b84b6801d1c2123ad13d9bd87"
-  integrity sha512-gzy7nUTO4UA4oZ2wAMXPNBGTzZFP7mss3aKR2hH+/4UUkCOyqmjXiKpzGrY2TlEUhbbejzXVKKGazYcQTZWA/w==
+"@esbuild/linux-s390x@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.17.14.tgz#4397dff354f899e72fd035d72af59a700c465ccb"
+  integrity sha512-Hdm2Jo1yaaOro4v3+6/zJk6ygCqIZuSDJHdHaf8nVH/tfOuoEX5Riv03Ka15LmQBYJObUTNS1UdyoMk0WUn9Ww==
 
-"@esbuild/linux-x64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.16.17.tgz#e4ba18e8b149a89c982351443a377c723762b85f"
-  integrity sha512-mdPjPxfnmoqhgpiEArqi4egmBAMYvaObgn4poorpUaqmvzzbvqbowRllQ+ZgzGVMGKaPkqUmPDOOFQRUFDmeUw==
+"@esbuild/linux-x64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.17.14.tgz#6c5cb99891b6c3e0c08369da3ef465e8038ad9c2"
+  integrity sha512-8KHF17OstlK4DuzeF/KmSgzrTWQrkWj5boluiiq7kvJCiQVzUrmSkaBvcLB2UgHpKENO2i6BthPkmUhNDaJsVw==
 
-"@esbuild/netbsd-x64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.16.17.tgz#7d4f4041e30c5c07dd24ffa295c73f06038ec775"
-  integrity sha512-/PzmzD/zyAeTUsduZa32bn0ORug+Jd1EGGAUJvqfeixoEISYpGnAezN6lnJoskauoai0Jrs+XSyvDhppCPoKOA==
+"@esbuild/netbsd-x64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.17.14.tgz#5fa5255a64e9bf3947c1b3bef5e458b50b211994"
+  integrity sha512-nVwpqvb3yyXztxIT2+VsxJhB5GCgzPdk1n0HHSnchRAcxqKO6ghXwHhJnr0j/B+5FSyEqSxF4q03rbA2fKXtUQ==
 
-"@esbuild/openbsd-x64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.16.17.tgz#970fa7f8470681f3e6b1db0cc421a4af8060ec35"
-  integrity sha512-2yaWJhvxGEz2RiftSk0UObqJa/b+rIAjnODJgv2GbGGpRwAfpgzyrg1WLK8rqA24mfZa9GvpjLcBBg8JHkoodg==
+"@esbuild/openbsd-x64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.17.14.tgz#74d14c79dcb6faf446878cc64284aa4e02f5ca6f"
+  integrity sha512-1RZ7uQQ9zcy/GSAJL1xPdN7NDdOOtNEGiJalg/MOzeakZeTrgH/DoCkbq7TaPDiPhWqnDF+4bnydxRqQD7il6g==
 
-"@esbuild/sunos-x64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.16.17.tgz#abc60e7c4abf8b89fb7a4fe69a1484132238022c"
-  integrity sha512-xtVUiev38tN0R3g8VhRfN7Zl42YCJvyBhRKw1RJjwE1d2emWTVToPLNEQj/5Qxc6lVFATDiy6LjVHYhIPrLxzw==
+"@esbuild/sunos-x64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.17.14.tgz#5c7d1c7203781d86c2a9b2ff77bd2f8036d24cfa"
+  integrity sha512-nqMjDsFwv7vp7msrwWRysnM38Sd44PKmW8EzV01YzDBTcTWUpczQg6mGao9VLicXSgW/iookNK6AxeogNVNDZA==
 
-"@esbuild/win32-arm64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.16.17.tgz#7b0ff9e8c3265537a7a7b1fd9a24e7bd39fcd87a"
-  integrity sha512-ga8+JqBDHY4b6fQAmOgtJJue36scANy4l/rL97W+0wYmijhxKetzZdKOJI7olaBaMhWt8Pac2McJdZLxXWUEQw==
+"@esbuild/win32-arm64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.17.14.tgz#dc36ed84f1390e73b6019ccf0566c80045e5ca3d"
+  integrity sha512-xrD0mccTKRBBIotrITV7WVQAwNJ5+1va6L0H9zN92v2yEdjfAN7864cUaZwJS7JPEs53bDTzKFbfqVlG2HhyKQ==
 
-"@esbuild/win32-ia32@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.16.17.tgz#e90fe5267d71a7b7567afdc403dfd198c292eb09"
-  integrity sha512-WnsKaf46uSSF/sZhwnqE4L/F89AYNMiD4YtEcYekBt9Q7nj0DiId2XH2Ng2PHM54qi5oPrQ8luuzGszqi/veig==
+"@esbuild/win32-ia32@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.17.14.tgz#0802a107afa9193c13e35de15a94fe347c588767"
+  integrity sha512-nXpkz9bbJrLLyUTYtRotSS3t5b+FOuljg8LgLdINWFs3FfqZMtbnBCZFUmBzQPyxqU87F8Av+3Nco/M3hEcu1w==
 
-"@esbuild/win32-x64@0.16.17":
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.16.17.tgz#c5a1a4bfe1b57f0c3e61b29883525c6da3e5c091"
-  integrity sha512-y+EHuSchhL7FjHgvQL/0fnnFmO4T1bhvWANX6gcnqTjtnKWbTvUMCpGnv2+t+31d7RzyEAYAd4u2fnIhHL6N/Q==
+"@esbuild/win32-x64@0.17.14":
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.17.14.tgz#e81fb49de05fed91bf74251c9ca0343f4fc77d31"
+  integrity sha512-gPQmsi2DKTaEgG14hc3CHXHp62k8g6qr0Pas+I4lUxRMugGSATh/Bi8Dgusoz9IQ0IfdrvLpco6kujEIBoaogA==
 
-"@eslint-community/eslint-utils@^4.2.0":
-  version "4.2.0"
-  resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.2.0.tgz#a831e6e468b4b2b5ae42bf658bea015bf10bc518"
-  integrity sha512-gB8T4H4DEfX2IV9zGDJPOBgP1e/DbfCPDTtEqUMckpvzS1OYtva8JdFYBqMwYk7xAQ429WGF/UPqn8uQ//h2vQ==
+"@eslint-community/eslint-utils@^4.2.0", "@eslint-community/eslint-utils@^4.3.0":
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz#a23514e8fb9af1269d5f7788aa556798d61c6b59"
+  integrity sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==
   dependencies:
     eslint-visitor-keys "^3.3.0"
 
 "@eslint-community/regexpp@^4.4.0":
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/@eslint-community/regexpp/-/regexpp-4.4.0.tgz#3e61c564fcd6b921cb789838631c5ee44df09403"
-  integrity sha512-A9983Q0LnDGdLPjxyXQ00sbV+K+O+ko2Dr+CZigbHWtX9pNfxlaBkMR8X1CztI73zuEyEBXTVjx7CE+/VSwDiQ==
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/@eslint-community/regexpp/-/regexpp-4.5.0.tgz#f6f729b02feee2c749f57e334b7a1b5f40a81724"
+  integrity sha512-vITaYzIcNmjn5tF5uxcZ/ft7/RXGrMUIS9HalWckEOF6ESiwXKoMzAQf2UW0aVd6rnOeExTJVd5hmWXucBKGXQ==
 
-"@eslint/eslintrc@^2.0.1":
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-2.0.1.tgz#7888fe7ec8f21bc26d646dbd2c11cd776e21192d"
-  integrity sha512-eFRmABvW2E5Ho6f5fHLqgena46rOj7r7OKHYfLElqcBfGFHHpjBhivyi5+jOEQuSpdc/1phIZJlbC2te+tZNIw==
+"@eslint/eslintrc@^2.0.2":
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-2.0.2.tgz#01575e38707add677cf73ca1589abba8da899a02"
+  integrity sha512-3W4f5tDUra+pA+FzgugqL2pRimUTDJWKr7BINqOpkZrC0uYI0NIc0/JFgBROCU07HR6GieA5m3/rsPIhDmCXTQ==
   dependencies:
     ajv "^6.12.4"
     debug "^4.3.2"
-    espree "^9.5.0"
+    espree "^9.5.1"
     globals "^13.19.0"
     ignore "^5.2.0"
     import-fresh "^3.2.1"
@@ -144,10 +144,10 @@
     minimatch "^3.1.2"
     strip-json-comments "^3.1.1"
 
-"@eslint/js@8.36.0":
-  version "8.36.0"
-  resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.36.0.tgz#9837f768c03a1e4a30bd304a64fb8844f0e72efe"
-  integrity sha512-lxJ9R5ygVm8ZWgYdUweoq5ownDlJ4upvoWmO4eLxBYHdMo+vZ/Rx0EN6MbKWDJOSUGrqJy2Gt+Dyv/VKml0fjg==
+"@eslint/js@8.37.0":
+  version "8.37.0"
+  resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.37.0.tgz#cf1b5fa24217fe007f6487a26d765274925efa7d"
+  integrity sha512-x5vzdtOOGgFVDCUs81QRB2+liax8rFg3+7hqM+QhBG0/G3F1ZsoYl97UrqgHgQ9KKT7G6c4V+aTUCgu/n22v1A==
 
 "@floating-ui/core@^0.3.0":
   version "0.3.1"
@@ -281,10 +281,15 @@
     "@tauri-apps/cli-win32-ia32-msvc" "1.2.3"
     "@tauri-apps/cli-win32-x64-msvc" "1.2.3"
 
+"@trysound/sax@0.2.0":
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/@trysound/sax/-/sax-0.2.0.tgz#cccaab758af56761eb7bf37af6f03f326dd798ad"
+  integrity sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==
+
 "@types/eslint@^8.4.5":
-  version "8.21.2"
-  resolved "https://registry.yarnpkg.com/@types/eslint/-/eslint-8.21.2.tgz#2b61b43a8b0e66006856a2a4c8e51f6f773ead27"
-  integrity sha512-EMpxUyystd3uZVByZap1DACsMXvb82ypQnGn89e1Y0a+LYu3JJscUd/gqhRsVFDkaD2MIiWo0MT8EfXr3DGRKw==
+  version "8.21.3"
+  resolved "https://registry.yarnpkg.com/@types/eslint/-/eslint-8.21.3.tgz#5794b3911f0f19e34e3a272c49cbdf48d6f543f2"
+  integrity sha512-fa7GkppZVEByMWGbTtE5MbmXWJTVbrjjaS8K6uQj+XtuuUv1fsuPAxhygfqLmsb/Ufb3CV8deFCpiMfAgi00Sw==
   dependencies:
     "@types/estree" "*"
     "@types/json-schema" "*"
@@ -300,9 +305,9 @@
   integrity sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ==
 
 "@vitejs/plugin-vue@^4.0.0":
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-4.0.0.tgz#93815beffd23db46288c787352a8ea31a0c03e5e"
-  integrity sha512-e0X4jErIxAB5oLtDqbHvHpJe/uWNkdpYV83AOG2xo2tEVSzCzewgJMtREZM30wXnM5ls90hxiOtAuVU6H5JgbA==
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-4.1.0.tgz#b6a9d83cd91575f7ee15593f6444397f68751073"
+  integrity sha512-++9JOAFdcXI3lyer9UKUV4rfoQ3T1RN8yDqoCLar86s0xQct5yblxAE+yWgRnU5/0FOlVCpTZpYSBV/bGWrSrQ==
 
 "@vue/compiler-core@3.2.47":
   version "3.2.47"
@@ -322,7 +327,7 @@
     "@vue/compiler-core" "3.2.47"
     "@vue/shared" "3.2.47"
 
-"@vue/compiler-sfc@3.2.47":
+"@vue/compiler-sfc@3.2.47", "@vue/compiler-sfc@^3.2.20":
   version "3.2.47"
   resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.2.47.tgz#1bdc36f6cdc1643f72e2c397eb1a398f5004ad3d"
   integrity sha512-rog05W+2IFfxjMcFw10tM9+f7i/+FFpZJJ5XHX72NP9eC2uRD+42M3pYcQqDXVYoj74kHMSEdQ/WmCjt8JFksQ==
@@ -535,6 +540,16 @@ combined-stream@^1.0.8:
   dependencies:
     delayed-stream "~1.0.0"
 
+commander@^2.20.3:
+  version "2.20.3"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"
+  integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
+
+commander@^7.2.0:
+  version "7.2.0"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-7.2.0.tgz#a36cb57d0b501ce108e4d20559a150a391d97ab7"
+  integrity sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==
+
 concat-map@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
@@ -549,11 +564,55 @@ cross-spawn@^7.0.2:
     shebang-command "^2.0.0"
     which "^2.0.1"
 
+css-select@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/css-select/-/css-select-5.1.0.tgz#b8ebd6554c3637ccc76688804ad3f6a6fdaea8a6"
+  integrity sha512-nwoRF1rvRRnnCqqY7updORDsuqKzqYJ28+oSMaJMMgOauh3fvwHqMS7EZpIPqK8GL+g9mKxF1vP/ZjSeNjEVHg==
+  dependencies:
+    boolbase "^1.0.0"
+    css-what "^6.1.0"
+    domhandler "^5.0.2"
+    domutils "^3.0.1"
+    nth-check "^2.0.1"
+
+css-tree@^2.2.1:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-2.3.1.tgz#10264ce1e5442e8572fc82fbe490644ff54b5c20"
+  integrity sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==
+  dependencies:
+    mdn-data "2.0.30"
+    source-map-js "^1.0.1"
+
+css-tree@~2.2.0:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-2.2.1.tgz#36115d382d60afd271e377f9c5f67d02bd48c032"
+  integrity sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA==
+  dependencies:
+    mdn-data "2.0.28"
+    source-map-js "^1.0.1"
+
+css-what@^6.1.0:
+  version "6.1.0"
+  resolved "https://registry.yarnpkg.com/css-what/-/css-what-6.1.0.tgz#fb5effcf76f1ddea2c81bdfaa4de44e79bac70f4"
+  integrity sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==
+
 cssesc@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
   integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
 
+cssfilter@0.0.10:
+  version "0.0.10"
+  resolved "https://registry.yarnpkg.com/cssfilter/-/cssfilter-0.0.10.tgz#c6d2672632a2e5c83e013e6864a42ce8defd20ae"
+  integrity sha512-FAaLDaplstoRsDR8XGYH51znUN0UY7nMc6Z9/fvE8EXGwvJE9hu7W2vHwx1+bd6gCYnln9nLbzxFTrcO9YQDZw==
+
+csso@^5.0.5:
+  version "5.0.5"
+  resolved "https://registry.yarnpkg.com/csso/-/csso-5.0.5.tgz#f9b7fe6cc6ac0b7d90781bb16d5e9874303e2ca6"
+  integrity sha512-0LrrStPOdJj+SPCCrGhzryycLjwcgUSHBtxNA8aIDxf0GLsRh1cKYhB00Gd1lDOS4yGH69+SNn13+TWbVHETFQ==
+  dependencies:
+    css-tree "~2.2.0"
+
 csstype@^2.6.8:
   version "2.6.21"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.21.tgz#2efb85b7cc55c80017c66a5ad7cbd931fda3a90e"
@@ -588,33 +647,73 @@ doctrine@^3.0.0:
   dependencies:
     esutils "^2.0.2"
 
-esbuild@^0.16.14:
-  version "0.16.17"
-  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.16.17.tgz#fc2c3914c57ee750635fee71b89f615f25065259"
-  integrity sha512-G8LEkV0XzDMNwXKgM0Jwu3nY3lSTwSGY6XbxM9cr9+s0T/qSV1q1JVPBGzm3dcjhCic9+emZDmMffkwgPeOeLg==
+dom-serializer@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-2.0.0.tgz#e41b802e1eedf9f6cae183ce5e622d789d7d8e53"
+  integrity sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==
+  dependencies:
+    domelementtype "^2.3.0"
+    domhandler "^5.0.2"
+    entities "^4.2.0"
+
+domelementtype@^2.3.0:
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-2.3.0.tgz#5c45e8e869952626331d7aab326d01daf65d589d"
+  integrity sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==
+
+domhandler@^5.0.1, domhandler@^5.0.2:
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-5.0.3.tgz#cc385f7f751f1d1fc650c21374804254538c7d31"
+  integrity sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==
+  dependencies:
+    domelementtype "^2.3.0"
+
+domutils@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/domutils/-/domutils-3.0.1.tgz#696b3875238338cb186b6c0612bd4901c89a4f1c"
+  integrity sha512-z08c1l761iKhDFtfXO04C7kTdPBLi41zwOZl00WS8b5eiaebNpY00HKbztwBq+e3vyqWNwWF3mP9YLUeqIrF+Q==
+  dependencies:
+    dom-serializer "^2.0.0"
+    domelementtype "^2.3.0"
+    domhandler "^5.0.1"
+
+entities@^4.2.0:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/entities/-/entities-4.4.0.tgz#97bdaba170339446495e653cfd2db78962900174"
+  integrity sha512-oYp7156SP8LkeGD0GF85ad1X9Ai79WtRsZ2gxJqtBuzH+98YUV6jkHEKlZkMbcrjJjIVJNIDP/3WL9wQkoPbWA==
+
+entities@~3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/entities/-/entities-3.0.1.tgz#2b887ca62585e96db3903482d336c1006c3001d4"
+  integrity sha512-WiyBqoomrwMdFG1e0kqvASYfnlb0lp8M5o5Fw2OFq1hNZxxcNk8Ik0Xm7LxzBhuidnZB/UtBqVCgUz3kBOP51Q==
+
+esbuild@^0.17.5:
+  version "0.17.14"
+  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.17.14.tgz#d61a22de751a3133f3c6c7f9c1c3e231e91a3245"
+  integrity sha512-vOO5XhmVj/1XQR9NQ1UPq6qvMYL7QFJU57J5fKBKBKxp17uDt5PgxFDb4A2nEiXhr1qQs4x0F5+66hVVw4ruNw==
   optionalDependencies:
-    "@esbuild/android-arm" "0.16.17"
-    "@esbuild/android-arm64" "0.16.17"
-    "@esbuild/android-x64" "0.16.17"
-    "@esbuild/darwin-arm64" "0.16.17"
-    "@esbuild/darwin-x64" "0.16.17"
-    "@esbuild/freebsd-arm64" "0.16.17"
-    "@esbuild/freebsd-x64" "0.16.17"
-    "@esbuild/linux-arm" "0.16.17"
-    "@esbuild/linux-arm64" "0.16.17"
-    "@esbuild/linux-ia32" "0.16.17"
-    "@esbuild/linux-loong64" "0.16.17"
-    "@esbuild/linux-mips64el" "0.16.17"
-    "@esbuild/linux-ppc64" "0.16.17"
-    "@esbuild/linux-riscv64" "0.16.17"
-    "@esbuild/linux-s390x" "0.16.17"
-    "@esbuild/linux-x64" "0.16.17"
-    "@esbuild/netbsd-x64" "0.16.17"
-    "@esbuild/openbsd-x64" "0.16.17"
-    "@esbuild/sunos-x64" "0.16.17"
-    "@esbuild/win32-arm64" "0.16.17"
-    "@esbuild/win32-ia32" "0.16.17"
-    "@esbuild/win32-x64" "0.16.17"
+    "@esbuild/android-arm" "0.17.14"
+    "@esbuild/android-arm64" "0.17.14"
+    "@esbuild/android-x64" "0.17.14"
+    "@esbuild/darwin-arm64" "0.17.14"
+    "@esbuild/darwin-x64" "0.17.14"
+    "@esbuild/freebsd-arm64" "0.17.14"
+    "@esbuild/freebsd-x64" "0.17.14"
+    "@esbuild/linux-arm" "0.17.14"
+    "@esbuild/linux-arm64" "0.17.14"
+    "@esbuild/linux-ia32" "0.17.14"
+    "@esbuild/linux-loong64" "0.17.14"
+    "@esbuild/linux-mips64el" "0.17.14"
+    "@esbuild/linux-ppc64" "0.17.14"
+    "@esbuild/linux-riscv64" "0.17.14"
+    "@esbuild/linux-s390x" "0.17.14"
+    "@esbuild/linux-x64" "0.17.14"
+    "@esbuild/netbsd-x64" "0.17.14"
+    "@esbuild/openbsd-x64" "0.17.14"
+    "@esbuild/sunos-x64" "0.17.14"
+    "@esbuild/win32-arm64" "0.17.14"
+    "@esbuild/win32-ia32" "0.17.14"
+    "@esbuild/win32-x64" "0.17.14"
 
 escape-string-regexp@^4.0.0:
   version "4.0.0"
@@ -622,16 +721,16 @@ escape-string-regexp@^4.0.0:
   integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
 
 eslint-config-prettier@^8.6.0:
-  version "8.7.0"
-  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-8.7.0.tgz#f1cc58a8afebc50980bd53475451df146c13182d"
-  integrity sha512-HHVXLSlVUhMSmyW4ZzEuvjpwqamgmlfkutD53cYXLikh4pt/modINRcCIApJ84czDxM4GZInwUrromsDdTImTA==
+  version "8.8.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-8.8.0.tgz#bfda738d412adc917fd7b038857110efe98c9348"
+  integrity sha512-wLbQiFre3tdGgpDv67NQKnJuTlcUVYHas3k+DZCc2U2BadthoEY4B7hLPvAxaqdyOGCzuLfii2fqGph10va7oA==
 
 eslint-plugin-vue@^9.9.0:
-  version "9.9.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-9.9.0.tgz#ac788ebccd2eb94d846a507df55da50693b80c91"
-  integrity sha512-YbubS7eK0J7DCf0U2LxvVP7LMfs6rC6UltihIgval3azO3gyDwEGVgsCMe1TmDiEkl6GdMKfRpaME6QxIYtzDQ==
+  version "9.10.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-9.10.0.tgz#bb6423166e6eab800344245b6eef6ce9480c78a7"
+  integrity sha512-2MgP31OBf8YilUvtakdVMc8xVbcMp7z7/iQj8LHVpXrSXHPXSJRUIGSPFI6b6pyCx/buKaFJ45ycqfHvQRiW2g==
   dependencies:
-    eslint-utils "^3.0.0"
+    "@eslint-community/eslint-utils" "^4.3.0"
     natural-compare "^1.4.0"
     nth-check "^2.0.1"
     postcss-selector-parser "^6.0.9"
@@ -647,32 +746,20 @@ eslint-scope@^7.1.1:
     esrecurse "^4.3.0"
     estraverse "^5.2.0"
 
-eslint-utils@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-3.0.0.tgz#8aebaface7345bb33559db0a1f13a1d2d48c3672"
-  integrity sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==
-  dependencies:
-    eslint-visitor-keys "^2.0.0"
-
-eslint-visitor-keys@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz#f65328259305927392c938ed44eb0a5c9b2bd303"
-  integrity sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw==
-
-eslint-visitor-keys@^3.3.0:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.3.0.tgz#f6480fa6b1f30efe2d1968aa8ac745b862469826"
-  integrity sha512-mQ+suqKJVyeuwGYHAdjMFqjCyfl8+Ldnxuyp3ldiMBFKkvytrXUZWaiPCEav8qDHKty44bD+qV1IP4T+w+xXRA==
+eslint-visitor-keys@^3.3.0, eslint-visitor-keys@^3.4.0:
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.0.tgz#c7f0f956124ce677047ddbc192a68f999454dedc"
+  integrity sha512-HPpKPUBQcAsZOsHAFwTtIKcYlCje62XB7SEAcxjtmW6TD1WVpkS6i6/hOVtTZIl4zGj/mBqpFVGvaDneik+VoQ==
 
 eslint@^8.35.0:
-  version "8.36.0"
-  resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.36.0.tgz#1bd72202200a5492f91803b113fb8a83b11285cf"
-  integrity sha512-Y956lmS7vDqomxlaaQAHVmeb4tNMp2FWIvU/RnU5BD3IKMD/MJPr76xdyr68P8tV1iNMvN2mRK0yy3c+UjL+bw==
+  version "8.37.0"
+  resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.37.0.tgz#1f660ef2ce49a0bfdec0b0d698e0b8b627287412"
+  integrity sha512-NU3Ps9nI05GUoVMxcZx1J8CNR6xOvUT4jAUMH5+z8lpp3aEdPVCImKw6PWG4PY+Vfkpr+jvMpxs/qoE7wq0sPw==
   dependencies:
     "@eslint-community/eslint-utils" "^4.2.0"
     "@eslint-community/regexpp" "^4.4.0"
-    "@eslint/eslintrc" "^2.0.1"
-    "@eslint/js" "8.36.0"
+    "@eslint/eslintrc" "^2.0.2"
+    "@eslint/js" "8.37.0"
     "@humanwhocodes/config-array" "^0.11.8"
     "@humanwhocodes/module-importer" "^1.0.1"
     "@nodelib/fs.walk" "^1.2.8"
@@ -683,8 +770,8 @@ eslint@^8.35.0:
     doctrine "^3.0.0"
     escape-string-regexp "^4.0.0"
     eslint-scope "^7.1.1"
-    eslint-visitor-keys "^3.3.0"
-    espree "^9.5.0"
+    eslint-visitor-keys "^3.4.0"
+    espree "^9.5.1"
     esquery "^1.4.2"
     esutils "^2.0.2"
     fast-deep-equal "^3.1.3"
@@ -710,14 +797,14 @@ eslint@^8.35.0:
     strip-json-comments "^3.1.0"
     text-table "^0.2.0"
 
-espree@^9.3.1, espree@^9.5.0:
-  version "9.5.0"
-  resolved "https://registry.yarnpkg.com/espree/-/espree-9.5.0.tgz#3646d4e3f58907464edba852fa047e6a27bdf113"
-  integrity sha512-JPbJGhKc47++oo4JkEoTe2wjy4fmMwvFpgJT9cQzmfXKp22Dr6Hf1tdCteLz1h0P3t+mGvWZ+4Uankvh8+c6zw==
+espree@^9.3.1, espree@^9.5.1:
+  version "9.5.1"
+  resolved "https://registry.yarnpkg.com/espree/-/espree-9.5.1.tgz#4f26a4d5f18905bf4f2e0bd99002aab807e96dd4"
+  integrity sha512-5yxtHSZXRSW5pvv3hAlXM5+/Oswi1AUFqBmbibKb5s6bp3rGIDkyXU6xCoyuuLhijr4SFwPrXRoZjz0AZDN9tg==
   dependencies:
     acorn "^8.8.0"
     acorn-jsx "^5.3.2"
-    eslint-visitor-keys "^3.3.0"
+    eslint-visitor-keys "^3.4.0"
 
 esquery@^1.4.0, esquery@^1.4.2:
   version "1.5.0"
@@ -892,6 +979,11 @@ has@^1.0.3:
   dependencies:
     function-bind "^1.1.1"
 
+highlight.js@^11.7.0:
+  version "11.7.0"
+  resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-11.7.0.tgz#3ff0165bc843f8c9bce1fd89e2fda9143d24b11e"
+  integrity sha512-1rRqesRFhMO/PRF+G86evnyJkCgaZFOI+Z6kdj15TA18funfoqJXvgPCLSf0SWq3SRfg1j3HlDs8o4s3EGq1oQ==
+
 ignore@^5.2.0:
   version "5.2.4"
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.4.tgz#a291c0c6178ff1b960befe47fcdec301674a6324"
@@ -970,9 +1062,9 @@ isexe@^2.0.0:
   integrity sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==
 
 js-sdsl@^4.1.4:
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/js-sdsl/-/js-sdsl-4.3.0.tgz#aeefe32a451f7af88425b11fdb5f58c90ae1d711"
-  integrity sha512-mifzlm2+5nZ+lEcLJMoBK0/IH/bDg8XnJfd/Wq6IP+xoCjLZsTOnV2QpxlVbX9bMnkl5PdEjNtBJ9Cj1NjifhQ==
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/js-sdsl/-/js-sdsl-4.4.0.tgz#8b437dbe642daa95760400b602378ed8ffea8430"
+  integrity sha512-FfVSdx6pJ41Oa+CF7RDaFmTnCaFhua+SNYQX74riGOpl96x+2jQCqEfQ2bnXu/5DPCqlRuiqyvTJM0Qjz26IVg==
 
 js-yaml@^4.1.0:
   version "4.1.0"
@@ -999,6 +1091,13 @@ levn@^0.4.1:
     prelude-ls "^1.2.1"
     type-check "~0.4.0"
 
+linkify-it@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/linkify-it/-/linkify-it-4.0.1.tgz#01f1d5e508190d06669982ba31a7d9f56a5751ec"
+  integrity sha512-C7bfi1UZmoj8+PQx22XyeXCuBlokoyWQL5pWSP+EI6nzRylyThouddufc2c1NDIcP9k5agmN9fLpA7VNJfIiqw==
+  dependencies:
+    uc.micro "^1.0.1"
+
 locate-path@^6.0.0:
   version "6.0.0"
   resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-6.0.0.tgz#55321eb309febbc59c4801d931a72452a681d286"
@@ -1030,6 +1129,32 @@ magic-string@^0.25.7:
   dependencies:
     sourcemap-codec "^1.4.8"
 
+markdown-it@^13.0.1:
+  version "13.0.1"
+  resolved "https://registry.yarnpkg.com/markdown-it/-/markdown-it-13.0.1.tgz#c6ecc431cacf1a5da531423fc6a42807814af430"
+  integrity sha512-lTlxriVoy2criHP0JKRhO2VDG9c2ypWCsT237eDiLqi09rmbKoUetyGHq2uOIRoRS//kfoJckS0eUzzkDR+k2Q==
+  dependencies:
+    argparse "^2.0.1"
+    entities "~3.0.1"
+    linkify-it "^4.0.1"
+    mdurl "^1.0.1"
+    uc.micro "^1.0.5"
+
+mdn-data@2.0.28:
+  version "2.0.28"
+  resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.28.tgz#5ec48e7bef120654539069e1ae4ddc81ca490eba"
+  integrity sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==
+
+mdn-data@2.0.30:
+  version "2.0.30"
+  resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.30.tgz#ce4df6f80af6cfbe218ecd5c552ba13c4dfa08cc"
+  integrity sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==
+
+mdurl@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/mdurl/-/mdurl-1.0.1.tgz#fe85b2ec75a59037f2adfec100fd6c601761152e"
+  integrity sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==
+
 mime-db@1.52.0:
   version "1.52.0"
   resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.52.0.tgz#bbabcdc02859f4987301c856e3387ce5ec43bf70"
@@ -1055,9 +1180,9 @@ ms@2.1.2:
   integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
 
 nanoid@^3.3.4:
-  version "3.3.4"
-  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.4.tgz#730b67e3cd09e2deacf03c027c81c9d9dbc5e8ab"
-  integrity sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==
+  version "3.3.6"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.6.tgz#443380c856d6e9f9824267d960b4236ad583ea4c"
+  integrity sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==
 
 natural-compare@^1.4.0:
   version "1.4.0"
@@ -1076,15 +1201,19 @@ nth-check@^2.0.1:
   dependencies:
     boolbase "^1.0.0"
 
-omorphia@^0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/omorphia/-/omorphia-0.4.0.tgz#d96453e9bc40c45ed3f18470dc3838fa1b20b954"
-  integrity sha512-cASEG0U620NCP1XUV/Y7Zw5b/2T2TtRNKeQ3hxNae420mXkfZaSbRt4F13MWOy1vVb8k5I2HfrvaWU9gv2ZWwA==
+omorphia@^0.4.2:
+  version "0.4.2"
+  resolved "https://registry.yarnpkg.com/omorphia/-/omorphia-0.4.2.tgz#0199e5a3ac2929da2307a7e81a4f1a4468eaf2eb"
+  integrity sha512-bRKpLCIOGnqTPfeh4Ilz01rd+KYkO7qJY8Pi81t5Y4+//rX7FItLnMkmG3zifgoLCzi7aqsfsByhQptpm4/3kw==
   dependencies:
     dayjs "^1.11.7"
     floating-vue "^2.0.0-beta.20"
+    highlight.js "^11.7.0"
+    markdown-it "^13.0.1"
     vue "^3.2.45"
     vue-router "^4.1.6"
+    vue-select "^4.0.0-beta.6"
+    xss "^1.0.14"
 
 once@^1.3.0:
   version "1.4.0"
@@ -1187,9 +1316,9 @@ prelude-ls@^1.2.1:
   integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==
 
 prettier@^2.8.4:
-  version "2.8.4"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.4.tgz#34dd2595629bfbb79d344ac4a91ff948694463c3"
-  integrity sha512-vIS4Rlc2FNh0BySk3Wkd6xmwxB0FpOndW5fisM5H8hsZSxU2VWVB5CWIkIjWvrHjIhxk2g3bfMKM87zNTrZddw==
+  version "2.8.7"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.7.tgz#bb79fc8729308549d28fe3a98fce73d2c0656450"
+  integrity sha512-yPngTo3aXUUmyuTjeTUT75txrf+aMh9FiD7q9ZE/i6r0bPb22g4FsE6Y338PQX1bmfy08i9QQCB7/rcUAVntfw==
 
 proxy-from-env@^1.1.0:
   version "1.1.0"
@@ -1246,10 +1375,10 @@ rollup@^2.77.2:
   optionalDependencies:
     fsevents "~2.3.2"
 
-rollup@^3.10.0:
-  version "3.19.1"
-  resolved "https://registry.yarnpkg.com/rollup/-/rollup-3.19.1.tgz#2b3a31ac1ff9f3afab2e523fa687fef5b0ee20fc"
-  integrity sha512-lAbrdN7neYCg/8WaoWn/ckzCtz+jr70GFfYdlf50OF7387HTg+wiuiqJRFYawwSPpqfqDNYqK7smY/ks2iAudg==
+rollup@^3.18.0:
+  version "3.20.2"
+  resolved "https://registry.yarnpkg.com/rollup/-/rollup-3.20.2.tgz#f798c600317f216de2e4ad9f4d9ab30a89b690ff"
+  integrity sha512-3zwkBQl7Ai7MFYQE0y1MeQ15+9jsi7XxfrqwTb/9EK8D9C9+//EBR4M+CuA1KODRaNbFez/lWxA5vhEGZp4MUg==
   optionalDependencies:
     fsevents "~2.3.2"
 
@@ -1261,9 +1390,9 @@ run-parallel@^1.1.9:
     queue-microtask "^1.2.2"
 
 sass@^1.58.3:
-  version "1.59.2"
-  resolved "https://registry.yarnpkg.com/sass/-/sass-1.59.2.tgz#537f6d11614d4f20f97696f23ad358ee398b1937"
-  integrity sha512-jJyO6SmbzkJexF8MUorHx5tAilcgabioYxT/BHbY4+OvoqmbHxsYlrjZ8Adhqcgl6Zqwie0TgMXLCAmPFxXOuw==
+  version "1.60.0"
+  resolved "https://registry.yarnpkg.com/sass/-/sass-1.60.0.tgz#657f0c23a302ac494b09a5ba8497b739fb5b5a81"
+  integrity sha512-updbwW6fNb5gGm8qMXzVO7V4sWf7LMXnMly/JEyfbfERbVH46Fn6q02BX7/eHTdKpE7d+oTkMMQpFWNUMfFbgQ==
   dependencies:
     chokidar ">=3.0.0 <4.0.0"
     immutable "^4.0.0"
@@ -1293,7 +1422,7 @@ slash@^4.0.0:
   resolved "https://registry.yarnpkg.com/slash/-/slash-4.0.0.tgz#2422372176c4c6c5addb5e2ada885af984b396a7"
   integrity sha512-3dOsAHXXUkQTpOYcoAxLIorMTp4gIQr5IW3iVb7A7lFIp0VHhnynm9izx6TssdrIcVIESAlVjtnO2K8bg+Coew==
 
-"source-map-js@>=0.6.2 <2.0.0", source-map-js@^1.0.2:
+"source-map-js@>=0.6.2 <2.0.0", source-map-js@^1.0.1, source-map-js@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
   integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
@@ -1332,6 +1461,18 @@ supports-preserve-symlinks-flag@^1.0.0:
   resolved "https://registry.yarnpkg.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09"
   integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==
 
+svgo@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/svgo/-/svgo-3.0.2.tgz#5e99eeea42c68ee0dc46aa16da093838c262fe0a"
+  integrity sha512-Z706C1U2pb1+JGP48fbazf3KxHrWOsLme6Rv7imFBn5EnuanDW1GPaA/P1/dvObE670JDePC3mnj0k0B7P0jjQ==
+  dependencies:
+    "@trysound/sax" "0.2.0"
+    commander "^7.2.0"
+    css-select "^5.1.0"
+    css-tree "^2.2.1"
+    csso "^5.0.5"
+    picocolors "^1.0.0"
+
 text-table@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
@@ -1356,6 +1497,11 @@ type-fest@^0.20.2:
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4"
   integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==
 
+uc.micro@^1.0.1, uc.micro@^1.0.5:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/uc.micro/-/uc.micro-1.0.6.tgz#9c411a802a409a91fc6cf74081baba34b24499ac"
+  integrity sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==
+
 uri-js@^4.2.2:
   version "4.4.1"
   resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e"
@@ -1377,15 +1523,23 @@ vite-plugin-eslint@^1.8.1:
     "@types/eslint" "^8.4.5"
     rollup "^2.77.2"
 
-vite@^4.0.0:
-  version "4.1.4"
-  resolved "https://registry.yarnpkg.com/vite/-/vite-4.1.4.tgz#170d93bcff97e0ebc09764c053eebe130bfe6ca0"
-  integrity sha512-3knk/HsbSTKEin43zHu7jTwYWv81f8kgAL99G5NWBcA1LKvtvcVAC4JjBH1arBunO9kQka+1oGbrMKOjk4ZrBg==
+vite-svg-loader@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/vite-svg-loader/-/vite-svg-loader-4.0.0.tgz#1cec4337dba3c23ab13bcabb111896e251b047ac"
+  integrity sha512-0MMf1yzzSYlV4MGePsLVAOqXsbF5IVxbn4EEzqRnWxTQl8BJg/cfwIzfQNmNQxZp5XXwd4kyRKF1LytuHZTnqA==
   dependencies:
-    esbuild "^0.16.14"
+    "@vue/compiler-sfc" "^3.2.20"
+    svgo "^3.0.2"
+
+vite@^4.0.0:
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/vite/-/vite-4.2.1.tgz#6c2eb337b0dfd80a9ded5922163b94949d7fc254"
+  integrity sha512-7MKhqdy0ISo4wnvwtqZkjke6XN4taqQ2TBaTccLIpOKv7Vp2h4Y+NpmWCnGDeSvvn45KxvWgGyb0MkHvY1vgbg==
+  dependencies:
+    esbuild "^0.17.5"
     postcss "^8.4.21"
     resolve "^1.22.1"
-    rollup "^3.10.0"
+    rollup "^3.18.0"
   optionalDependencies:
     fsevents "~2.3.2"
 
@@ -1419,6 +1573,11 @@ vue-router@4, vue-router@^4.1.6:
   dependencies:
     "@vue/devtools-api" "^6.4.5"
 
+vue-select@^4.0.0-beta.6:
+  version "4.0.0-beta.6"
+  resolved "https://registry.yarnpkg.com/vue-select/-/vue-select-4.0.0-beta.6.tgz#7c250cb7c01280b54a311cb446629801b3c8df98"
+  integrity sha512-K+zrNBSpwMPhAxYLTCl56gaMrWZGgayoWCLqe5rWwkB8aUbAUh7u6sXjIR7v4ckp2WKC7zEEUY27g6h1MRsIHw==
+
 vue@^3.2.45:
   version "3.2.47"
   resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.47.tgz#3eb736cbc606fc87038dbba6a154707c8a34cff0"
@@ -1452,6 +1611,14 @@ xml-name-validator@^4.0.0:
   resolved "https://registry.yarnpkg.com/xml-name-validator/-/xml-name-validator-4.0.0.tgz#79a006e2e63149a8600f15430f0a4725d1524835"
   integrity sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==
 
+xss@^1.0.14:
+  version "1.0.14"
+  resolved "https://registry.yarnpkg.com/xss/-/xss-1.0.14.tgz#4f3efbde75ad0d82e9921cc3c95e6590dd336694"
+  integrity sha512-og7TEJhXvn1a7kzZGQ7ETjdQVS2UfZyTlsEdDOqvQF7GoxNfY+0YLCzBy1kPdsDDx4QuNAonQPddpsn6Xl/7sw==
+  dependencies:
+    commander "^2.20.3"
+    cssfilter "0.0.10"
+
 yallist@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"