From 65115f61cd16abaaece1c781b2f35f228fcd516d Mon Sep 17 00:00:00 2001
From: Gamebrary <contact@gamebrary.com>
Date: Fri, 25 Sep 2020 17:09:20 -0700
Subject: [PATCH] updated UI wip

---
 package.json                                  |   5 +-
 src/App.vue                                   |  21 +-
 src/components/Boards.vue                     |   7 +-
 src/components/PageHeader.vue                 | 155 ++++++--
 src/components/Settings.vue                   |  59 ---
 src/components/Settings/About.vue             |   7 +-
 src/components/Settings/AccountModal.vue      |   6 +-
 src/components/Settings/ReleasesModal.vue     |  32 --
 src/components/Settings/TagsSettings.vue      | 326 ----------------
 src/components/Settings/Themes.vue            |   4 +-
 src/pages/About.vue                           |  88 +++++
 .../Settings => pages}/Account.vue            |   4 +-
 src/pages/Board.vue                           |   3 +-
 src/pages/Dashboard.vue                       |  93 +----
 .../Settings => pages}/Language.vue           |  38 +-
 .../Settings => pages}/Releases.vue           |  54 +--
 src/pages/Tags.vue                            | 350 ++++++++++++++++++
 src/pages/Themes.vue                          |  94 +++++
 .../Wallpapers.vue}                           |  27 +-
 src/router.js                                 |  63 ++++
 src/styles/styles.scss                        |   2 +
 src/themes.js                                 |  21 ++
 ...logo-black.png => gamebrary-logo-dark.png} | Bin
 yarn.lock                                     | 303 +++++++++++++--
 24 files changed, 1131 insertions(+), 631 deletions(-)
 delete mode 100644 src/components/Settings.vue
 delete mode 100644 src/components/Settings/ReleasesModal.vue
 delete mode 100644 src/components/Settings/TagsSettings.vue
 create mode 100644 src/pages/About.vue
 rename src/{components/Settings => pages}/Account.vue (98%)
 rename src/{components/Settings => pages}/Language.vue (80%)
 rename src/{components/Settings => pages}/Releases.vue (52%)
 create mode 100644 src/pages/Tags.vue
 create mode 100644 src/pages/Themes.vue
 rename src/{components/Settings/WallpaperSettings.vue => pages/Wallpapers.vue} (92%)
 rename static/{gamebrary-logo-black.png => gamebrary-logo-dark.png} (100%)

