From d432e925b0dd67fe07a746872a200380261f006a Mon Sep 17 00:00:00 2001
From: Alicia Sykes <sykes.alicia@gmail.com>
Date: Wed, 23 Jun 2021 15:30:39 +0100
Subject: [PATCH] :adhesive_bandage: Fixed stickey footer, Chris Coyier to the
 rescue

---
 src/components/PageStrcture/Footer.vue | 13 +++++--------
 src/styles/dimensions.scss             |  1 +
 src/views/Home.vue                     |  3 ++-
 src/views/Workspace.vue                | 12 ++++++++++--
 4 files changed, 18 insertions(+), 11 deletions(-)

diff --git a/src/components/PageStrcture/Footer.vue b/src/components/PageStrcture/Footer.vue
index 56596ff4..3009ec99 100644
--- a/src/components/PageStrcture/Footer.vue
+++ b/src/components/PageStrcture/Footer.vue
@@ -1,6 +1,6 @@
 <template>
   <!-- User Footer -->
-  <footer v-if="text && text !== ''" v-html="text" :class="!scrollVisible ? 'fixed' : ''"></footer>
+  <footer v-if="text && text !== ''" v-html="text"></footer>
   <!-- Default Footer -->
   <footer v-else :class="!scrollVisible ? 'fixed' : ''">
       Developed by <a :href="authorUrl">{{authorName}}</a>.
@@ -23,16 +23,11 @@ export default {
     showCopyright: { type: Boolean, default: true },
     repoUrl: { type: String, default: 'https://github.com/lissy93/dashy' },
   },
-  data: () => ({
-    scrollVisible: false,
-  }),
-  mounted() {
-    this.scrollVisible = document.body.clientHeight > window.innerHeight;
-  },
 };
 </script>
 
 <style scoped lang="scss">
+@import '@/styles/media-queries.scss';
 
 footer {
   width: calc(100% - 0.5rem);
@@ -44,7 +39,9 @@ footer {
   background: var(--background-darker);
   margin-top: 1.5rem;
   border-top: 1px solid var(--outline-color);
-  &.fixed { position: fixed; }
+  @include tablet-down {
+    display: none;
+  }
 }
 
 footer a{
diff --git a/src/styles/dimensions.scss b/src/styles/dimensions.scss
index bdfc2c77..13eed42a 100644
--- a/src/styles/dimensions.scss
+++ b/src/styles/dimensions.scss
@@ -10,6 +10,7 @@
   /* Basic Page Components */
   --scroll-bar-width: 8px;
   --header-height: 6.3rem;
+  --footer-height: 125px;
 
   /* Section & Item dimensions */
   --item-group-padding: 5px; // Determines width of item-group outline
diff --git a/src/views/Home.vue b/src/views/Home.vue
index db3e207c..1ae9d0da 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -210,7 +210,8 @@ export default {
 .home {
   padding-bottom: 1px;
   background: var(--background);
-  min-height: calc(100vh - 126px);
+  // min-height: calc(100vh - 126px);
+  min-height: calc(100vh - var(--footer-height));
 }
 
 /* Outside container wrapping the item groups*/
diff --git a/src/views/Workspace.vue b/src/views/Workspace.vue
index 5ee3ce30..3abfc156 100644
--- a/src/views/Workspace.vue
+++ b/src/views/Workspace.vue
@@ -18,7 +18,7 @@ export default {
     appConfig: Object,
   },
   data: () => ({
-    url: '',
+    url: '', // this.$route.query.url || '',
   }),
   components: {
     SideBar,
@@ -40,15 +40,23 @@ export default {
       fontAwesomeScript.setAttribute('src', `https://kit.fontawesome.com/${faKey}.js`);
       document.head.appendChild(fontAwesomeScript);
     },
+    repositionFooter() {
+      document.getElementsByTagName('footer')[0].style.position = 'fixed';
+    },
   },
   mounted() {
+    const route = this.$route;
+    if (route.query && route.query.url) this.url = decodeURI(route.query.url);
     this.setTheme();
     this.initiateFontAwesome();
+    // this.repositionFooter();
   },
 };
 
 </script>
 
 <style scoped lang="scss">
-
+.work-space {
+  min-height: calc(100vh - var(--footer-height));
+}
 </style>