From 7efc8a4e73f036bc1219fe2f7deba9fe383a38be Mon Sep 17 00:00:00 2001
From: Matteo Cominetti <matteo@cominetti.org>
Date: Wed, 10 Mar 2021 21:38:16 +0000
Subject: [PATCH] fix(frontend): removes background2 for dim's joy

---
 .../frontend/src/components/ErrorBlock.vue    |  2 +-
 .../frontend/src/components/FeedCommit.vue    | 10 ++--
 .../frontend/src/components/FeedStream.vue    |  2 +-
 .../src/components/ListItemStream.vue         |  2 +-
 .../src/components/NoDataPlaceholder.vue      |  4 --
 .../src/components/ObjectListViewer.vue       | 31 ++++------
 .../src/components/ObjectSimpleViewer.vue     | 39 ++++++------
 .../src/components/ObjectSpeckleViewer.vue    | 59 +++++++------------
 .../src/components/UserAccessTokens.vue       |  2 +-
 packages/frontend/src/components/UserApps.vue |  2 +-
 .../src/components/UserAuthorisedApps.vue     |  4 +-
 .../frontend/src/components/UserMenuTop.vue   |  2 +-
 .../src/components/dialogs/AppNewDialog.vue   |  2 +-
 .../components/dialogs/CommitEditDialog.vue   |  2 +-
 .../components/dialogs/ServerEditDialog.vue   |  2 +-
 .../src/components/dialogs/TokenDialog.vue    |  2 +-
 .../src/components/dialogs/UserEditDialog.vue |  2 +-
 packages/frontend/src/plugins/vuetify.js      |  4 +-
 packages/frontend/src/views/Branches.vue      | 10 +---
 packages/frontend/src/views/Commit.vue        |  2 +-
 packages/frontend/src/views/Commits.vue       |  4 +-
 packages/frontend/src/views/Frontend.vue      |  4 +-
 packages/frontend/src/views/Help.vue          |  4 +-
 packages/frontend/src/views/Home.vue          |  2 +-
 packages/frontend/src/views/Object.vue        |  2 +-
 packages/frontend/src/views/ProfileUser.vue   |  2 +-
 packages/frontend/src/views/StreamMain.vue    |  5 +-
 packages/frontend/src/views/Streams.vue       |  7 +--
 .../frontend/src/views/auth/AuthorizeApp.vue  |  2 +-
 29 files changed, 88 insertions(+), 129 deletions(-)

diff --git a/packages/frontend/src/components/ErrorBlock.vue b/packages/frontend/src/components/ErrorBlock.vue
index e514a96f2..d886de7bf 100644
--- a/packages/frontend/src/components/ErrorBlock.vue
+++ b/packages/frontend/src/components/ErrorBlock.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-sheet rounded="lg" class="pa-15" color="background2">
+  <v-sheet rounded="lg" class="pa-15">
     <h1>
       <v-icon large>mdi-bug</v-icon>
       Oups...
diff --git a/packages/frontend/src/components/FeedCommit.vue b/packages/frontend/src/components/FeedCommit.vue
index e10d975eb..19e995a52 100644
--- a/packages/frontend/src/components/FeedCommit.vue
+++ b/packages/frontend/src/components/FeedCommit.vue
@@ -23,21 +23,21 @@
         </v-col>
       </v-row>
 
-      <v-card class="mb-3" elevation="0" rounded="lg" color="background2">
+      <v-card class="mb-3" elevation="0" rounded="lg">
         <v-card-title v-if="!commit.items" class="subtitle-2">
           <router-link :to="`streams/${commit.streamId}/commits/${commit.id}`">
             {{ commit.message }}
           </router-link>
         </v-card-title>
-        <v-expansion-panels v-else multiple :value="expando" flat color="background2">
+        <v-expansion-panels v-else multiple :value="expando" flat>
           <v-expansion-panel>
-            <v-expansion-panel-header class="pl-4" color="background2">
+            <v-expansion-panel-header class="pl-4">
               <span class="subtitle-2">
                 {{ commit.message }}
               </span>
             </v-expansion-panel-header>
-            <v-expansion-panel-content color="background2">
-              <v-list dense color="background2">
+            <v-expansion-panel-content>
+              <v-list dense>
                 <v-list-item
                   v-for="(item, i) in commit.items"
                   :key="i"
