From 9391c5b5e4edeec7088edb3b40894a3ac26b44be Mon Sep 17 00:00:00 2001
From: Alicia Sykes <sykes.alicia@gmail.com>
Date: Sun, 29 Sep 2019 22:05:16 +0100
Subject: [PATCH] Opens links on Enter, in a new tab and a couple other final
 things

---
 src/components/FilterTile.vue |  1 -
 src/components/Item.vue       | 22 +++++++++++++++++++---
 src/components/ItemGroup.vue  |  1 +
 src/components/Nav.vue        |  1 -
 src/components/PageTitle.vue  |  4 ++--
 src/global-styles.scss        | 10 +++++-----
 6 files changed, 27 insertions(+), 12 deletions(-)

diff --git a/src/components/FilterTile.vue b/src/components/FilterTile.vue
index 0352b895..0a439b09 100644
--- a/src/components/FilterTile.vue
+++ b/src/components/FilterTile.vue
@@ -86,7 +86,6 @@ export default {
       background: #607d8b33;
       box-shadow: 1px 1px 2px #232323;
       color: #1CA8DD;
-      font-family: 'Comfortaa', cursive;
       &:focus {
         background: #607d8b4a;
       }
diff --git a/src/components/Item.vue b/src/components/Item.vue
index 85b2e69f..eead9dea 100644
--- a/src/components/Item.vue
+++ b/src/components/Item.vue
@@ -1,6 +1,7 @@
 <template>
     <el-tooltip placement="bottom" effect="dark" :content="description" :disabled="!description">
-        <div :class="`item ${!icon && !svg? 'short': ''}`" tabindex="0">
+        <a :href="url"  :class="`item ${!icon && !svg? 'short': ''}`"
+            tabindex="0" target="_blank" rel="noopener noreferrer">
             <div class="tile-title" :id="`tile-${id}`">
                 <span class="text">{{ title }}</span>
                 <div class="overflow-dots">...</div>
@@ -15,8 +16,8 @@
                 :src="`/img/tile-svgs/${svg}.svg`"
                 class="tile-svg"
             />
-        </div>
-  </el-tooltip>
+        </a>
+    </el-tooltip>
 </template>
 
 <script>
@@ -141,6 +142,21 @@ export default {
     width: 60px;
 }
 
+.item:hover {
+    .tile-svg {
+        filter:
+            invert(70%)
+            sepia(52%)
+            saturate(5390%)
+            hue-rotate(198deg)
+            brightness(101%)
+            contrast(88%);
+    }
+    .tile-icon {
+        filter: hue-rotate(45deg);
+    }
+}
+
 .tile-svg {
     width: 56px;
      filter:
diff --git a/src/components/ItemGroup.vue b/src/components/ItemGroup.vue
index 4b83d541..4f13b945 100644
--- a/src/components/ItemGroup.vue
+++ b/src/components/ItemGroup.vue
@@ -8,6 +8,7 @@
         v-for="item in items"
         :key="`${groupId}-${item.id}`"
         :id="`${groupId}-${item.id}`"
+        :url="item.url"
         :title="item.title"
         :description="item.description"
         :icon="item.icon"
diff --git a/src/components/Nav.vue b/src/components/Nav.vue
index 44e0410d..f2ca5329 100644
--- a/src/components/Nav.vue
+++ b/src/components/Nav.vue
@@ -27,7 +27,6 @@ nav {
         -webkit-box-shadow: 1px 1px 2px #232323;
         box-shadow: 1px 1px 2px #232323;
         color: #1CA8DD;
-        font-family: "Comfortaa", cursive;
         text-decoration: none;
         &:hover {
             background: #607d8b1c;
diff --git a/src/components/PageTitle.vue b/src/components/PageTitle.vue
index 9ecf6bcf..a6e6cb08 100644
--- a/src/components/PageTitle.vue
+++ b/src/components/PageTitle.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="page-titles">
-    <h1>Pannel</h1>
-    <span class="subtitle">Awesome subtitle</span>
+    <h1>Alicia App</h1>
+    <span class="subtitle">Dashboard of all the things</span>
   </div>
 </template>
 
diff --git a/src/global-styles.scss b/src/global-styles.scss
index 2d5ba6e0..b187870e 100644
--- a/src/global-styles.scss
+++ b/src/global-styles.scss
@@ -1,4 +1,4 @@
-@import url('https://fonts.googleapis.com/css?family=Comfortaa|Righteous&display=swap');
+@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');
 
 
 html {
@@ -10,13 +10,13 @@ body {
     margin: 0;
     padding: 0;
     background: #282a32;
-    font-family: 'Comfortaa', cursive;
+    font-family: 'Montserrat', sans-serif;
 }
 
 h1, h2, h3, h4, h5 {
-    font-family: 'Righteous', cursive;
+    font-family: 'Montserrat', sans-serif;
 }
 
-p, a, span, div {
-    font-family: 'Comfortaa', cursive;
+p, a, span, div, input {
+    font-family: 'Montserrat', sans-serif;
 }
\ No newline at end of file