diff --git a/package.json b/package.json
index a6928bb0..af4cb124 100644
--- a/package.json
+++ b/package.json
@@ -18,8 +18,8 @@
     },
     "dependencies": {
         "axios": "^0.19.0",
-        "bootstrap": "^4.5.0",
-        "bootstrap-vue": "^2.16.0",
+        "bootstrap": "^4.5.2",
+        "bootstrap-vue": "^2.17.3",
         "firebase": "^7.19.0",
         "firebase-admin": "^9.1.1",
         "firebase-functions": "^3.11.0",
@@ -32,6 +32,7 @@
         "raven-js": "^3.27.0",
         "sass-loader": "^7.0.1",
         "sw-precache-webpack-plugin": "^0.11.5",
+        "tailwindcss": "^1.8.10",
         "translate-json-object": "^2.3.3",
         "vue": "^2.6.11",
         "vue-analytics": "^5.16.0",
diff --git a/src/App.vue b/src/App.vue
index e3831e2d..8e96e8be 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,12 +1,14 @@
 <template>
   <div
     id="app"
-    class="mvh-100 d-flex flex-column"
     :dir="dir"
   >
     <page-header />
-    <router-view v-if="user" />
-    <authorizing v-else />
+    <main>
+      <router-view />
+    </main>
+    <!-- <router-view v-if="user" />
+    <authorizing v-else /> -->
     <session-expired />
   </div>
 </template>
@@ -72,6 +74,8 @@ export default {
         return;
       }
 
+      // TODO: move this logic to the authorizing page
+
       firebase.auth().getRedirectResult().then(({ additionalUserInfo, user }) => {
         if (additionalUserInfo && additionalUserInfo.isNewUser) {
           this.$store.dispatch('SEND_WELCOME_EMAIL', additionalUserInfo);
@@ -257,8 +261,13 @@ export default {
 
 <style lang="scss" rel="stylesheet/scss" scoped>
   #app {
-    // display: flex;
-    // flex-direction: column;
-    // min-height: 100vh;
+  }
+
+  main {
+    position: fixed;
+    left: 50px;
+    height: 100vh;
+    width: calc(100vw - 50px);
+    overflow-y: auto;
   }
 </style>
diff --git a/src/components/Boards.vue b/src/components/Boards.vue
index 9605053a..c02bda36 100644
--- a/src/components/Boards.vue
+++ b/src/components/Boards.vue
@@ -1,9 +1,14 @@
 <template lang="html">
   <div>
+    <!-- TODO: allow board settings to be accessed here -->
+    <!-- TODO: allow to override backdrop using search -->
     <div class="d-flex justify-content-between align-items-center">
       <h5>Boards</h5>
 
-      <create-board />
+      <div>
+        <b-button>Change backdrop</b-button>
+        <create-board />
+      </div>
     </div>
 
     <div class="text-right" v-if="!loading && !boards.length">
diff --git a/src/components/PageHeader.vue b/src/components/PageHeader.vue
index 571c87a9..e3e76ca4 100755
--- a/src/components/PageHeader.vue
+++ b/src/components/PageHeader.vue
@@ -1,51 +1,132 @@
 <template lang="html">
-  <b-navbar class="px-3 py-2 border-0 shadow-none" fixed="top">
-    <b-navbar-brand :to="{ name: 'home' }" class="border-0 p-0 mr-1">
-      <img src="/static/gamebrary-logo.png" height="30" />
+  <nav
+    class="position-fixed d-flex flex-column p-0 vh-100 text-center border-right border-light"
+  >
+    <router-link :to="{ name: 'home' }" class="mt-2">
+      <!-- TODO: use svg, change color based on theme -->
+      <img :src="logoUrl" width="32" />
+    </router-link>
 
-      <b-dropdown
-        v-if="showBoardsDropdown"
-        variant="transparent"
-        toggle-class="p-0 px-1"
-        :text="board.name"
+    <b-dropdown
+      v-if="showBoardsDropdown"
+      variant="transparent"
+      toggle-class="p-0 px-1"
+      :text="board.name"
+    >
+      <b-dropdown-item
+        :to="`/board/${id}`"
+        :key="id"
+        variant="outline-primary"
+        v-for="{ name, id } in sortedBoards"
+        :active="board.id === id"
       >
-        <b-dropdown-item
-          :to="`/board/${id}`"
-          :key="id"
-          variant="outline-primary"
-          v-for="{ name, id } in sortedBoards"
-          :active="board.id === id"
-        >
-          {{ name }}
-        </b-dropdown-item>
-      </b-dropdown>
+        <b-icon-arrow-left-right />
+      </b-dropdown-item>
+    </b-dropdown>
 
-      <b-button
-        v-else-if="showBoardTitle"
-        class="p-0 px-1"
-        variant="transparent"
-      >
-        {{ board.name }}
-      </b-button>
-    </b-navbar-brand>
+    <!-- <b-button
+      v-else-if="showBoardTitle"
+      class="p-0 px-1"
+      variant="transparent"
+    >
+      {{ board.name }}
+    </b-button> -->
 
-    <settings />
-  </b-navbar>
+    <router-link
+      title="Tags"
+      v-b-tooltip.hover.right
+      :to="{ name: 'tags' }"
+      class="py-2 mt-1"
+    >
+      <b-icon-tags :variant="routeName === 'tags' ? 'primary' : 'secondary'" />
+    </router-link>
+
+    <router-link
+      title="Wallpapers"
+      v-b-tooltip.hover.right
+      class="py-2 mt-1"
+      :to="{ name: 'wallpapers' }"
+    >
+      <b-icon-file-richtext :variant="routeName === 'wallpapers' ? 'primary' : 'secondary'" />
+    </router-link>
+
+    <router-link
+      title="Language"
+      v-b-tooltip.hover.right
+      :to="{ name: 'language' }"
+      class="py-2 mt-1"
+    >
+      <b-icon-chat-left-text :variant="routeName === 'language' ? 'primary' : 'secondary'" />
+    </router-link>
+    <router-link
+      title="Themes"
+      v-b-tooltip.hover.right
+      :to="{ name: 'themes' }"
+      class="py-2 mt-1"
+    >
+      <b-icon-droplet :variant="routeName === 'themes' ? 'primary' : 'secondary'" />
+    </router-link>
+    <router-link
+      title="Releases"
+      v-b-tooltip.hover.right
+      class="py-2 mt-1"
+      :to="{ name: 'releases' }"
+    >
+      <b-icon-mailbox :variant="routeName === 'releases' ? 'primary' : 'secondary'" />
+    </router-link>
+
+    <router-link
+      title="About"
+      v-b-tooltip.hover.right
+      class="py-2 mt-1"
+      :to="{ name: 'about' }"
+    >
+      <b-icon-question :variant="routeName === 'about' ? 'primary' : 'secondary'"  />
+
+      <!-- <span class="d-none d-sm-block">
+        About
+      </span> -->
+    </router-link>
+
+    <router-link
+      class="mt-auto mb-2"
+      title="Account"
+      v-b-tooltip.hover.right
+      :to="{ name: 'account' }"
+    >
+      <b-avatar
+        v-if="user && user.photoURL"
+        variant="info"
+        small
+        :badge="notification"
+        badge-variant="danger"
+        :src="user.photoURL"
+      />
+    </router-link>
+  </nav>
 </template>
 
 <script>
 import { mapState, mapGetters } from 'vuex';
-import Settings from '@/components/Settings';
 
 export default {
-  components: {
-    Settings,
-  },
-
   computed: {
-    ...mapState(['board']),
+    ...mapState(['board', 'user', 'notification', 'settings']),
     ...mapGetters(['sortedBoards']),
 
+    logoUrl() {
+      const { settings } = this;
+
+      // TODO: use optional chaining
+      const isDark = settings && settings.theme && settings.theme.dark;
+
+      return `/static/gamebrary-logo${isDark ? '' : '-dark'}.png`;
+    },
+
+    routeName() {
+      return this.$route.name;
+    },
+
     showBoardTitle() {
       return this.$route.name === 'board' && this.board.name;
     },
@@ -56,3 +137,9 @@ export default {
   },
 };
 </script>
+
+<style lang="scss" rel="stylesheet/scss" scoped>
+nav {
+  width: 50px;
+}
+</style>
diff --git a/src/components/Settings.vue b/src/components/Settings.vue
deleted file mode 100644
index 78cf85bf..00000000
--- a/src/components/Settings.vue
+++ /dev/null
@@ -1,59 +0,0 @@
-`<template lang="html">
-  <b-navbar-nav class="ml-auto" v-if="user">
-    <b-dropdown
-      variant="link"
-      v-b-tooltip.hover.left
-      :title="notification ? 'New releases' : ''"
-      toggle-class="text-decoration-none p-0"
-      right
-    >
-      <template v-slot:button-content>
-        <b-avatar
-          v-if="user && user.photoURL"
-          variant="info"
-          square
-          :badge="notification"
-          badge-variant="danger"
-          :src="user.photoURL"
-        />
-      </template>
-
-      <tags-settings />
-      <wallpaper-settings />
-      <language />
-      <themes />
-      <b-dropdown-divider />
-      <releases-modal />
-      <about />
-      <b-dropdown-divider />
-      <account-modal />
-    </b-dropdown>
-  </b-navbar-nav>
-</template>
-
-<script>
-import TagsSettings from '@/components/Settings/TagsSettings';
-import AccountModal from '@/components/Settings/AccountModal';
-import WallpaperSettings from '@/components/Settings/WallpaperSettings';
-import ReleasesModal from '@/components/Settings/ReleasesModal';
-import Themes from '@/components/Settings/Themes';
-import Language from '@/components/Settings/Language';
-import About from '@/components/Settings/About';
-import { mapState } from 'vuex';
-
-export default {
-  components: {
-    TagsSettings,
-    AccountModal,
-    WallpaperSettings,
-    ReleasesModal,
-    Themes,
-    Language,
-    About,
-  },
-
-  computed: {
-    ...mapState(['user', 'notification']),
-  },
-};
-</script>
diff --git a/src/components/Settings/About.vue b/src/components/Settings/About.vue
index 69454c67..4948ee1d 100644
--- a/src/components/Settings/About.vue
+++ b/src/components/Settings/About.vue
@@ -1,7 +1,10 @@
 <template lang="html">
-  <b-dropdown-item v-b-modal:about>
+  <b-dropdown-item v-b-modal:about title="About" v-b-tooltip.hover.right>
     <b-icon-question class="mr-1" />
-    About
+
+    <span class="d-none d-sm-block">
+      About
+    </span>
 
     <b-modal
       id="about"
diff --git a/src/components/Settings/AccountModal.vue b/src/components/Settings/AccountModal.vue
index 62953dd9..53d5cf1b 100644
--- a/src/components/Settings/AccountModal.vue
+++ b/src/components/Settings/AccountModal.vue
@@ -1,7 +1,9 @@
 <template lang="html">
-  <b-dropdown-item v-b-modal:account-settings>
+  <b-dropdown-item v-b-modal:account-settings title="Account" v-b-tooltip.hover.right>
     <b-icon-person class="mr-1" />
-    Account
+    <span class="d-none d-sm-block">
+      Account
+    </span>
 
     <b-modal
       id="account-settings"
diff --git a/src/components/Settings/ReleasesModal.vue b/src/components/Settings/ReleasesModal.vue
deleted file mode 100644
index dbb5e319..00000000
--- a/src/components/Settings/ReleasesModal.vue
+++ /dev/null
@@ -1,32 +0,0 @@
-<template lang="html">
-  <b-dropdown-item v-b-modal:releases>
-    <b-icon-mailbox class="mr-1" />
-    Releases <b-badge variant="success" v-if="notification">New release!</b-badge>
-
-    <b-modal
-      id="releases"
-      title="Releases"
-      modal-class="releases"
-      scrollable
-      hide-footer
-      size="lg"
-    >
-      <releases />
-    </b-modal>
-  </b-dropdown-item>
-</template>
-
-<script>
-import Releases from '@/components/Settings/Releases';
-import { mapState } from 'vuex';
-
-export default {
-  components: {
-    Releases,
-  },
-
-  computed: {
-    ...mapState(['notification']),
-  },
-};
-</script>
diff --git a/src/components/Settings/TagsSettings.vue b/src/components/Settings/TagsSettings.vue
deleted file mode 100644
index 0f3e559e..00000000
--- a/src/components/Settings/TagsSettings.vue
+++ /dev/null
@@ -1,326 +0,0 @@
-<template lang="html">
-  <b-dropdown-item v-b-modal:tags-settings>
-    <b-icon-tags class="mr-1" />
-    Tags
-
-    <b-modal
-      id="tags-settings"
-      title="Manage Tags"
-      hide-footer
-      @show="setLocalTags"
-    >
-      <form
-        ref="newTagForm"
-        @submit.stop.prevent="submit"
-      >
-        <h6>Add new tag</h6>
-
-        <b-row class="mb-3">
-          <b-col cols="8" md="9">
-            <b-form-input
-              label="test"
-              maxlength="20"
-              :placeholder="$t('tags.inputPlaceholder')"
-              required
-              v-model.trim="tagName"
-            />
-          </b-col>
-
-          <b-col cols="4" md="3">
-            <b-input-group>
-              <b-form-input
-                v-model="hex"
-                type="color"
-                required
-              />
-
-              <b-form-input
-                v-model="tagTextColor"
-                type="color"
-                required
-              />
-            </b-input-group>
-          </b-col>
-        </b-row>
-
-        <b-row class="mb-2">
-          <b-col sm="8">
-            <template v-if="tagName">
-              Preview:
-
-              <b-badge :style="`background-color: ${hex}; color: ${tagTextColor}`">
-                {{ tagName }}
-              </b-badge>
-            </template>
-          </b-col>
-
-          <b-col sm="4" class="d-flex justify-content-end">
-            <b-button
-              variant="primary"
-              :disabled="isDuplicate || saving || !Boolean(tagName)"
-              @click="submit"
-            >
-              <b-spinner small v-if="saving" />
-              <span v-else>Save</span>
-            </b-button>
-          </b-col>
-        </b-row>
-
-        <b-alert
-          class="mt-3 mb-0"
-          :show="isDuplicate"
-          variant="warning"
-        >
-          You already have a tag named <strong>{{ tagName }}</strong>
-        </b-alert>
-      </form>
-
-      <template v-if="gameTags && localTags">
-        <hr>
-
-        <h6>My tags</h6>
-
-        <b-list-group>
-          <b-list-group-item
-            class="d-flex justify-content-between align-items-center p-2"
-            v-for="({ games, hex, tagTextColor }, name) in localTags"
-            :key="name"
-          >
-            <b-badge
-              pill
-              tag="small"
-              :style="`background-color: ${hex}; color: ${tagTextColor}`"
-            >
-              {{ name }}
-            </b-badge>
-
-            <div>
-              <b-button
-                variant="primary"
-                @click="editTag(name)"
-              >
-                <b-icon-pencil />
-              </b-button>
-
-              <b-button
-                variant="danger"
-                @click="deleteTag(name)"
-              >
-                <b-icon-trash />
-              </b-button>
-            </div>
-          </b-list-group-item>
-        </b-list-group>
-
-        <!-- TODO: move to component -->
-        <b-modal id="editTag">
-          <template v-slot:modal-title>
-            Edit <strong>{{ editingOriginalTagName }}</strong> tag
-          </template>
-
-          <form
-            ref="editTagForm"
-            @submit.stop.prevent="saveTag"
-          >
-            <b-row class="mb-3" v-if="editingTag">
-              <b-col sm="8">
-                <b-form-input
-                  label="test"
-                  maxlength="20"
-                  :placeholder="$t('tags.inputPlaceholder')"
-                  required
-                  v-model.trim="editingTagName"
-                />
-              </b-col>
-
-              <b-col sm="4">
-                <b-input-group>
-                  <b-form-input
-                    v-model="editingTag.hex"
-                    type="color"
-                    required
-                  />
-
-                  <b-form-input
-                    v-model="editingTag.tagTextColor"
-                    type="color"
-                    required
-                  />
-                </b-input-group>
-              </b-col>
-            </b-row>
-
-            <template v-if="editingTagName">
-              Preview:
-
-              <b-badge
-                :style="`background-color: ${editingTag.hex}; color: ${editingTag.tagTextColor}`"
-              >
-                {{ editingTagName }}
-              </b-badge>
-            </template>
-          </form>
-
-          <template v-slot:modal-footer="{ cancel }">
-            <b-button @click="cancel">
-              Cancel
-            </b-button>
-
-            <b-button
-              variant="primary"
-              :disabled="isEditedNameDuplicate || !Boolean(editingTagName) || saving"
-              @click="saveTag"
-            >
-              <b-spinner small v-if="saving" />
-              <span v-else>Save</span>
-            </b-button>
-          </template>
-
-          <b-alert
-            class="mt-3 mb-0"
-            :show="isEditedNameDuplicate && !saving"
-            variant="warning"
-          >
-            You already have a tag named <strong>{{ editingTagName }}</strong>
-          </b-alert>
-        </b-modal>
-      </template>
-    </b-modal>
-  </b-dropdown-item>
-</template>
-
-<script>
-import { mapState } from 'vuex';
-
-export default {
-  data() {
-    return {
-      saving: false,
-      tagName: '',
-      hex: '#143D59',
-      tagTextColor: '#F4B41A',
-      exclusive: false,
-      editingTag: {},
-      editingTagName: '',
-      editingOriginalTagName: '',
-      localTags: {},
-    };
-  },
-
-  computed: {
-    ...mapState(['tags', 'platform']),
-
-    isDuplicate() {
-      const { tagName, localTags } = this;
-
-      const tagNames = Object.keys(localTags)
-        .filter(name => name !== tagName)
-        .map(name => name.toLowerCase());
-
-      return tagNames.includes(tagName.toLowerCase());
-    },
-
-    isEditedNameDuplicate() {
-      const { editingOriginalTagName, editingTagName, localTags } = this;
-
-      const tagNames = Object.keys(localTags)
-        .filter(name => name !== editingOriginalTagName)
-        .map(tagName => tagName.toLowerCase());
-
-      return tagNames.includes(editingTagName.toLowerCase());
-    },
-
-    gameTags() {
-      return Object.keys(this.localTags).length > 0;
-    },
-  },
-
-  methods: {
-    setLocalTags() {
-      this.localTags = JSON.parse(JSON.stringify(this.tags));
-    },
-
-    editTag(tagName) {
-      this.editingTagName = tagName;
-      this.editingOriginalTagName = tagName;
-      this.editingTag = JSON.parse(JSON.stringify(this.localTags[tagName]));
-      this.$bvModal.show('editTag');
-    },
-
-    async saveTag(e) {
-      e.preventDefault();
-
-      if (this.$refs.editTagForm.checkValidity()) {
-        const { editingTagName, editingOriginalTagName, editingTag } = this;
-
-        const renaming = editingTagName.toLowerCase() !== editingOriginalTagName.toLowerCase();
-
-        if (renaming) {
-          this.$delete(this.localTags, editingOriginalTagName);
-          this.$set(this.localTags, editingTagName, editingTag);
-
-          await this.saveTags(true);
-        } else {
-          this.localTags[editingOriginalTagName] = JSON.parse(JSON.stringify(editingTag));
-
-          this.saveTags();
-        }
-      }
-    },
-
-    submit(e) {
-      e.preventDefault();
-
-      if (this.$refs.newTagForm.checkValidity()) {
-        this.createTag();
-      }
-    },
-
-    reset() {
-      this.tagName = '';
-      this.hex = '#143D59';
-      this.tagTextColor = '#F4B41A';
-    },
-
-    createTag() {
-      const { hex, tagTextColor, tagName } = this;
-
-      const newTag = {
-        games: [],
-        hex,
-        tagTextColor,
-      };
-
-      this.$set(this.localTags, tagName, newTag);
-      this.saveTags();
-    },
-
-    deleteTag(tagName) {
-      this.$delete(this.localTags, tagName);
-      this.saveTags(true);
-    },
-
-    async saveTags(deleting) {
-      this.saving = true;
-      const action = deleting
-        ? 'SAVE_TAGS_NO_MERGE'
-        : 'SAVE_TAGS';
-
-      await this.$store.dispatch(action, this.localTags)
-        .catch(() => {
-          this.saving = false;
-          this.$store.commit('SET_SESSION_EXPIRED', true);
-        });
-
-      const message = deleting
-        ? 'Tags saved'
-        : 'Tag added';
-
-      this.$bvModal.hide('editTag');
-      this.$bvToast.toast(message, { title: 'Success', variant: 'success' });
-      this.reset();
-      this.saving = false;
-    },
-  },
-};
-</script>
diff --git a/src/components/Settings/Themes.vue b/src/components/Settings/Themes.vue
index b9616465..89efaa22 100644
--- a/src/components/Settings/Themes.vue
+++ b/src/components/Settings/Themes.vue
@@ -1,7 +1,7 @@
 <template lang="html">
-  <b-dropdown-item v-b-modal:themes>
+  <b-dropdown-item v-b-modal:themes title="Themes" v-b-tooltip.hover.right>
     <b-icon-droplet class="mr-1" />
-    Themes
+    <span class="d-none d-sm-block">Themes</span>
 
     <b-modal
       id="themes"
diff --git a/src/pages/About.vue b/src/pages/About.vue
new file mode 100644
index 00000000..cd0992bc
--- /dev/null
+++ b/src/pages/About.vue
@@ -0,0 +1,88 @@
+<template lang="html">
+  <b-container>
+    <h2>About Gamebrary</h2>
+
+    <vue-markdown
+      class="w-100"
+      v-if="readme"
+      :source="readme"
+    />
+
+    <div v-if="repo">
+      <b-button
+        size="sm"
+        href="https://github.com/romancm/gamebrary/subscription"
+        target="_blank"
+      >
+        Watch <b-badge variant="light">{{ repo.watchers }}</b-badge>
+      </b-button>
+
+      <b-button
+        size="sm"
+        href="https://github.com/romancm/gamebrary"
+        target="_blank"
+      >
+        Star <b-badge variant="light">{{ repo.stargazers_count }}</b-badge>
+      </b-button>
+
+      <b-button
+        size="sm"
+        href="https://github.com/romancm/gamebrary/fork"
+        target="_blank"
+      >
+        Fork <b-badge variant="light">{{ repo.forks }}</b-badge>
+      </b-button>
+
+      <b-button
+        size="sm"
+        href="https://github.com/romancm/gamebrary/issues"
+        target="_blank"
+      >
+        Issues <b-badge variant="light">{{ repo.open_issues }}</b-badge>
+      </b-button>
+    </div>
+
+    <small>©{{ currentYear }} Gamebrary</small>
+  </b-container>
+</template>
+
+<script>
+import VueMarkdown from 'vue-markdown';
+import moment from 'moment';
+import Placeholder from '@/components/Placeholder';
+
+export default {
+  components: {
+    VueMarkdown,
+    Placeholder,
+  },
+
+  data() {
+    return {
+      readme: null,
+      repo: null,
+    };
+  },
+
+  computed: {
+    currentYear() {
+      return new Date().getFullYear();
+    },
+  },
+
+  mounted() {
+    this.load();
+  },
+
+  methods: {
+    formatDate(date) {
+      return moment(date).format('LL');
+    },
+
+    async load() {
+      this.readme = await this.$store.dispatch('LOAD_GITHUB_README');
+      this.repo = await this.$store.dispatch('LOAD_GITHUB_REPOSITORY');
+    },
+  },
+};
+</script>
diff --git a/src/components/Settings/Account.vue b/src/pages/Account.vue
similarity index 98%
rename from src/components/Settings/Account.vue
rename to src/pages/Account.vue
index f07f3707..9da8c6e8 100644
--- a/src/components/Settings/Account.vue
+++ b/src/pages/Account.vue
@@ -1,5 +1,5 @@
 <template lang="html">
-  <div>
+  <b-container>
     <b-list-group flush>
       <b-list-group-item>
         <b-avatar
@@ -53,7 +53,7 @@
         <sign-out />
       </b-list-group-item>
     </b-list-group>
-  </div>
+  </b-container>
 </template>
 
 <script>
diff --git a/src/pages/Board.vue b/src/pages/Board.vue
index f4537aad..b4e8727c 100755
--- a/src/pages/Board.vue
+++ b/src/pages/Board.vue
@@ -164,7 +164,8 @@ export default {
   background-size: cover;
   align-items: flex-start;
   height: 100vh;
-  padding: 58px 1rem 0;
+  width: 100%;
+  padding: 1rem;
   box-sizing: border-box;
   overflow-x: auto;
   overflow-x: overlay;
diff --git a/src/pages/Dashboard.vue b/src/pages/Dashboard.vue
index 819b1e3c..bf29301e 100644
--- a/src/pages/Dashboard.vue
+++ b/src/pages/Dashboard.vue
@@ -1,102 +1,31 @@
 <template lang="html">
-  <div :style="`
-    background-image: linear-gradient(transparent, #222 50%), url(${ coverScreenshot });
+  <div  :style="`
     background-size: 100%;
     background-repeat: no-repeat;
   `"
   >
+    <!-- background-image: linear-gradient(transparent, #222 50%), url(${ coverScreenshot }); -->
+    <b-container>
 
-  <div class="hero text-center py-5 my-5">
-    <h3>Welcome to Gamebrary</h3>
-    <p class="lead">The open source video game collection management tool.</p>
-    <small v-if="coverGame">Screenshot from <strong>{{ coverGame.name }}</strong></small>
-  </div>
-
-    <div class="container dashboard">
-      <b-tabs
-        v-model="activeTab"
-        pills
-        card
-        no-fade
-        vertical
-        nav-wrapper-class="col-12 col-sm-auto"
-        nav-class="rounded p-0 bg-transparent mb-4 mb-sm-0 mr-sm-3"
-        content-class="rounded p-0"
-        active-tab-class="p-0"
-      >
-        <b-tab title-link-class="p-2 px-5" title="Boards" active>
-          <boards />
-        </b-tab>
-
-        <b-tab title-link-class="p-2 px-5" title="Settings">
-          <h5 class="mb-2">Settings</h5>
-
-          <b-card
-            v-b-modal:tags-settings
-            class="clickable w-100 mb-3"
-          >
-          <template v-slot:header>
-            <b-icon icon="tags" />
-            Manage game tags
-          </template>
-
-          <p>Tags are a great way to organize and manage your video game collection.
-            Add, edit or delete tags.</p>
-          </b-card>
-
-          <b-card
-            v-b-modal:wallpapers
-            header="Wallpapers"
-            class="clickable w-100 mb-3"
-          >
-            <b-card-text>
-              Manage board wallpapers
-            </b-card-text>
-          </b-card>
-
-          <b-card
-            v-b-modal:language
-            header="Language"
-            class="clickable w-100 mb-3"
-          >
-            <b-card-text>
-              Change language
-            </b-card-text>
-          </b-card>
-
-          <b-card
-            v-b-modal:themes
-            header="Theme"
-            class="clickable w-100 mb-3"
-          >
-            <b-card-text>
-              Change UI theme
-            </b-card-text>
-          </b-card>
-        </b-tab>
-
-        <b-tab title-link-class="p-2 px-5" title="Account" lazy>
-          <h5 class="mb-2">Account</h5>
-
-          <account />
-        </b-tab>
-      </b-tabs>
+    <div class="hero text-center py-5">
+      <h3>Welcome to Gamebrary</h3>
+      <p class="lead">The open source video game collection management tool.</p>
+      <small v-if="coverGame">Screenshot from <strong>{{ coverGame.name }}</strong></small>
     </div>
 
-    <page-footer />
+      <boards />
+
+      <page-footer />
+    </b-container>
   </div>
 </template>
 
 <script>
 import PageFooter from '@/components/PageFooter';
-import Account from '@/components/Settings/Account';
-import Releases from '@/components/Settings/Releases';
 import Boards from '@/components/Boards';
 
 export default {
   components: {
-    Account,
-    Releases,
     PageFooter,
     Boards,
   },
diff --git a/src/components/Settings/Language.vue b/src/pages/Language.vue
similarity index 80%
rename from src/components/Settings/Language.vue
rename to src/pages/Language.vue
index e17e250e..083015a6 100644
--- a/src/components/Settings/Language.vue
+++ b/src/pages/Language.vue
@@ -1,15 +1,14 @@
 <template lang="html">
-  <b-dropdown-item v-b-modal:language>
-    <b-icon-chat-left-text class="mr-1" />
-    {{ $t('settings.language') }}
+  <b-container-fluid>
+    <b-jumbotron
+      header="Language"
+      header-level="5"
+      fluid
+      lead="Contributors wanted"
+    />
 
-    <b-modal
-      id="language"
-      title="Language"
-      hide-footer
-      @show="show"
-    >
-      <b-form-select v-model="language" class="mb-2">
+    <b-container>
+      <b-form-select v-model="language" class="mb-2 w-50">
         <b-form-select-option
           v-for="{ flag, code } in languages"
           :key="code"
@@ -19,15 +18,18 @@
         </b-form-select-option>
       </b-form-select>
 
+      <br>
+
       <b-button
         :disabled="saving"
+        variant="primary"
         @click="saveSettings"
       >
         <b-spinner small v-if="saving" />
         <span v-else>Save and reload browser</span>
       </b-button>
-    </b-modal>
-  </b-dropdown-item>
+    </b-container>
+  </b-container-fluid>
 </template>
 
 <script>
@@ -56,13 +58,13 @@ export default {
     ...mapState(['settings']),
   },
 
+  mounted() {
+    const { settings } = this;
+
+    this.language = settings.language || 'en';
+  },
+
   methods: {
-    show() {
-      const { settings } = this;
-
-      this.language = settings.language || 'en';
-    },
-
     saveSettings() {
       const { language, settings } = this;
 
diff --git a/src/components/Settings/Releases.vue b/src/pages/Releases.vue
similarity index 52%
rename from src/components/Settings/Releases.vue
rename to src/pages/Releases.vue
index 137fd5fc..96b8554b 100644
--- a/src/components/Settings/Releases.vue
+++ b/src/pages/Releases.vue
@@ -1,28 +1,38 @@
 <template lang="html">
-  <div class="releases">
-    <b-card
-      v-for="release in releases"
-      :key="release.id"
-      header-tag="header"
-      hide-footer
-      class="mb-3"
-    >
-      <template v-slot:header>
-        <h6 class="mb-0">
-          <b-badge>{{ release.tag_name }}</b-badge>
-          {{ release.name }}
-        </h6>
-      </template>
+  <b-container-fluid>
+    <b-jumbotron
+      header="Themes"
+      header-level="5"
+      fluid
+      lead="Select a theme below"
+    />
 
-      <small class="text-muted">
-        {{ $t('releases.published', { date: formatDate(release.published_at) }) }}
-      </small>
+    <b-container>
+      <!-- TODO: add releases selector, only display latest by default -->
+      <b-card
+        v-for="release in releases"
+        :key="release.id"
+        header-tag="header"
+        hide-footer
+        class="mb-3"
+      >
+        <template v-slot:header>
+          <h6 class="mb-0">
+            <b-badge>{{ release.tag_name }}</b-badge>
+            {{ release.name }}
+          </h6>
+        </template>
 
-      <b-card-text>
-        <vue-markdown :source="release.body" class="w-100" />
-      </b-card-text>
-    </b-card>
-  </div>
+        <small class="text-muted">
+          {{ $t('releases.published', { date: formatDate(release.published_at) }) }}
+        </small>
+
+        <b-card-text>
+          <vue-markdown :source="release.body" class="w-100 releases" />
+        </b-card-text>
+      </b-card>
+    </b-container>
+  </b-container-fluid>
 </template>
 
 <script>
diff --git a/src/pages/Tags.vue b/src/pages/Tags.vue
new file mode 100644
index 00000000..5fbc3c9e
--- /dev/null
+++ b/src/pages/Tags.vue
@@ -0,0 +1,350 @@
+<template lang="html">
+  <b-container-fluid>
+    <b-jumbotron
+      header="Tags"
+      header-level="5"
+      fluid
+      lead="Tags are a great way to organize and manage your video game collection. Add, edit or delete tags."
+    />
+
+    <!-- <b-skeleton-wrapper loading>
+      <template v-slot:loading>
+        <b-card>
+          <b-skeleton width="85%"></b-skeleton>
+          <b-skeleton width="55%"></b-skeleton>
+          <b-skeleton width="70%"></b-skeleton>
+        </b-card>
+      </template>
+
+      <b-card>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas viverra nunc sapien,
+        non rhoncus elit tincidunt vitae. Vestibulum maximus, ligula eu feugiat molestie,
+        massa diam imperdiet odio, vitae viverra ligula est id nisi. Aliquam ut molestie est.
+        Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac
+        turpis egestas. Phasellus at consequat dui. Aenean tristique sagittis quam,
+        sit amet sollicitudin neque sodales in.
+      </b-card>
+    </b-skeleton-wrapper> -->
+
+    <b-container>
+      <b-row>
+        <b-col>
+          <form
+            ref="newTagForm"
+            @submit.stop.prevent="submit"
+          >
+            <h6>Add new tag</h6>
+
+            <b-row class="mb-3">
+              <b-col cols="8" md="9">
+                <b-form-input
+                  label="test"
+                  maxlength="20"
+                  :placeholder="$t('tags.inputPlaceholder')"
+                  required
+                  v-model.trim="tagName"
+                />
+              </b-col>
+
+              <b-col cols="4" md="3">
+                <b-input-group>
+                  <b-form-input
+                    v-model="hex"
+                    type="color"
+                    required
+                  />
+
+                  <b-form-input
+                    v-model="tagTextColor"
+                    type="color"
+                    required
+                  />
+                </b-input-group>
+              </b-col>
+            </b-row>
+
+            <b-row class="mb-2">
+              <b-col sm="8">
+                <template v-if="tagName">
+                  Preview:
+
+                  <b-badge :style="`background-color: ${hex}; color: ${tagTextColor}`">
+                    {{ tagName }}
+                  </b-badge>
+                </template>
+              </b-col>
+
+              <b-col sm="4" class="d-flex justify-content-end">
+                <b-button
+                  variant="primary"
+                  :disabled="isDuplicate || saving || !Boolean(tagName)"
+                  @click="submit"
+                >
+                  <b-spinner small v-if="saving" />
+                  <span v-else>Save</span>
+                </b-button>
+              </b-col>
+            </b-row>
+
+            <b-alert
+              class="mt-3 mb-0"
+              :show="isDuplicate"
+              variant="warning"
+            >
+              You already have a tag named <strong>{{ tagName }}</strong>
+            </b-alert>
+          </form>
+        </b-col>
+
+        <b-col cols="8" v-if="gameTags && localTags">
+          <h6>My tags</h6>
+
+          <b-list-group>
+            <b-list-group-item
+              class="d-flex justify-content-between align-items-center p-2"
+              v-for="({ games, hex, tagTextColor }, name) in localTags"
+              :key="name"
+            >
+              <b-badge
+                pill
+                tag="small"
+                :style="`background-color: ${hex}; color: ${tagTextColor}`"
+              >
+                {{ name }}
+              </b-badge>
+
+              <div>
+                <b-button
+                  variant="primary"
+                  @click="editTag(name)"
+                >
+                  <b-icon-pencil />
+                </b-button>
+
+                <b-button
+                  variant="danger"
+                  @click="deleteTag(name)"
+                >
+                  <b-icon-trash />
+                </b-button>
+              </div>
+            </b-list-group-item>
+          </b-list-group>
+
+          <!-- TODO: move to component -->
+          <b-modal id="editTag">
+            <template v-slot:modal-title>
+              Edit <strong>{{ editingOriginalTagName }}</strong> tag
+            </template>
+
+            <form
+              ref="editTagForm"
+              @submit.stop.prevent="saveTag"
+            >
+              <b-row class="mb-3" v-if="editingTag">
+                <b-col sm="8">
+                  <b-form-input
+                    label="test"
+                    maxlength="20"
+                    :placeholder="$t('tags.inputPlaceholder')"
+                    required
+                    v-model.trim="editingTagName"
+                  />
+                </b-col>
+
+                <b-col sm="4">
+                  <b-input-group>
+                    <b-form-input
+                      v-model="editingTag.hex"
+                      type="color"
+                      required
+                    />
+
+                    <b-form-input
+                      v-model="editingTag.tagTextColor"
+                      type="color"
+                      required
+                    />
+                  </b-input-group>
+                </b-col>
+              </b-row>
+
+              <template v-if="editingTagName">
+                Preview:
+
+                <b-badge
+                  :style="`background-color: ${editingTag.hex}; color: ${editingTag.tagTextColor}`"
+                >
+                  {{ editingTagName }}
+                </b-badge>
+              </template>
+            </form>
+
+            <template v-slot:modal-footer="{ cancel }">
+              <b-button @click="cancel">
+                Cancel
+              </b-button>
+
+              <b-button
+                variant="primary"
+                :disabled="isEditedNameDuplicate || !Boolean(editingTagName) || saving"
+                @click="saveTag"
+              >
+                <b-spinner small v-if="saving" />
+                <span v-else>Save</span>
+              </b-button>
+            </template>
+
+            <b-alert
+              class="mt-3 mb-0"
+              :show="isEditedNameDuplicate && !saving"
+              variant="warning"
+            >
+              You already have a tag named <strong>{{ editingTagName }}</strong>
+            </b-alert>
+          </b-modal>
+        </b-col>
+      </b-row>
+    </b-container>
+  </b-container-fluid>
+</template>
+
+<script>
+import { mapState } from 'vuex';
+
+export default {
+  data() {
+    return {
+      saving: false,
+      tagName: '',
+      hex: '#143D59',
+      tagTextColor: '#F4B41A',
+      exclusive: false,
+      editingTag: {},
+      editingTagName: '',
+      editingOriginalTagName: '',
+      localTags: {},
+    };
+  },
+
+  computed: {
+    ...mapState(['tags', 'platform']),
+
+    isDuplicate() {
+      const { tagName, localTags } = this;
+
+      const tagNames = Object.keys(localTags)
+        .filter(name => name !== tagName)
+        .map(name => name.toLowerCase());
+
+      return tagNames.includes(tagName.toLowerCase());
+    },
+
+    isEditedNameDuplicate() {
+      const { editingOriginalTagName, editingTagName, localTags } = this;
+
+      const tagNames = Object.keys(localTags)
+        .filter(name => name !== editingOriginalTagName)
+        .map(tagName => tagName.toLowerCase());
+
+      return tagNames.includes(editingTagName.toLowerCase());
+    },
+
+    gameTags() {
+      return Object.keys(this.localTags).length > 0;
+    },
+  },
+
+  mounted() {
+    this.setLocalTags();
+  },
+
+  methods: {
+    setLocalTags() {
+      this.localTags = JSON.parse(JSON.stringify(this.tags));
+    },
+
+    editTag(tagName) {
+      this.editingTagName = tagName;
+      this.editingOriginalTagName = tagName;
+      this.editingTag = JSON.parse(JSON.stringify(this.localTags[tagName]));
+      this.$bvModal.show('editTag');
+    },
+
+    async saveTag(e) {
+      e.preventDefault();
+
+      if (this.$refs.editTagForm.checkValidity()) {
+        const { editingTagName, editingOriginalTagName, editingTag } = this;
+
+        const renaming = editingTagName.toLowerCase() !== editingOriginalTagName.toLowerCase();
+
+        if (renaming) {
+          this.$delete(this.localTags, editingOriginalTagName);
+          this.$set(this.localTags, editingTagName, editingTag);
+
+          await this.saveTags(true);
+        } else {
+          this.localTags[editingOriginalTagName] = JSON.parse(JSON.stringify(editingTag));
+
+          this.saveTags();
+        }
+      }
+    },
+
+    submit(e) {
+      e.preventDefault();
+
+      if (this.$refs.newTagForm.checkValidity()) {
+        this.createTag();
+      }
+    },
+
+    reset() {
+      this.tagName = '';
+      this.hex = '#143D59';
+      this.tagTextColor = '#F4B41A';
+    },
+
+    createTag() {
+      const { hex, tagTextColor, tagName } = this;
+
+      const newTag = {
+        games: [],
+        hex,
+        tagTextColor,
+      };
+
+      this.$set(this.localTags, tagName, newTag);
+      this.saveTags();
+    },
+
+    deleteTag(tagName) {
+      this.$delete(this.localTags, tagName);
+      this.saveTags(true);
+    },
+
+    async saveTags(deleting) {
+      this.saving = true;
+      const action = deleting
+        ? 'SAVE_TAGS_NO_MERGE'
+        : 'SAVE_TAGS';
+
+      await this.$store.dispatch(action, this.localTags)
+        .catch(() => {
+          this.saving = false;
+          this.$store.commit('SET_SESSION_EXPIRED', true);
+        });
+
+      const message = deleting
+        ? 'Tags saved'
+        : 'Tag added';
+
+      this.$bvModal.hide('editTag');
+      this.$bvToast.toast(message, { title: 'Success', variant: 'success' });
+      this.reset();
+      this.saving = false;
+    },
+  },
+};
+</script>
diff --git a/src/pages/Themes.vue b/src/pages/Themes.vue
new file mode 100644
index 00000000..3b513e23
--- /dev/null
+++ b/src/pages/Themes.vue
@@ -0,0 +1,94 @@
+<template lang="html">
+  <b-container-fluid>
+    <b-jumbotron
+      header="Themes"
+      header-level="5"
+      fluid
+      lead="Select a theme below"
+    />
+
+    <b-container>
+      <b-row>
+        <b-col
+          cols="6"
+          lg="3"
+          md="1"
+          sm="1"
+          v-for="theme in themes"
+          :key="theme.name"
+          class="mb-4"
+          @click="setTheme(theme)"
+        >
+          <b-card
+            :title="theme.name"
+            title-tag="h6"
+            body-class="p-2"
+            :border-variant="isSelected(theme) ? 'success' : ''"
+            :img-src="theme.thumbnail"
+            img-alt="Image"
+            img-top
+            tag="article"
+            style="max-width: 20rem;"
+            class="mb-2 clickable"
+          >
+            <b-card-text>
+              {{ theme.description }}
+            </b-card-text>
+          </b-card>
+        </b-col>
+      </b-row>
+    </b-container>
+  </b-container-fluid>
+</template>
+
+<script>
+import { mapState } from 'vuex';
+import themes from '@/themes';
+
+export default {
+  data() {
+    return {
+      selectedTheme: {},
+      themes,
+    };
+  },
+
+  computed: {
+    ...mapState(['settings']),
+  },
+
+  mounted() {
+    this.init();
+  },
+
+  methods: {
+    isSelected(theme) {
+      return this.selectedTheme.name && theme.name === this.selectedTheme.name;
+    },
+
+    async setTheme(theme) {
+      this.selectedTheme = theme;
+
+      document.querySelector('link[rel="stylesheet"').href = theme.cssCdn;
+
+      const settings = {
+        ...this.settings,
+        theme: this.selectedTheme,
+      };
+
+      await this.$store.dispatch('SAVE_SETTINGS', settings)
+        .catch(() => {
+          this.$bvToast.toast('There was an error saving your settings', { title: 'Error', variant: 'danger' });
+        });
+
+      this.$bvToast.toast('Settings saved', { title: 'Success', variant: 'success' });
+    },
+
+    init() {
+      const { settings } = this;
+
+      this.selectedTheme = settings.theme || null;
+    },
+  },
+};
+</script>
diff --git a/src/components/Settings/WallpaperSettings.vue b/src/pages/Wallpapers.vue
similarity index 92%
rename from src/components/Settings/WallpaperSettings.vue
rename to src/pages/Wallpapers.vue
index 96f994af..0eb181dd 100644
--- a/src/components/Settings/WallpaperSettings.vue
+++ b/src/pages/Wallpapers.vue
@@ -1,15 +1,14 @@
 <template lang="html">
-  <b-dropdown-item v-b-modal:wallpapers>
-    <b-icon-file-richtext class="mr-1" />
-    Wallpapers
-
-    <b-modal
-      id="wallpapers"
-      title="Wallpapers"
-      hide-footer
-      scrollable
-      size="lg"
-    >
+  <b-container-fluid>
+    <b-jumbotron
+      header="Wallpapers"
+      header-level="5"
+      fluid
+      lead="Manage board wallpapers"
+    />
+    <!-- TODO: show space used -->
+    <!-- TODO: allow to apply wallpaper to board from here -->
+    <b-container>
       <b-row>
         <b-col cols="12" lg="6">
           <b-form-group
@@ -39,8 +38,6 @@
         </b-col>
       </b-row>
 
-      <hr>
-
       <b-form-row v-if="wallpapers.length">
         <b-col cols="12">
           <h5>My Wallpapers</h5>
@@ -78,8 +75,8 @@
       </b-form-row>
 
       <b-alert show v-else>You don't have any wallpapers.</b-alert>
-    </b-modal>
-  </b-dropdown-item>
+    </b-container>
+  </b-container-fluid>
 </template>
 
 <script>
diff --git a/src/router.js b/src/router.js
index ddbefbb2..be9f64c2 100755
--- a/src/router.js
+++ b/src/router.js
@@ -1,6 +1,13 @@
 import Vue from 'vue';
 import Router from 'vue-router';
 import Board from '@/pages/Board';
+import About from '@/pages/About';
+import Language from '@/pages/Language';
+import Wallpapers from '@/pages/Wallpapers';
+import Tags from '@/pages/Tags';
+import Account from '@/pages/Account';
+import Themes from '@/pages/Themes';
+import Releases from '@/pages/Releases';
 import Dashboard from '@/pages/Dashboard';
 import NotFound from '@/pages/NotFound';
 
@@ -24,6 +31,62 @@ export default new Router({
         title: 'Dashboard',
       },
     },
+    {
+      name: 'about',
+      path: '/about',
+      component: About,
+      meta: {
+        title: 'About',
+      },
+    },
+    {
+      name: 'wallpapers',
+      path: '/wallpapers',
+      component: Wallpapers,
+      meta: {
+        title: 'Wallpapers',
+      },
+    },
+    {
+      name: 'tags',
+      path: '/tags',
+      component: Tags,
+      meta: {
+        title: 'Tags',
+      },
+    },
+    {
+      name: 'language',
+      path: '/language',
+      component: Language,
+      meta: {
+        title: 'Language',
+      },
+    },
+    {
+      name: 'themes',
+      path: '/themes',
+      component: Themes,
+      meta: {
+        title: 'Themes',
+      },
+    },
+    {
+      name: 'account',
+      path: '/account',
+      component: Account,
+      meta: {
+        title: 'Account',
+      },
+    },
+    {
+      name: 'releases',
+      path: '/releases',
+      component: Releases,
+      meta: {
+        title: 'Releases',
+      },
+    },
     {
       path: '/board/:id',
       name: 'board',
diff --git a/src/styles/styles.scss b/src/styles/styles.scss
index 2ed64fc2..b661148f 100755
--- a/src/styles/styles.scss
+++ b/src/styles/styles.scss
@@ -1,3 +1,5 @@
+// @import 'node_modules/bootstrap/scss/bootstrap';
+// @import 'node_modules/bootstrap-vue/src/index.scss';
 @import "_themes";
 @import "_bootstrap-overrides";
 
diff --git a/src/themes.js b/src/themes.js
index c4df5be8..2b201ddb 100644
--- a/src/themes.js
+++ b/src/themes.js
@@ -11,6 +11,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/cerulean/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/cerulean/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/cerulean/_variables.scss',
+    dark: false,
   },
   {
     name: 'Cosmo',
@@ -22,6 +23,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/cosmo/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/cosmo/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/cosmo/_variables.scss',
+    dark: false,
   },
   {
     name: 'Cyborg',
@@ -33,6 +35,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/cyborg/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/cyborg/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/cyborg/_variables.scss',
+    dark: true,
   },
   {
     name: 'Darkly',
@@ -44,6 +47,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/darkly/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/darkly/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/darkly/_variables.scss',
+    dark: true,
   },
   {
     name: 'Flatly',
@@ -55,6 +59,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/flatly/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/flatly/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/flatly/_variables.scss',
+    dark: false,
   },
   {
     name: 'Journal',
@@ -66,6 +71,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/journal/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/journal/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/journal/_variables.scss',
+    dark: false,
   },
   {
     name: 'Litera',
@@ -77,6 +83,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/litera/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/litera/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/litera/_variables.scss',
+    dark: false,
   },
   {
     name: 'Lumen',
@@ -88,6 +95,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/lumen/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/lumen/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/lumen/_variables.scss',
+    dark: false,
   },
   {
     name: 'Lux',
@@ -99,6 +107,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/lux/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/lux/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/lux/_variables.scss',
+    dark: false,
   },
   {
     name: 'Materia',
@@ -110,6 +119,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/materia/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/materia/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/materia/_variables.scss',
+    dark: false,
   },
   {
     name: 'Minty',
@@ -121,6 +131,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/minty/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/minty/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/minty/_variables.scss',
+    dark: false,
   },
   {
     name: 'Pulse',
@@ -132,6 +143,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/pulse/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/pulse/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/pulse/_variables.scss',
+    dark: false,
   },
   {
     name: 'Sandstone',
@@ -143,6 +155,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/sandstone/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/sandstone/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/sandstone/_variables.scss',
+    dark: false,
   },
   {
     name: 'Simplex',
@@ -154,6 +167,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/simplex/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/simplex/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/simplex/_variables.scss',
+    dark: false,
   },
   {
     name: 'Sketchy',
@@ -165,6 +179,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/sketchy/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/sketchy/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/sketchy/_variables.scss',
+    dark: false,
   },
   {
     name: 'Slate',
@@ -176,6 +191,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/slate/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/slate/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/slate/_variables.scss',
+    dark: true,
   },
   {
     name: 'Solar',
@@ -187,6 +203,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/solar/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/solar/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/solar/_variables.scss',
+    dark: true,
   },
   {
     name: 'Spacelab',
@@ -198,6 +215,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/spacelab/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/spacelab/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/spacelab/_variables.scss',
+    dark: false,
   },
   {
     name: 'Superhero',
@@ -209,6 +227,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/superhero/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/superhero/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/superhero/_variables.scss',
+    dark: true,
   },
   {
     name: 'United',
@@ -220,6 +239,7 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/united/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/united/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/united/_variables.scss',
+    dark: false,
   },
   {
     name: 'Yeti',
@@ -231,5 +251,6 @@ export default [
     cssCdn: 'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/yeti/bootstrap.min.css',
     scss: 'https://bootswatch.com/4/yeti/_bootswatch.scss',
     scssVariables: 'https://bootswatch.com/4/yeti/_variables.scss',
+    dark: false,
   },
 ];
diff --git a/static/gamebrary-logo-black.png b/static/gamebrary-logo-dark.png
similarity index 100%
rename from static/gamebrary-logo-black.png
rename to static/gamebrary-logo-dark.png
diff --git a/yarn.lock b/yarn.lock
index 9b4d2889..3404bcbb 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -311,6 +311,14 @@
   resolved "https://registry.yarnpkg.com/@firebase/webchannel-wrapper/-/webchannel-wrapper-0.3.0.tgz#d1689566b94c25423d1fb2cb031c5c2ea4c9f939"
   integrity sha512-VniCGPIgSGNEgOkh5phb3iKmSGIzcwrccy3IomMFRWPCMiCk2y98UQNJEoDs1yIHtZMstVjYWKYxnunIGzC5UQ==
 
+"@fullhuman/postcss-purgecss@^2.1.2":
+  version "2.3.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/@fullhuman/postcss-purgecss/-/postcss-purgecss-2.3.0.tgz#50a954757ec78696615d3e118e3fee2d9291882e"
+  integrity sha1-UKlUdX7HhpZhXT4Rjj/uLZKRiC4=
+  dependencies:
+    postcss "7.0.32"
+    purgecss "^2.3.0"
+
 "@google-cloud/common@^3.3.0":
   version "3.3.2"
   resolved "https://registry.yarnpkg.com/@google-cloud/common/-/common-3.3.2.tgz#595ce85ebbcaa8b38519336bf6747e32e7706df7"
@@ -654,7 +662,16 @@ acorn-jsx@^3.0.0:
   dependencies:
     acorn "^3.0.4"
 
-acorn-walk@^7.1.1:
+acorn-node@^1.6.1:
+  version "1.8.2"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/acorn-node/-/acorn-node-1.8.2.tgz#114c95d64539e53dede23de8b9d96df7c7ae2af8"
+  integrity sha1-EUyV1kU55T3t4j3oudlt98euKvg=
+  dependencies:
+    acorn "^7.0.0"
+    acorn-walk "^7.0.0"
+    xtend "^4.0.2"
+
+acorn-walk@^7.0.0, acorn-walk@^7.1.1:
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-7.2.0.tgz#0de889a601203909b0fbe07b8938dc21d2e967bc"
   integrity sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==
@@ -674,7 +691,7 @@ acorn@^5.0.0, acorn@^5.5.0:
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-5.7.4.tgz#3e8d8a9947d0599a1796d10225d7432f4a4acf5e"
   integrity sha512-1D++VG7BhrtvQpNbBzovKNc1FLGGEE/oGe7b9xJm/RFHMBeUaUGpluV9RLjZa47YFdPcDAenEYuq9pQPcMdLJg==
 
-acorn@^7.1.1:
+acorn@^7.0.0, acorn@^7.1.1:
   version "7.4.0"
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.0.tgz#e1ad486e6c54501634c6c397c5c121daa383607c"
   integrity sha512-+G7P8jJmCHr+S+cLfQxygbWhXy+8YTVGzAkpEbcLo2mLoL7tij/VG41QSHACSf5QgYRhMZYHuNc6drJaO0Da+w==
@@ -789,7 +806,7 @@ ansi-styles@^3.2.0, ansi-styles@^3.2.1:
   dependencies:
     color-convert "^1.9.0"
 
-ansi-styles@^4.0.0:
+ansi-styles@^4.0.0, ansi-styles@^4.1.0:
   version "4.2.1"
   resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-4.2.1.tgz#90ae75c424d008d2624c5bf29ead3177ebfcf359"
   integrity sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==
@@ -1060,6 +1077,19 @@ autoprefixer@^7.1.2:
     postcss "^6.0.17"
     postcss-value-parser "^3.2.3"
 
+autoprefixer@^9.4.5:
+  version "9.8.6"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/autoprefixer/-/autoprefixer-9.8.6.tgz#3b73594ca1bf9266320c5acf1588d74dea74210f"
+  integrity sha1-O3NZTKG/kmYyDFrPFYjXTep0IQ8=
+  dependencies:
+    browserslist "^4.12.0"
+    caniuse-lite "^1.0.30001109"
+    colorette "^1.2.1"
+    normalize-range "^0.1.2"
+    num2fraction "^1.2.2"
+    postcss "^7.0.32"
+    postcss-value-parser "^4.1.0"
+
 aws-sign2@~0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/aws-sign2/-/aws-sign2-0.7.0.tgz#b46e890934a9591f2d2f6f86d7e6a9f1b3fe76a8"
@@ -1915,21 +1945,21 @@ boolbase@^1.0.0, boolbase@~1.0.0:
   resolved "https://registry.yarnpkg.com/boolbase/-/boolbase-1.0.0.tgz#68dff5fbe60c51eb37725ea9e3ed310dcc1e776e"
   integrity sha1-aN/1++YMUes3cl6p4+0xDcwed24=
 
-bootstrap-vue@^2.16.0:
-  version "2.16.0"
-  resolved "https://registry.yarnpkg.com/bootstrap-vue/-/bootstrap-vue-2.16.0.tgz#07e7032ec9ffdd576470dc437da54f398ec16ba5"
-  integrity sha512-gLETwPmeRHCe5WHmhGxzb5PtTEuKqQPGl0TFvZ2Odbkg/7UuIHdqIexrJRerpnomP4ZzDQ+qYGL91Ls9lcQsJQ==
+bootstrap-vue@^2.17.3:
+  version "2.17.3"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/bootstrap-vue/-/bootstrap-vue-2.17.3.tgz#3d78b7b4ff992a8ad69d2ed1c7413fcfdcefaec7"
+  integrity sha1-PXi3tP+ZKorWnS7Rx0E/z9zvrsc=
   dependencies:
     "@nuxt/opencollective" "^0.3.0"
-    bootstrap ">=4.5.0 <5.0.0"
+    bootstrap ">=4.5.2 <5.0.0"
     popper.js "^1.16.1"
     portal-vue "^2.1.7"
     vue-functional-data-merge "^3.1.0"
 
-"bootstrap@>=4.5.0 <5.0.0", bootstrap@^4.5.0:
+"bootstrap@>=4.5.2 <5.0.0", bootstrap@^4.5.2:
   version "4.5.2"
-  resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.5.2.tgz#a85c4eda59155f0d71186b6e6ad9b875813779ab"
-  integrity sha512-vlGn0bcySYl/iV+BGA544JkkZP5LB3jsmkeKLFQakCOwCM3AOk7VkldBz4jrzSe+Z0Ezn99NVXa1o45cQY4R6A==
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/bootstrap/-/bootstrap-4.5.2.tgz#a85c4eda59155f0d71186b6e6ad9b875813779ab"
+  integrity sha1-qFxO2lkVXw1xGGtuatm4dYE3eas=
 
 boxen@^1.2.1:
   version "1.3.0"
@@ -2096,6 +2126,16 @@ browserslist@^4.0.0:
     escalade "^3.0.2"
     node-releases "^1.1.60"
 
+browserslist@^4.12.0:
+  version "4.14.5"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/browserslist/-/browserslist-4.14.5.tgz#1c751461a102ddc60e40993639b709be7f2c4015"
+  integrity sha1-HHUUYaEC3cYOQJk2ObcJvn8sQBU=
+  dependencies:
+    caniuse-lite "^1.0.30001135"
+    electron-to-chromium "^1.3.571"
+    escalade "^3.1.0"
+    node-releases "^1.1.61"
+
 buffer-alloc-unsafe@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/buffer-alloc-unsafe/-/buffer-alloc-unsafe-1.1.0.tgz#bd7dc26ae2972d0eda253be061dba992349c19f0"
@@ -2158,7 +2198,7 @@ bytes@3.0.0:
   resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048"
   integrity sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg=
 
-bytes@3.1.0:
+bytes@3.1.0, bytes@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.1.0.tgz#f6cf7933a360e0588fa9fde85651cdc7f805d1f6"
   integrity sha512-zauLjrfCG+xvoyaqLoV8bLVXXNGC4JqlxFCutSDWA6fJrTo2ZuvLYTqZ7aHBLZSMOopbzwv8f+wZcVzfVTI2Dg==
@@ -2241,6 +2281,11 @@ camel-case@3.0.x:
     no-case "^2.2.0"
     upper-case "^1.1.1"
 
+camelcase-css@^2.0.1:
+  version "2.0.1"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/camelcase-css/-/camelcase-css-2.0.1.tgz#ee978f6947914cc30c6b44741b6ed1df7f043fd5"
+  integrity sha1-7pePaUeRTMMMa0R0G27R338EP9U=
+
 camelcase-keys@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-2.1.0.tgz#308beeaffdf28119051efa1d932213c91b8f92e7"
@@ -2304,6 +2349,11 @@ caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000792, caniuse-lite@^1.0.30000805, can
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001114.tgz#2e88119afb332ead5eaa330e332e951b1c4bfea9"
   integrity sha512-ml/zTsfNBM+T1+mjglWRPgVsu2L76GAaADKX5f4t0pbhttEp0WMawJsHDYlFkVZkoA+89uvBRrVrEE4oqenzXQ==
 
+caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001135:
+  version "1.0.30001137"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/caniuse-lite/-/caniuse-lite-1.0.30001137.tgz#6f0127b1d3788742561a25af3607a17fc778b803"
+  integrity sha1-bwEnsdN4h0JWGiWvNgehf8d4uAM=
+
 capture-stack-trace@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/capture-stack-trace/-/capture-stack-trace-1.0.1.tgz#a6c0bbe1f38f3aa0b92238ecb6ff42c344d4135d"
@@ -2354,6 +2404,14 @@ chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.4.1, chalk@^2.4.2:
     escape-string-regexp "^1.0.5"
     supports-color "^5.3.0"
 
+"chalk@^3.0.0 || ^4.0.0":
+  version "4.1.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/chalk/-/chalk-4.1.0.tgz#4e14870a618d9e2edd97dd8345fd9d9dc315646a"
+  integrity sha1-ThSHCmGNni7dl92DRf2dncMVZGo=
+  dependencies:
+    ansi-styles "^4.1.0"
+    supports-color "^7.1.0"
+
 chardet@^0.4.0:
   version "0.4.2"
   resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.4.2.tgz#b5473b33dc97c424e5d98dc87d55d4d8a29c8bf2"
@@ -2635,7 +2693,7 @@ color@^0.11.0:
     color-convert "^1.3.0"
     color-string "^0.3.0"
 
-color@^3.0.0:
+color@^3.0.0, color@^3.1.2:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/color/-/color-3.1.2.tgz#68148e7f85d41ad7649c5fa8c8106f098d229e10"
   integrity sha512-vXTJhHebByxZn3lDvDJYw4lR5+uB3vuoHsuYA5AKuxRVn5wzzIfQKGLBmgdVRHKTJYeK5rvJcHnrd0Li49CFpg==
@@ -2643,6 +2701,11 @@ color@^3.0.0:
     color-convert "^1.9.1"
     color-string "^1.5.2"
 
+colorette@^1.2.1:
+  version "1.2.1"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/colorette/-/colorette-1.2.1.tgz#4d0b921325c14faf92633086a536db6e89564b1b"
+  integrity sha1-TQuSEyXBT6+SYzCGpTbbbolWSxs=
+
 colormin@^1.0.5:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/colormin/-/colormin-1.1.2.tgz#ea2f7420a72b96881a38aae59ec124a6f7298133"
@@ -2693,6 +2756,11 @@ commander@^2.18.0:
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"
   integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
 
+commander@^5.0.0:
+  version "5.1.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/commander/-/commander-5.1.0.tgz#46abbd1652f8e059bddaef99bbdcb2ad9cf179ae"
+  integrity sha1-Rqu9FlL44Fm92u+Zu9yyrZzxea4=
+
 commander@~2.13.0:
   version "2.13.0"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.13.0.tgz#6964bca67685df7c1f1430c584f07d7597885b9c"
@@ -3142,6 +3210,11 @@ css-tree@1.0.0-alpha.39:
     mdn-data "2.0.6"
     source-map "^0.6.1"
 
+css-unit-converter@^1.1.1:
+  version "1.1.2"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/css-unit-converter/-/css-unit-converter-1.1.2.tgz#4c77f5a1954e6dbff60695ecb214e3270436ab21"
+  integrity sha1-THf1oZVObb/2BpXsshTjJwQ2qyE=
+
 css-what@2.1:
   version "2.1.3"
   resolved "https://registry.yarnpkg.com/css-what/-/css-what-2.1.3.tgz#a6d7604573365fe74686c3f311c56513d88285f2"
@@ -3507,6 +3580,15 @@ detect-node@^2.0.4:
   resolved "https://registry.yarnpkg.com/detect-node/-/detect-node-2.0.4.tgz#014ee8f8f669c5c58023da64b8179c083a28c46c"
   integrity sha512-ZIzRpLJrOj7jjP2miAtgqIfmzbxa4ZOr5jJc601zklsfEx9oTzmmj2nVpIPRpNlRTIh8lc1kyViIY7BWSGNmKw==
 
+detective@^5.2.0:
+  version "5.2.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/detective/-/detective-5.2.0.tgz#feb2a77e85b904ecdea459ad897cc90a99bd2a7b"
+  integrity sha1-/rKnfoW5BOzepFmtiXzJCpm9Kns=
+  dependencies:
+    acorn-node "^1.6.1"
+    defined "^1.0.0"
+    minimist "^1.1.1"
+
 di@^0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/di/-/di-0.0.1.tgz#806649326ceaa7caa3306d75d985ea2748ba913c"
@@ -3729,6 +3811,11 @@ electron-to-chromium@^1.2.7, electron-to-chromium@^1.3.30, electron-to-chromium@
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.533.tgz#d7e5ca4d57e9bc99af87efbe13e7be5dde729b0f"
   integrity sha512-YqAL+NXOzjBnpY+dcOKDlZybJDCOzgsq4koW3fvyty/ldTmsb4QazZpOWmVvZ2m0t5jbBf7L0lIGU3BUipwG+A==
 
+electron-to-chromium@^1.3.571:
+  version "1.3.572"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/electron-to-chromium/-/electron-to-chromium-1.3.572.tgz#62d87dfe32ca1f6b9a0f76917d24f66e94e19c01"
+  integrity sha1-Yth9/jLKH2uaD3aRfST2bpThnAE=
+
 elliptic@^6.5.3:
   version "6.5.3"
   resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.3.tgz#cb59eb2efdaf73a0bd78ccd7015a62ad6e0f93d6"
@@ -3981,6 +4068,11 @@ escalade@^3.0.2:
   resolved "https://registry.yarnpkg.com/escalade/-/escalade-3.0.2.tgz#6a580d70edb87880f22b4c91d0d56078df6962c4"
   integrity sha512-gPYAU37hYCUhW5euPeR+Y74F7BL+IBsV93j5cvGriSaD1aG6MGsqsV1yamRdrWrb2j3aiZvb0X+UBOWpx3JWtQ==
 
+escalade@^3.1.0:
+  version "3.1.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/escalade/-/escalade-3.1.0.tgz#e8e2d7c7a8b76f6ee64c2181d6b8151441602d4e"
+  integrity sha1-6OLXx6i3b27mTCGB1rgVFEFgLU4=
+
 escape-html@~1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/escape-html/-/escape-html-1.0.3.tgz#0258eae4d3d0c0974de1c169188ef0051d1d1988"
@@ -4783,6 +4875,15 @@ fs-extra@^1.0.0:
     jsonfile "^2.1.0"
     klaw "^1.0.0"
 
+fs-extra@^8.0.0:
+  version "8.1.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/fs-extra/-/fs-extra-8.1.0.tgz#49d43c45a88cd9677668cb7be1b46efdb8d2e1c0"
+  integrity sha1-SdQ8RaiM2Wd2aMt74bRu/bjS4cA=
+  dependencies:
+    graceful-fs "^4.2.0"
+    jsonfile "^4.0.0"
+    universalify "^0.1.0"
+
 fs-write-stream-atomic@^1.0.8:
   version "1.0.10"
   resolved "https://registry.yarnpkg.com/fs-write-stream-atomic/-/fs-write-stream-atomic-1.0.10.tgz#b47df53493ef911df75731e70a9ded0189db40c9"
@@ -5109,7 +5210,7 @@ got@^6.7.1:
     unzip-response "^2.0.1"
     url-parse-lax "^1.0.0"
 
-graceful-fs@^4.1.11, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.1.9:
+graceful-fs@^4.1.11, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.1.9, graceful-fs@^4.2.0:
   version "4.2.4"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.4.tgz#2256bde14d3632958c465ebc96dc467ca07a29fb"
   integrity sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw==
@@ -5219,6 +5320,11 @@ has-flag@^3.0.0:
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
   integrity sha1-tdRU3CGZriJWmfNGfloH87lVuv0=
 
+has-flag@^4.0.0:
+  version "4.0.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/has-flag/-/has-flag-4.0.0.tgz#944771fd9c81c81265c4d6941860da06bb59479b"
+  integrity sha1-lEdx/ZyByBJlxNaUGGDaBrtZR5s=
+
 has-symbols@^1.0.0, has-symbols@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.1.tgz#9f5214758a44196c406d9bd76cebf81ec2dd31e8"
@@ -5394,6 +5500,11 @@ html-minifier@^3.2.3:
     relateurl "0.2.x"
     uglify-js "3.4.x"
 
+html-tags@^3.1.0:
+  version "3.1.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/html-tags/-/html-tags-3.1.0.tgz#7b5e6f7e665e9fb41f30007ed9e0d41e97fb2140"
+  integrity sha1-e15vfmZen7QfMAB+2eDUHpf7IUA=
+
 html-webpack-plugin@^2.30.1:
   version "2.30.1"
   resolved "https://registry.yarnpkg.com/html-webpack-plugin/-/html-webpack-plugin-2.30.1.tgz#7f9c421b7ea91ec460f56527d78df484ee7537d5"
@@ -6313,6 +6424,13 @@ jsonfile@^2.1.0:
   optionalDependencies:
     graceful-fs "^4.1.6"
 
+jsonfile@^4.0.0:
+  version "4.0.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/jsonfile/-/jsonfile-4.0.0.tgz#8771aae0799b64076b76640fca058f9c10e33ecb"
+  integrity sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=
+  optionalDependencies:
+    graceful-fs "^4.1.6"
+
 jsonwebtoken@^8.5.1:
   version "8.5.1"
   resolved "https://registry.yarnpkg.com/jsonwebtoken/-/jsonwebtoken-8.5.1.tgz#00e71e0b8df54c2121a1f26137df2280673bcc0d"
@@ -6827,6 +6945,11 @@ lodash.templatesettings@^4.0.0:
   dependencies:
     lodash._reinterpolate "^3.0.0"
 
+lodash.toarray@^4.4.0:
+  version "4.4.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/lodash.toarray/-/lodash.toarray-4.4.0.tgz#24c4bfcd6b2fba38bfd0594db1179d8e9b656561"
+  integrity sha1-JMS/zWsvuji/0FlNsRedjptlZWE=
+
 lodash.uniq@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
@@ -6842,7 +6965,7 @@ lodash@^3.8.0:
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
   integrity sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y=
 
-lodash@^4.0.0, lodash@^4.0.1, lodash@^4.17.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.3.0, lodash@^4.5.0, lodash@~4.17.10:
+lodash@^4.0.0, lodash@^4.0.1, lodash@^4.17.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.20, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.3.0, lodash@^4.5.0, lodash@~4.17.10:
   version "4.17.20"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.20.tgz#b44a9b6297bcb698f1c51a3545a2b3b368d59c52"
   integrity sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==
@@ -7236,7 +7359,7 @@ minimist@1.2.0:
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.0.tgz#a35008b20f41383eec1fb914f4cd5df79a264284"
   integrity sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=
 
-minimist@^1.1.3, minimist@^1.2.0, minimist@^1.2.5:
+minimist@^1.1.1, minimist@^1.1.3, minimist@^1.2.0, minimist@^1.2.5:
   version "1.2.5"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602"
   integrity sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==
@@ -7432,6 +7555,13 @@ no-case@^2.2.0:
   dependencies:
     lower-case "^1.1.1"
 
+node-emoji@^1.8.1:
+  version "1.10.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/node-emoji/-/node-emoji-1.10.0.tgz#8886abd25d9c7bb61802a658523d1f8d2a89b2da"
+  integrity sha1-iIar0l2ce7YYAqZYUj0fjSqJsto=
+  dependencies:
+    lodash.toarray "^4.4.0"
+
 node-fetch@2.6.0, node-fetch@^2.2.0, node-fetch@^2.3.0, node-fetch@^2.6.0:
   version "2.6.0"
   resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.0.tgz#e633456386d4aa55863f676a7ab0daa8fdecb0fd"
@@ -7518,6 +7648,11 @@ node-releases@^1.1.60:
   resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.60.tgz#6948bdfce8286f0b5d0e5a88e8384e954dfe7084"
   integrity sha512-gsO4vjEdQaTusZAEebUWp2a5d7dF5DYoIpDG7WySnk7BuZDW+GPpHXoXXuYawRBr/9t5q54tirPz79kFIWg4dA==
 
+node-releases@^1.1.61:
+  version "1.1.61"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/node-releases/-/node-releases-1.1.61.tgz#707b0fca9ce4e11783612ba4a2fcba09047af16e"
+  integrity sha1-cHsPypzk4ReDYSukovy6CQR68W4=
+
 node-sass@^4.8.3:
   version "4.14.1"
   resolved "https://registry.yarnpkg.com/node-sass/-/node-sass-4.14.1.tgz#99c87ec2efb7047ed638fb4c9db7f3a42e2217b5"
@@ -7590,6 +7725,11 @@ normalize-url@^3.0.0:
   resolved "https://registry.yarnpkg.com/normalize-url/-/normalize-url-3.3.0.tgz#b2e1c4dc4f7c6d57743df733a4f5978d18650559"
   integrity sha512-U+JJi7duF1o+u2pynbp2zXDW2/PADgC30f0GsHZtRh+HOcXHnw137TrNlyxxRvWW5fjKd3bcLHPxofWuCjaeZg==
 
+normalize.css@^8.0.1:
+  version "8.0.1"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/normalize.css/-/normalize.css-8.0.1.tgz#9b98a208738b9cc2634caacbc42d131c97487bf3"
+  integrity sha1-m5iiCHOLnMJjTKrLxC0THJdIe/M=
+
 npm-run-path@^2.0.0:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/npm-run-path/-/npm-run-path-2.0.2.tgz#35a9232dfa35d7067b4cb2ddf2357b1871536c5f"
@@ -7663,6 +7803,11 @@ object-hash@^1.1.4:
   resolved "https://registry.yarnpkg.com/object-hash/-/object-hash-1.3.1.tgz#fde452098a951cb145f039bb7d455449ddc126df"
   integrity sha512-OSuu/pU4ENM9kmREg0BdNrUDIl1heYa4mBZacJc+vVWz4GtAwu7jO8s4AIt2aGRUTqxykpWzI3Oqnsm13tTMDA==
 
+object-hash@^2.0.3:
+  version "2.0.3"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/object-hash/-/object-hash-2.0.3.tgz#d12db044e03cd2ca3d77c0570d87225b02e1e6ea"
+  integrity sha1-0S2wROA80so9d8BXDYciWwLh5uo=
+
 object-inspect@^1.7.0:
   version "1.8.0"
   resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.8.0.tgz#df807e5ecf53a609cc6bfe93eac3cc7be5b3a9d0"
@@ -8353,6 +8498,16 @@ postcss-filter-plugins@^2.0.0:
   dependencies:
     postcss "^5.0.4"
 
+postcss-functions@^3.0.0:
+  version "3.0.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/postcss-functions/-/postcss-functions-3.0.0.tgz#0e94d01444700a481de20de4d55fb2640564250e"
+  integrity sha1-DpTQFERwCkgd4g3k1V+yZAVkJQ4=
+  dependencies:
+    glob "^7.1.2"
+    object-assign "^4.1.1"
+    postcss "^6.0.9"
+    postcss-value-parser "^3.3.0"
+
 postcss-import@^11.0.0:
   version "11.1.0"
   resolved "https://registry.yarnpkg.com/postcss-import/-/postcss-import-11.1.0.tgz#55c9362c9192994ec68865d224419df1db2981f0"
@@ -8363,6 +8518,14 @@ postcss-import@^11.0.0:
     read-cache "^1.0.0"
     resolve "^1.1.7"
 
+postcss-js@^2.0.0:
+  version "2.0.3"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/postcss-js/-/postcss-js-2.0.3.tgz#a96f0f23ff3d08cec7dc5b11bf11c5f8077cdab9"
+  integrity sha1-qW8PI/89CM7H3FsRvxHF+Ad82rk=
+  dependencies:
+    camelcase-css "^2.0.1"
+    postcss "^7.0.18"
+
 postcss-load-config@^1.1.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-1.2.0.tgz#539e9afc9ddc8620121ebf9d8c3673e0ce50d28a"
@@ -8569,6 +8732,14 @@ postcss-modules-values@^1.3.0:
     icss-replace-symbols "^1.1.0"
     postcss "^6.0.1"
 
+postcss-nested@^4.1.1:
+  version "4.2.3"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/postcss-nested/-/postcss-nested-4.2.3.tgz#c6f255b0a720549776d220d00c4b70cd244136f6"
+  integrity sha1-xvJVsKcgVJd20iDQDEtwzSRBNvY=
+  dependencies:
+    postcss "^7.0.32"
+    postcss-selector-parser "^6.0.2"
+
 postcss-normalize-charset@^1.1.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz#ef9ee71212d7fe759c78ed162f61ed62b5cb93f1"
@@ -8746,6 +8917,16 @@ postcss-selector-parser@^3.0.0:
     indexes-of "^1.0.1"
     uniq "^1.0.1"
 
+postcss-selector-parser@^6.0.0:
+  version "6.0.4"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/postcss-selector-parser/-/postcss-selector-parser-6.0.4.tgz#56075a1380a04604c38b063ea7767a129af5c2b3"
+  integrity sha1-VgdaE4CgRgTDiwY+p3Z6Epr1wrM=
+  dependencies:
+    cssesc "^3.0.0"
+    indexes-of "^1.0.1"
+    uniq "^1.0.1"
+    util-deprecate "^1.0.2"
+
 postcss-selector-parser@^6.0.2:
   version "6.0.2"
   resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.2.tgz#934cf799d016c83411859e09dcecade01286ec5c"
@@ -8809,7 +8990,7 @@ postcss-value-parser@^3.0.0, postcss-value-parser@^3.0.1, postcss-value-parser@^
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz#9ff822547e2893213cf1c30efa51ac5fd1ba8281"
   integrity sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==
 
-postcss-value-parser@^4.0.2:
+postcss-value-parser@^4.0.2, postcss-value-parser@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.1.0.tgz#443f6a20ced6481a2bda4fa8532a6e55d789a2cb"
   integrity sha512-97DXOFbQJhk71ne5/Mt6cOu6yxsSfM0QGQyl0L25Gca4yGWEGJaig7l7gbCX623VqTBNGLRLaVUCnNkcedlRSQ==
@@ -8823,6 +9004,15 @@ postcss-zindex@^2.0.1:
     postcss "^5.0.4"
     uniqs "^2.0.0"
 
+postcss@7.0.32, postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.27:
+  version "7.0.32"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.32.tgz#4310d6ee347053da3433db2be492883d62cec59d"
+  integrity sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==
+  dependencies:
+    chalk "^2.4.2"
+    source-map "^0.6.1"
+    supports-color "^6.1.0"
+
 postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0.14, postcss@^5.0.16, postcss@^5.0.2, postcss@^5.0.4, postcss@^5.0.5, postcss@^5.0.6, postcss@^5.0.8, postcss@^5.2.16:
   version "5.2.18"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-5.2.18.tgz#badfa1497d46244f6390f58b319830d9107853c5"
@@ -8833,7 +9023,7 @@ postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0
     source-map "^0.5.6"
     supports-color "^3.2.3"
 
-postcss@^6.0.0, postcss@^6.0.1, postcss@^6.0.17, postcss@^6.0.8:
+postcss@^6.0.0, postcss@^6.0.1, postcss@^6.0.17, postcss@^6.0.8, postcss@^6.0.9:
   version "6.0.23"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.23.tgz#61c82cc328ac60e677645f979054eb98bc0e3324"
   integrity sha512-soOk1h6J3VMTZtVeVpv15/Hpdl2cBLX3CAw4TAbkpTJiNPk9YP/zWcD1ND+xEtvyuuvKzbxliTOIyvkSeSJ6ag==
@@ -8842,10 +9032,10 @@ postcss@^6.0.0, postcss@^6.0.1, postcss@^6.0.17, postcss@^6.0.8:
     source-map "^0.6.1"
     supports-color "^5.4.0"
 
-postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.27:
-  version "7.0.32"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.32.tgz#4310d6ee347053da3433db2be492883d62cec59d"
-  integrity sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==
+postcss@^7.0.11, postcss@^7.0.18, postcss@^7.0.32:
+  version "7.0.34"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/postcss/-/postcss-7.0.34.tgz#f2baf57c36010df7de4009940f21532c16d65c20"
+  integrity sha1-8rr1fDYBDffeQAmUDyFTLBbWXCA=
   dependencies:
     chalk "^2.4.2"
     source-map "^0.6.1"
@@ -8884,6 +9074,11 @@ pretty-error@^2.0.2:
     renderkid "^2.0.1"
     utila "~0.4"
 
+pretty-hrtime@^1.0.3:
+  version "1.0.3"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz#b7e3ea42435a4c9b2759d99e0f201eb195802ee1"
+  integrity sha1-t+PqQkNaTJsnWdmeDyAesZWALuE=
+
 private@^0.1.6, private@^0.1.8:
   version "0.1.8"
   resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff"
@@ -9029,6 +9224,16 @@ punycode@^2.1.0, punycode@^2.1.1:
   resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec"
   integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==
 
+purgecss@^2.3.0:
+  version "2.3.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/purgecss/-/purgecss-2.3.0.tgz#5327587abf5795e6541517af8b190a6fb5488bb3"
+  integrity sha1-UydYer9XleZUFRevixkKb7VIi7M=
+  dependencies:
+    commander "^5.0.0"
+    glob "^7.0.0"
+    postcss "7.0.32"
+    postcss-selector-parser "^6.0.2"
+
 q@^1.1.2:
   version "1.5.1"
   resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7"
@@ -9239,6 +9444,14 @@ reduce-css-calc@^1.2.6:
     math-expression-evaluator "^1.2.14"
     reduce-function-call "^1.0.1"
 
+reduce-css-calc@^2.1.6:
+  version "2.1.7"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/reduce-css-calc/-/reduce-css-calc-2.1.7.tgz#1ace2e02c286d78abcd01fd92bfe8097ab0602c2"
+  integrity sha1-Gs4uAsKG14q80B/ZK/6Al6sGAsI=
+  dependencies:
+    css-unit-converter "^1.1.1"
+    postcss-value-parser "^3.3.0"
+
 reduce-function-call@^1.0.1:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/reduce-function-call/-/reduce-function-call-1.0.3.tgz#60350f7fb252c0a67eb10fd4694d16909971300f"
@@ -9491,7 +9704,7 @@ resolve@1.1.x:
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b"
   integrity sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs=
 
-resolve@^1.1.6, resolve@^1.1.7, resolve@^1.10.0, resolve@^1.13.1, resolve@^1.17.0, resolve@^1.2.0, resolve@^1.4.0:
+resolve@^1.1.6, resolve@^1.1.7, resolve@^1.10.0, resolve@^1.13.1, resolve@^1.14.2, resolve@^1.17.0, resolve@^1.2.0, resolve@^1.4.0:
   version "1.17.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.17.0.tgz#b25941b54968231cc2d1bb76a79cb7f2c0bf8444"
   integrity sha512-ic+7JYiV8Vi2yzQGFWOkiZD5Z9z7O2Zhm9XMaTxdJExKasieFCr+yXZ/WmXsckHiKl12ar0y6XiXDx3m4RHn1w==
@@ -10372,6 +10585,13 @@ supports-color@^6.1.0:
   dependencies:
     has-flag "^3.0.0"
 
+supports-color@^7.1.0:
+  version "7.2.0"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/supports-color/-/supports-color-7.2.0.tgz#1b7dcdcb32b8138801b3e478ba6a51caa89648da"
+  integrity sha1-G33NyzK4E4gBs+R4umpRyqiWSNo=
+  dependencies:
+    has-flag "^4.0.0"
+
 svgo@^0.7.0:
   version "0.7.2"
   resolved "https://registry.yarnpkg.com/svgo/-/svgo-0.7.2.tgz#9f5772413952135c6fefbf40afe6a4faa88b4bb5"
@@ -10449,6 +10669,34 @@ table@4.0.2:
     slice-ansi "1.0.0"
     string-width "^2.1.1"
 
+tailwindcss@^1.8.10:
+  version "1.8.10"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/tailwindcss/-/tailwindcss-1.8.10.tgz#945ef151c401c04a1c95e6a6bc747387a8d1b9dc"
+  integrity sha1-lF7xUcQBwEocleamvHRzh6jRudw=
+  dependencies:
+    "@fullhuman/postcss-purgecss" "^2.1.2"
+    autoprefixer "^9.4.5"
+    browserslist "^4.12.0"
+    bytes "^3.0.0"
+    chalk "^3.0.0 || ^4.0.0"
+    color "^3.1.2"
+    detective "^5.2.0"
+    fs-extra "^8.0.0"
+    html-tags "^3.1.0"
+    lodash "^4.17.20"
+    node-emoji "^1.8.1"
+    normalize.css "^8.0.1"
+    object-hash "^2.0.3"
+    postcss "^7.0.11"
+    postcss-functions "^3.0.0"
+    postcss-js "^2.0.0"
+    postcss-nested "^4.1.1"
+    postcss-selector-parser "^6.0.0"
+    postcss-value-parser "^4.1.0"
+    pretty-hrtime "^1.0.3"
+    reduce-css-calc "^2.1.6"
+    resolve "^1.14.2"
+
 tapable@^0.1.8:
   version "0.1.10"
   resolved "https://registry.yarnpkg.com/tapable/-/tapable-0.1.10.tgz#29c35707c2b70e50d07482b5d202e8ed446dafd4"
@@ -10879,6 +11127,11 @@ unique-string@^2.0.0:
   dependencies:
     crypto-random-string "^2.0.0"
 
+universalify@^0.1.0:
+  version "0.1.2"
+  resolved "https://infusionsoft.jfrog.io/infusionsoft/api/npm/npm/universalify/-/universalify-0.1.2.tgz#b646f69be3942dabcecc9d6639c80dc105efaa66"
+  integrity sha1-tkb2m+OULavOzJ1mOcgNwQXvqmY=
+
 "unorm@>= 1.0.0":
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/unorm/-/unorm-1.6.0.tgz#029b289661fba714f1a9af439eb51d9b16c205af"
@@ -11001,7 +11254,7 @@ uslug@^1.0.4:
   dependencies:
     unorm ">= 1.0.0"
 
-util-deprecate@^1.0.1, util-deprecate@~1.0.1:
+util-deprecate@^1.0.1, util-deprecate@^1.0.2, util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
   integrity sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=
@@ -11557,7 +11810,7 @@ xmlhttprequest@1.8.0:
   resolved "https://registry.yarnpkg.com/xmlhttprequest/-/xmlhttprequest-1.8.0.tgz#67fe075c5c24fef39f9d65f5f7b7fe75171968fc"
   integrity sha1-Z/4HXFwk/vOfnWX197f+dRcZaPw=
 
-xtend@^4.0.0, xtend@~4.0.1:
+xtend@^4.0.0, xtend@^4.0.2, xtend@~4.0.1:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"
   integrity sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==