diff --git a/packages/frontend/src/components/FeedStream.vue b/packages/frontend/src/components/FeedStream.vue
index 59c4e546c..e44940b3d 100644
--- a/packages/frontend/src/components/FeedStream.vue
+++ b/packages/frontend/src/components/FeedStream.vue
@@ -13,7 +13,7 @@
           <timeago :datetime="stream.createdAt"></timeago>
         </v-col>
       </v-row>
-      <v-card class="mb-3" elevation="0" rounded="lg" color="background2">
+      <v-card class="mb-3" elevation="0" rounded="lg">
         <v-row justify-center>
           <v-col cols="12">
             <v-card-title class="subtitle-2">
diff --git a/packages/frontend/src/components/ListItemStream.vue b/packages/frontend/src/components/ListItemStream.vue
index 430d9cace..5207f6c37 100644
--- a/packages/frontend/src/components/ListItemStream.vue
+++ b/packages/frontend/src/components/ListItemStream.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-card class="pa-5 mb-3" color="background2" style="transition: all 0.2s" flat>
+  <v-card class="pa-5 mb-3" style="transition: all 0.2s" flat>
     <v-row>
       <v-col cols="12" sm="8" class="align-self-center">
         <div class="subtitle-1 stream-link">
diff --git a/packages/frontend/src/components/NoDataPlaceholder.vue b/packages/frontend/src/components/NoDataPlaceholder.vue
index 658424ceb..bb190188d 100644
--- a/packages/frontend/src/components/NoDataPlaceholder.vue
+++ b/packages/frontend/src/components/NoDataPlaceholder.vue
@@ -12,7 +12,6 @@
               height="100%"
               href="https://speckle.guide/user/quickstart.html"
               tile
-              color="background2"
               target="_blank"
               :class="`pt-4  ${hover ? 'elevation-5' : 'elevation-0'} rounded-lg`"
               style="transition: all 0.15s; min-height: 130px"
@@ -30,7 +29,6 @@
             <v-card
               slot-scope="{ hover }"
               height="100%"
-              color="background2"
               href="https://speckle.guide/"
               target="_blank"
               tile
@@ -50,7 +48,6 @@
             <v-card
               slot-scope="{ hover }"
               height="100%"
-              color="background2"
               href="http://speckle.community"
               tile
               target="_blank"
@@ -69,7 +66,6 @@
             <v-card
               slot-scope="{ hover }"
               height="100%"
-              color="background2"
               href="https://speckle.xyz/streams/3073b96e86"
               tile
               target="_blank"
diff --git a/packages/frontend/src/components/ObjectListViewer.vue b/packages/frontend/src/components/ObjectListViewer.vue
index dc60909b8..496578b25 100644
--- a/packages/frontend/src/components/ObjectListViewer.vue
+++ b/packages/frontend/src/components/ObjectListViewer.vue
@@ -1,17 +1,12 @@
 <template>
