Organize components, switch auth to not use session

2021-03-30 21:38:12 -07:00
parent 464f336790
commit e61a1080f7
36 changed files with 111 additions and 869 deletions
--- a/components/ui/Categories.vue
+++ b/components/ui/Categories.vue
@@ -0,0 +1,132 @@
+<template>
+  <div class="categories">
+    <p v-if="categories.includes('fabric')">
+      <FabricLoader aria-hidden="true" />
+      Fabric
+    </p>
+    <p v-if="categories.includes('forge')">
+      <ForgeLoader aria-hidden="true" />
+      Forge
+    </p>
+    <p v-if="categories.includes('technology')">
+      <TechCategory aria-hidden="true" />
+      Technology
+    </p>
+    <p v-if="categories.includes('adventure')">
+      <AdventureCategory aria-hidden="true" />
+      Adventure
+    </p>
+    <p v-if="categories.includes('magic')">
+      <MagicCategory aria-hidden="true" />
+      Magic
+    </p>
+    <p v-if="categories.includes('utility')">
+      <UtilityCategory aria-hidden="true" />
+      Utility
+    </p>
+    <p v-if="categories.includes('decoration')">
+      <DecorationCategory aria-hidden="true" />
+      Decoration
+    </p>
+    <p v-if="categories.includes('library')">
+      <LibraryCategory aria-hidden="true" />
+      Library
+    </p>
+    <p v-if="categories.includes('cursed')">
+      <CursedCategory aria-hidden="true" />
+      Cursed
+    </p>
+    <p v-if="categories.includes('worldgen')">
+      <WorldGenCategory aria-hidden="true" />
+      Worldgen
+    </p>
+    <p v-if="categories.includes('storage')">
+      <StorageCategory aria-hidden="true" />
+      Storage
+    </p>
+    <p v-if="categories.includes('food')">
+      <FoodCategory aria-hidden="true" />
+      Food
+    </p>
+    <p v-if="categories.includes('equipment')">
+      <EquipmentCategory aria-hidden="true" />
+      Equipment
+    </p>
+    <p v-if="categories.includes('misc')">
+      <MiscCategory aria-hidden="true" />
+      Misc
+    </p>
+  </div>
+</template>
+
+<script>
+import TechCategory from '~/assets/images/categories/tech.svg'
+import AdventureCategory from '~/assets/images/categories/adventure.svg'
+import CursedCategory from '~/assets/images/categories/cursed.svg'
+import DecorationCategory from '~/assets/images/categories/decoration.svg'
+import EquipmentCategory from '~/assets/images/categories/equipment.svg'
+import FoodCategory from '~/assets/images/categories/food.svg'
+import LibraryCategory from '~/assets/images/categories/library.svg'
+import MagicCategory from '~/assets/images/categories/magic.svg'
+import MiscCategory from '~/assets/images/categories/misc.svg'
+import StorageCategory from '~/assets/images/categories/storage.svg'
+import UtilityCategory from '~/assets/images/categories/utility.svg'
+import WorldGenCategory from '~/assets/images/categories/worldgen.svg'
+
+import ForgeLoader from '~/assets/images/categories/forge.svg'
+import FabricLoader from '~/assets/images/categories/fabric.svg'
+
+export default {
+  name: 'Categories',
+  components: {
+    TechCategory,
+    AdventureCategory,
+    CursedCategory,
+    DecorationCategory,
+    EquipmentCategory,
+    FoodCategory,
+    LibraryCategory,
+    MagicCategory,
+    MiscCategory,
+    StorageCategory,
+    UtilityCategory,
+    WorldGenCategory,
+    ForgeLoader,
+    FabricLoader,
+  },
+  props: {
+    categories: {
+      type: Array,
+      default() {
+        return []
+      },
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.categories {
+  @extend %row;
+  flex-wrap: wrap;
+
+  p {
+    display: flex;
+    align-items: center;
+    flex-direction: row;
+    background-color: var(--color-category-bg);
+    border-radius: var(--size-rounded-max);
+    color: var(--color-category-text);
+    margin-top: 0.25em;
+    margin-bottom: 0.25em;
+    margin-right: 0.5em;
+    padding: 0.4em 0.7em;
+    font-size: var(--font-size-sm);
+    height: 1em;
+    svg {
+      width: 15px;
+      margin-right: 5px;
+    }
+  }
+}
+</style>