-  <v-card
-    :class="`my-1 mb-0 pa-0 pb-2 ${
-      localExpand ? 'elevation-3' : 'elevation-0'
-    } my-0`"
-    color="background2"
-  >
+  <v-card :class="`my-1 mb-0 pa-0 pb-2 ${localExpand ? 'elevation-3' : 'elevation-0'} my-0`">
     <v-card-title>
       <v-chip @click="toggleLoadExpand">
         <v-icon small class="mr-2">mdi-code-array</v-icon>
         {{ keyName }}
         <span class="caption ml-2">List ({{ value.length }} elements)</span>
         <v-icon class="ml-2" small>
-          {{ localExpand ? "mdi-minus" : "mdi-plus" }}
+          {{ localExpand ? 'mdi-minus' : 'mdi-plus' }}
         </v-icon>
       </v-chip>
     </v-card-title>
@@ -32,11 +27,11 @@
 </template>
 <script>
 export default {
-  name: "ObjectListViewer",
+  name: 'ObjectListViewer',
   components: {
-    ObjectSpeckleViewer: () => import("./ObjectSpeckleViewer"),
-    ObjectSimpleViewer: () => import("./ObjectSimpleViewer"),
-    ObjectValueViewer: () => import("./ObjectValueViewer")
+    ObjectSpeckleViewer: () => import('./ObjectSpeckleViewer'),
+    ObjectSimpleViewer: () => import('./ObjectSimpleViewer'),
+    ObjectValueViewer: () => import('./ObjectValueViewer')
   },
   props: {
     value: {
@@ -69,34 +64,34 @@ export default {
           arr.push({
             key: `${index}`,
             value: val,
-            type: "ObjectListViewer"
+            type: 'ObjectListViewer'
           })
-        } else if (typeof val === "object" && val !== null) {
-          if (val.speckle_type && val.speckle_type === "reference") {
+        } else if (typeof val === 'object' && val !== null) {
+          if (val.speckle_type && val.speckle_type === 'reference') {
             arr.push({
               key: `${index}`,
               value: val,
-              type: "ObjectSpeckleViewer"
+              type: 'ObjectSpeckleViewer'
             })
           } else {
             arr.push({
               key: `${index}`,
               value: val,
-              type: "ObjectSimpleViewer"
+              type: 'ObjectSimpleViewer'
             })
           }
         } else {
           arr.push({
             key: `${index}`,
             value: val,
-            type: "ObjectValueViewer"
+            type: 'ObjectValueViewer'
           })
         }
       }
 
       arr.sort((a, b) => {
         if (a.type === b.type) return 0
-        if (a.type === "ObjectValueViewer") return -1
+        if (a.type === 'ObjectValueViewer') return -1
         return 0
       })
       return arr
diff --git a/packages/frontend/src/components/ObjectSimpleViewer.vue b/packages/frontend/src/components/ObjectSimpleViewer.vue
index 5e158c2f9..b6568cd56 100644
--- a/packages/frontend/src/components/ObjectSimpleViewer.vue
+++ b/packages/frontend/src/components/ObjectSimpleViewer.vue
@@ -1,17 +1,14 @@
 <template>
-  <v-card
-    :class="`my-1 pa-0 ${localExpand ? 'elevation-3' : 'elevation-0'} my-0`"
-    color="background2"
-  >
+  <v-card :class="`my-1 pa-0 ${localExpand ? 'elevation-3' : 'elevation-0'} my-0`">
     <v-card-title>
       <v-chip color="" @click="toggleLoadExpand">
         <v-icon class="mr-2" small>mdi-code-braces</v-icon>
         {{ keyName }}
         <span class="caption ml-2">
-          {{ value.speckle_type ? value.speckle_type : "Object" }}
+          {{ value.speckle_type ? value.speckle_type : 'Object' }}
         </span>
         <v-icon small class="ml-2">
-          {{ localExpand ? "mdi-minus" : "mdi-plus" }}
+          {{ localExpand ? 'mdi-minus' : 'mdi-plus' }}
         </v-icon>
       </v-chip>
     </v-card-title>
@@ -29,11 +26,11 @@
 </template>
 <script>
 export default {
-  name: "ObjectSimpleViewer",
+  name: 'ObjectSimpleViewer',
   components: {
-    ObjectListViewer: () => import("./ObjectListViewer"),
-    ObjectSpeckleViewer: () => import("./ObjectSpeckleViewer"),
-    ObjectValueViewer: () => import("./ObjectValueViewer")
+    ObjectListViewer: () => import('./ObjectListViewer'),
+    ObjectSpeckleViewer: () => import('./ObjectSpeckleViewer'),
+    ObjectValueViewer: () => import('./ObjectValueViewer')
   },
   props: {
     value: {
@@ -60,44 +57,44 @@ export default {
       let entries = Object.entries(this.value)
       let arr = []
       for (let [key, val] of entries) {
-        if (key.startsWith("__")) continue
-        if (key[0] === "@") key = key.substring(1)
-        if (key === "totalChildrenCount") key = "total children count"
-        if (key === "speckle_type") key = "speckle type"
+        if (key.startsWith('__')) continue
+        if (key[0] === '@') key = key.substring(1)
+        if (key === 'totalChildrenCount') key = 'total children count'
+        if (key === 'speckle_type') key = 'speckle type'
 
         if (Array.isArray(val)) {
           arr.push({
             key,
             value: val,
-            type: "ObjectListViewer",
+            type: 'ObjectListViewer',
             description: `List (${val.length} elements)`
           })
           // TODO -> list value template displayer
-        } else if (typeof val === "object" && val !== null) {
-          if (val.speckle_type && val.speckle_type === "reference") {
+        } else if (typeof val === 'object' && val !== null) {
+          if (val.speckle_type && val.speckle_type === 'reference') {
             arr.push({
               key,
               value: val,
-              type: "ObjectSpeckleViewer"
+              type: 'ObjectSpeckleViewer'
             })
           } else {
             arr.push({
               key,
               value: val,
-              type: "ObjectSimpleViewer"
+              type: 'ObjectSimpleViewer'
             })
           }
         } else {
           arr.push({
             key,
             value: val,
-            type: "ObjectValueViewer"
+            type: 'ObjectValueViewer'
           })
         }
       }
       arr.sort((a, b) => {
         if (a.type === b.type) return 0
-        if (a.type === "ObjectValueViewer") return -1
+        if (a.type === 'ObjectValueViewer') return -1
         return 0
       })
       return arr
diff --git a/packages/frontend/src/components/ObjectSpeckleViewer.vue b/packages/frontend/src/components/ObjectSpeckleViewer.vue
index a3263172b..bdd3610f5 100644
--- a/packages/frontend/src/components/ObjectSpeckleViewer.vue
+++ b/packages/frontend/src/components/ObjectSpeckleViewer.vue
@@ -1,28 +1,17 @@
 <template>
-  <v-card
-    :class="`my-1 pa-0 ${localExpand ? 'elevation-3' : 'elevation-0'} my-0`"
-    color="background2"
-  >
+  <v-card :class="`my-1 pa-0 ${localExpand ? 'elevation-3' : 'elevation-0'} my-0`">
     <v-card-title v-if="object">
       <v-chip color="" @click="toggleLoadExpand">
         <v-icon small class="mr-2">mdi-code-braces</v-icon>
         {{ keyName }}
         <span class="caption ml-2">
-          {{
-            object.data.speckle_type
-              ? object.data.speckle_type
-              : "Referenced Object"
-          }}
+          {{ object.data.speckle_type ? object.data.speckle_type : 'Referenced Object' }}
         </span>
         <v-icon small class="ml-2">
-          {{ localExpand ? "mdi-minus" : "mdi-plus" }}
+          {{ localExpand ? 'mdi-minus' : 'mdi-plus' }}
         </v-icon>
       </v-chip>
-      <v-btn
-        icon
-        small
-        :to="`/streams/${streamId}/objects/${value.referencedId}`"
-      >
+      <v-btn icon small :to="`/streams/${streamId}/objects/${value.referencedId}`">
         <v-icon small>mdi-open-in-new</v-icon>
       </v-btn>
     </v-card-title>
@@ -32,14 +21,10 @@
         {{ keyName }}
         <span class="caption ml-2">Referenced Object</span>
         <v-icon small class="ml-2">
-          {{ localExpand ? "mdi-minus" : "mdi-plus" }}
+          {{ localExpand ? 'mdi-minus' : 'mdi-plus' }}
         </v-icon>
       </v-chip>
-      <v-btn
-        icon
-        small
-        :to="`/streams/${streamId}/objects/${value.referencedId}`"
-      >
+      <v-btn icon small :to="`/streams/${streamId}/objects/${value.referencedId}`">
         <v-icon small>mdi-open-in-new</v-icon>
       </v-btn>
     </v-card-title>
@@ -60,14 +45,14 @@
   </v-card>
 </template>
 <script>
-import objectQuery from "../graphql/objectSingle.gql"
+import objectQuery from '../graphql/objectSingle.gql'
 
 export default {
-  name: "ObjectSpeckleViewer",
+  name: 'ObjectSpeckleViewer',
   components: {
-    ObjectListViewer: () => import("./ObjectListViewer"),
-    ObjectSimpleViewer: () => import("./ObjectSimpleViewer"),
-    ObjectValueViewer: () => import("./ObjectValueViewer")
+    ObjectListViewer: () => import('./ObjectListViewer'),
+    ObjectSimpleViewer: () => import('./ObjectSimpleViewer'),
+    ObjectValueViewer: () => import('./ObjectValueViewer')
   },
   props: {
     expand: {
@@ -116,43 +101,43 @@ export default {
       let entries = Object.entries(this.object.data)
       let arr = []
       for (let [key, val] of entries) {
-        if (key.startsWith("__")) continue
-        if (key[0] === "@") key = key.substring(1)
-        if (key === "totalChildrenCount") key = "total children count"
-        if (key === "speckle_type") key = "speckle type"
+        if (key.startsWith('__')) continue
+        if (key[0] === '@') key = key.substring(1)
+        if (key === 'totalChildrenCount') key = 'total children count'
+        if (key === 'speckle_type') key = 'speckle type'
 
         if (Array.isArray(val)) {
           arr.push({
             key,
             value: val,
-            type: "ObjectListViewer",
+            type: 'ObjectListViewer',
             description: `List (${val.length} elements)`
           })
-        } else if (typeof val === "object" && val !== null) {
-          if (val.speckle_type && val.speckle_type === "reference") {
+        } else if (typeof val === 'object' && val !== null) {
+          if (val.speckle_type && val.speckle_type === 'reference') {
             arr.push({
               key,
               value: val,
-              type: "ObjectSpeckleViewer"
+              type: 'ObjectSpeckleViewer'
             })
           } else {
             arr.push({
               key,
               value: val,
-              type: "ObjectSimpleViewer"
+              type: 'ObjectSimpleViewer'
             })
           }
         } else {
           arr.push({
             key,
             value: val,
-            type: "ObjectValueViewer"
+            type: 'ObjectValueViewer'
           })
         }
       }
       arr.sort((a, b) => {
         if (a.type === b.type) return 0
-        if (a.type === "ObjectValueViewer") return -1
+        if (a.type === 'ObjectValueViewer') return -1
         return 0
       })
       return arr
diff --git a/packages/frontend/src/components/UserAccessTokens.vue b/packages/frontend/src/components/UserAccessTokens.vue
index 7a6a6f209..5b1528655 100644
--- a/packages/frontend/src/components/UserAccessTokens.vue
+++ b/packages/frontend/src/components/UserAccessTokens.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-card color="background2" class="elevation-0 mt-3">
+  <v-card class="elevation-0 mt-3">
     <v-card-title>Personal Access Tokens</v-card-title>
     <v-card-text>
       Personal Access Tokens can be used to access the Speckle API on this server; they function
diff --git a/packages/frontend/src/components/UserApps.vue b/packages/frontend/src/components/UserApps.vue
index 10c2f7e38..7126d23b9 100644
--- a/packages/frontend/src/components/UserApps.vue
+++ b/packages/frontend/src/components/UserApps.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-card color="background2" class="elevation-0 mt-3 mb-5">
+  <v-card class="elevation-0 mt-3 mb-5">
     <v-card-title>Applications</v-card-title>
     <v-card-text>
       Register and manage third-party Speckle Apps that, once authorised by a user on this server,
diff --git a/packages/frontend/src/components/UserAuthorisedApps.vue b/packages/frontend/src/components/UserAuthorisedApps.vue
index d1644f63e..76f0af98e 100644
--- a/packages/frontend/src/components/UserAuthorisedApps.vue
+++ b/packages/frontend/src/components/UserAuthorisedApps.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-card xxxcolor="background2" class="elevation-0 mt-3 mb-5 transparent">
+  <v-card class="elevation-0 mt-3 mb-5 transparent">
     <v-card-title>Your Apps</v-card-title>
     <v-card-text class="">
       Here you can review the apps that you have granted access to.
@@ -23,7 +23,7 @@
           class="d-flex"
           style="flex-direction: column"
         >
-          <v-card class="background2 flex-grow-1 d-flex flex-column">
+          <v-card flex-grow-1 d-flex flex-column>
             <v-card-text>
               <h3 class="mb-3">
                 <v-icon v-if="app.trustByDefault" class="mr-1 primary--text" small>
diff --git a/packages/frontend/src/components/UserMenuTop.vue b/packages/frontend/src/components/UserMenuTop.vue
index 7b273aea5..407a09c80 100644
--- a/packages/frontend/src/components/UserMenuTop.vue
+++ b/packages/frontend/src/components/UserMenuTop.vue
@@ -8,7 +8,7 @@
         </v-avatar>
       </v-btn>
     </template>
-    <v-list color="background2" class="py-0 my-0">
+    <v-list class="py-0 my-0">
       <v-list-item to="/profile">
         <v-list-item-content>
           <v-list-item-title>
diff --git a/packages/frontend/src/components/dialogs/AppNewDialog.vue b/packages/frontend/src/components/dialogs/AppNewDialog.vue
index 6197a28ee..867a89c66 100644
--- a/packages/frontend/src/components/dialogs/AppNewDialog.vue
+++ b/packages/frontend/src/components/dialogs/AppNewDialog.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-card class="pa-4" color="background2">
+  <v-card class="pa-4">
     <v-card-title>Create a New App</v-card-title>
 
     <v-form v-show="!appCreateResult" ref="form" v-model="valid" @submit.prevent="createApp">
diff --git a/packages/frontend/src/components/dialogs/CommitEditDialog.vue b/packages/frontend/src/components/dialogs/CommitEditDialog.vue
index 1e2ad0881..d6f228628 100644
--- a/packages/frontend/src/components/dialogs/CommitEditDialog.vue
+++ b/packages/frontend/src/components/dialogs/CommitEditDialog.vue
@@ -1,6 +1,6 @@
 <template>
   <v-dialog v-model="show" width="500" @keydown.esc="cancel">
-    <v-card class="pa-4" color="background2">
+    <v-card class="pa-4">
       <v-card-title class="subtitle-1">Edit Commit</v-card-title>
       <v-form ref="form" v-model="valid" lazy-validation @submit.prevent="agree">
         <v-card-text class="pl-2 pr-2 pt-0 pb-0">
diff --git a/packages/frontend/src/components/dialogs/ServerEditDialog.vue b/packages/frontend/src/components/dialogs/ServerEditDialog.vue
index 2ad5b0748..8d9c99e28 100644
--- a/packages/frontend/src/components/dialogs/ServerEditDialog.vue
+++ b/packages/frontend/src/components/dialogs/ServerEditDialog.vue
@@ -1,6 +1,6 @@
 <template>
   <v-dialog v-model="show" width="500" @keydown.esc="cancel">
-    <v-card class="pa-4" color="background2">
+    <v-card class="pa-4">
       <v-card-title class="subtitle-1">Edit Server Info</v-card-title>
 
       <v-form ref="form" v-model="valid" lazy-validation @submit.prevent="agree">
diff --git a/packages/frontend/src/components/dialogs/TokenDialog.vue b/packages/frontend/src/components/dialogs/TokenDialog.vue
index 877160e17..4ffa6e6ef 100644
--- a/packages/frontend/src/components/dialogs/TokenDialog.vue
+++ b/packages/frontend/src/components/dialogs/TokenDialog.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-card class="pa-4" color="background2">
+  <v-card class="pa-4">
     <v-card-title>Create a New Personal Access Token</v-card-title>
     <v-form v-show="!fullTokenResult" ref="form" v-model="valid" @submit.prevent="createToken">
       <v-card-text>
diff --git a/packages/frontend/src/components/dialogs/UserEditDialog.vue b/packages/frontend/src/components/dialogs/UserEditDialog.vue
index eaf8c608f..27a956a08 100644
--- a/packages/frontend/src/components/dialogs/UserEditDialog.vue
+++ b/packages/frontend/src/components/dialogs/UserEditDialog.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-card class="pa-4" color="background2">
+  <v-card class="pa-4">
     <v-card-title class="subtitle-1">Edit Profile</v-card-title>
     <v-form ref="form" v-model="valid" lazy-validation @submit.prevent="updateUser">
       <v-card-text class="pl-2 pr-2 pt-0 pb-0">
diff --git a/packages/frontend/src/plugins/vuetify.js b/packages/frontend/src/plugins/vuetify.js
index f1e4c7cce..40b3f3c64 100644
--- a/packages/frontend/src/plugins/vuetify.js
+++ b/packages/frontend/src/plugins/vuetify.js
@@ -26,7 +26,6 @@ export default new Vuetify({
         info: '#313BCF', //dark blue
         success: '#4caf50',
         background: '#eeeeee',
-        background2: '#ffffff',
         text: '#FFFFFF'
       },
       dark: {
@@ -37,8 +36,7 @@ export default new Vuetify({
         warning: '#FF9100', //orange
         info: '#313BCF', //dark blue
         success: '#4caf50',
-        background: '#3a3b3c',
-        background2: '#303132'
+        background: '#3a3b3c'
       }
     }
   }
diff --git a/packages/frontend/src/views/Branches.vue b/packages/frontend/src/views/Branches.vue
index 973aedd11..e7a5b3ccd 100644
--- a/packages/frontend/src/views/Branches.vue
+++ b/packages/frontend/src/views/Branches.vue
@@ -4,7 +4,7 @@
       <v-card v-if="$apollo.queries.stream.loading">
         <v-skeleton-loader type="article"></v-skeleton-loader>
       </v-card>
-      <v-card v-else rounded="lg" class="pa-4 mb-4" elevation="0" color="background2">
+      <v-card v-else rounded="lg" class="pa-4 mb-4" elevation="0">
         <v-dialog v-model="dialogBranch" max-width="500">
           <new-branch-dialog
             :branch-names="branches.items.map((b) => b.name)"
@@ -39,13 +39,7 @@
         </v-card-text>
       </v-card>
 
-      <v-card
-        v-if="!$apollo.queries.stream.loading"
-        class="mt-5 pa-4"
-        elevation="0"
-        rounded="lg"
-        color="background2"
-      >
+      <v-card v-if="!$apollo.queries.stream.loading" class="mt-5 pa-4" elevation="0" rounded="lg">
         <v-subheader class="text-uppercase">Branches ({{ branches.items.length }})</v-subheader>
         <v-card-text>
           <v-list two-line color="transparent">
diff --git a/packages/frontend/src/views/Commit.vue b/packages/frontend/src/views/Commit.vue
index b2e2dc3cd..6f60ebae0 100644
--- a/packages/frontend/src/views/Commit.vue
+++ b/packages/frontend/src/views/Commit.vue
@@ -6,7 +6,7 @@
       </v-card>
     </v-col>
     <v-col v-else cols="12">
-      <v-card elevation="0" rounded="lg" color="background2">
+      <v-card elevation="0" rounded="lg">
         <v-sheet class="pa-4" color="transparent">
           <commit-edit-dialog ref="commitDialog"></commit-edit-dialog>
           <v-card-title>
diff --git a/packages/frontend/src/views/Commits.vue b/packages/frontend/src/views/Commits.vue
index b52a1e6b9..2572a9b01 100644
--- a/packages/frontend/src/views/Commits.vue
+++ b/packages/frontend/src/views/Commits.vue
@@ -4,7 +4,7 @@
       <v-skeleton-loader type="article, article"></v-skeleton-loader>
     </v-col>
     <v-col v-else cols="12">
-      <v-card class="pa-4" elevation="0" rounded="lg" color="background2">
+      <v-card class="pa-4" elevation="0" rounded="lg">
         <v-dialog v-model="dialogEdit" max-width="500">
           <branch-edit-dialog :branch="stream.branch" @close="closeEdit" />
         </v-dialog>
@@ -34,7 +34,7 @@
         </v-card-text>
       </v-card>
 
-      <v-card class="mt-5 pa-4" elevation="0" rounded="lg" color="background2">
+      <v-card class="mt-5 pa-4" elevation="0" rounded="lg">
         <v-subheader class="text-uppercase">
           Commits ({{ stream.branch.commits.totalCount }})
         </v-subheader>
diff --git a/packages/frontend/src/views/Frontend.vue b/packages/frontend/src/views/Frontend.vue
index b2efe6b90..0016d33de 100644
--- a/packages/frontend/src/views/Frontend.vue
+++ b/packages/frontend/src/views/Frontend.vue
@@ -1,6 +1,6 @@
 <template>
   <v-app id="speckle">
-    <v-app-bar app color="background2">
+    <v-app-bar app>
       <v-container class="py-0 fill-height hidden-sm-and-down">
         <v-btn text to="/" active-class="no-active">
           <v-img class="" contain max-height="30" max-width="30" src="@/assets/logo.svg" />
@@ -41,7 +41,7 @@
                   <v-icon>mdi-magnify</v-icon>
                 </v-btn>
               </template>
-              <v-card class="background2">
+              <v-card>
                 <v-row>
                   <!-- <v-col v-for="link in navLinks" :key="link.name" cols="12">
                     <v-btn text block :to="link.link">
diff --git a/packages/frontend/src/views/Help.vue b/packages/frontend/src/views/Help.vue
index 3c6c30482..4bf1b2217 100644
--- a/packages/frontend/src/views/Help.vue
+++ b/packages/frontend/src/views/Help.vue
@@ -2,11 +2,11 @@
   <v-container>
     <v-row align="center" justify="center">
       <v-col cols="12" md="8">
-        <v-sheet rounded="lg" class="pa-15 text-center" color="background2">
+        <v-sheet rounded="lg" class="pa-15 text-center">
           <h1>Need Help?</h1>
           <p class="ma-10 subtitle-1 font-weight-light">
             Get free help from the
-            <a href="https://discourse.speckle.works/">Speckle Community forum</a>
+            <a href="https://speckle.community/">Speckle Community forum</a>
             or
             <a href="mailto:hello@speckle.systems">contact us</a>
             to set up a support agreement and one of our engineers will help right away 🚀!
diff --git a/packages/frontend/src/views/Home.vue b/packages/frontend/src/views/Home.vue
index 4ea7f5105..662baadb8 100644
--- a/packages/frontend/src/views/Home.vue
+++ b/packages/frontend/src/views/Home.vue
@@ -43,7 +43,7 @@
       >
         <v-row>
           <v-col xxxclass="pt-0">
-            <v-card class="pa-5" elevation="0" rounded="lg" color="background2">
+            <v-card class="pa-5" elevation="0" rounded="lg">
               <v-subheader class="text-uppercase">Recent activity:</v-subheader>
               <v-chip-group
                 v-model="selectedActivity"
diff --git a/packages/frontend/src/views/Object.vue b/packages/frontend/src/views/Object.vue
index 1c20bff41..543815af9 100644
--- a/packages/frontend/src/views/Object.vue
+++ b/packages/frontend/src/views/Object.vue
@@ -4,7 +4,7 @@
       <v-card class="pa-0" elevation="0" rounded="lg" color="transparent" style="height: 50vh">
         <renderer :object-url="commitObjectUrl" />
       </v-card>
-      <v-card class="pa-4 mt-3" elevation="0" rounded="lg" color="background2">
+      <v-card class="pa-4 mt-3" elevation="0" rounded="lg">
         <v-card-title class="mr-8">
           <v-icon class="mr-2">mdi-database</v-icon>
           Object {{ $route.params.objectId }}
diff --git a/packages/frontend/src/views/ProfileUser.vue b/packages/frontend/src/views/ProfileUser.vue
index 4621973e9..e19162f71 100644
--- a/packages/frontend/src/views/ProfileUser.vue
+++ b/packages/frontend/src/views/ProfileUser.vue
@@ -10,7 +10,7 @@
         <user-info-card :user="user"></user-info-card>
       </v-col>
       <v-col cols="12" sm="12" md="8" lg="9" xl="8" class="pt-10">
-        <v-card class="mb-3 elevation-0" color="background2">
+        <v-card class="mb-3 elevation-0">
           <v-card-title>
             {{ user.name }} and you share {{ user.streams.totalCount }}
             {{ user.streams.totalCount === 1 ? 'stream' : 'streams' }} and
diff --git a/packages/frontend/src/views/StreamMain.vue b/packages/frontend/src/views/StreamMain.vue
index 5d92ffc5a..e693c987a 100644
--- a/packages/frontend/src/views/StreamMain.vue
+++ b/packages/frontend/src/views/StreamMain.vue
@@ -8,7 +8,6 @@
         <v-sheet
           class="px-5 pt-5 align-center justify-center"
           :class="latestCommit ? '' : 'rounded-b-lg'"
-          color="background2"
         >
           <v-select
             v-if="branches"
@@ -52,7 +51,7 @@
           <renderer :object-url="latestCommitObjectUrl" :unload-trigger="clearRendererTrigger" />
         </div>
 
-        <v-sheet v-if="latestCommit" color="background2">
+        <v-sheet v-if="latestCommit">
           <!-- LAST COMMIT -->
           <v-list two-line class="pa-0">
             <v-list-item :to="'/streams/' + $route.params.streamId + '/commits/' + latestCommit.id">
@@ -148,7 +147,7 @@
         <v-skeleton-loader type="article"></v-skeleton-loader>
       </v-card>
 
-      <v-card v-else rounded="lg" class="pa-4 mb-4" elevation="0" color="background2">
+      <v-card v-else rounded="lg" class="pa-4 mb-4" elevation="0">
         <v-dialog v-model="dialogDescription">
           <stream-description-dialog
             :id="$route.params.streamId"
diff --git a/packages/frontend/src/views/Streams.vue b/packages/frontend/src/views/Streams.vue
index 4800b0e62..8fe28e40f 100644
--- a/packages/frontend/src/views/Streams.vue
+++ b/packages/frontend/src/views/Streams.vue
@@ -81,12 +81,7 @@
             :message="`Hello there! It seems like you don't have any streams yet. Here's a handful of useful links to help you get started:`"
           />
         </div>
-        <v-card
-          v-if="user && user.streams.totalCount > 0"
-          class="mt-5 mx-4"
-          color="background2"
-          flat
-        >
+        <v-card v-if="user && user.streams.totalCount > 0" class="mt-5 mx-4" flat>
           <v-card-text class="body-1">
             <span>
               You have
diff --git a/packages/frontend/src/views/auth/AuthorizeApp.vue b/packages/frontend/src/views/auth/AuthorizeApp.vue
index ad97d5244..d330f3a09 100644
--- a/packages/frontend/src/views/auth/AuthorizeApp.vue
+++ b/packages/frontend/src/views/auth/AuthorizeApp.vue
@@ -1,6 +1,6 @@
 <template>
   <v-card v-if="!$apollo.loading && action === 0" rounded="lg" class="pb-4 elevation-10">
-    <v-card-text class="text-center background2">
+    <v-card-text class="text-center">
       <user-avatar></user-avatar>
     </v-card-text>
     <v-card-text class="text-h5 font-weight-regular text-center pt-10">