Updated search result & button styling

diff --git a/flatnotes/src/colours.scss b/flatnotes/src/colours.scss
index 1c2b2a7a6e54b457a3e8c014f8ea00d8fe553b6b..ae96a09e6a162abf0256508a8f4392b57726d53f 100644 (file)
--- a/flatnotes/src/colours.scss
+++ b/flatnotes/src/colours.scss
@@ -4,6 +4,6 @@ $drop-shadow: #0000000a;
 $muted-text: #6c757d;
 $very-muted-text: #d8dbdd;
 $text: #222222;
-$button-background: #00000008;
-$input-highlight: #bbcdff;
+$button-background: #6ca7ff15;
+$input-highlight: #6ca7ff;
 $logo-key-colour: #f9a76b;

diff --git a/flatnotes/src/components/SearchResults.vue b/flatnotes/src/components/SearchResults.vue
index 23f835a5bb030acc31d1dc166bf332ae86e65688..3c1d13cc891cc5660f3c321fda79176d2f4e9d70 100644 (file)
--- a/flatnotes/src/components/SearchResults.vue
+++ b/flatnotes/src/components/SearchResults.vue
@@ -14,15 +14,18 @@
 
     <!-- Search Results Loaded -->
     <div v-else>
-      <div v-for="result in searchResults" :key="result.title" class="mb-4">
-        <p class="font-weight-bold mb-0">
-          <a
+      <div
+        v-for="result in searchResults"
+        :key="result.title"
+        class="bttn result mb-3"
+      >
+        <a :href="result.href" @click.prevent="openNote(result.href)">
+          <p
+            class="font-weight-bold mb-0"
             v-html="result.titleHighlightsOrTitle"
-            :href="result.href"
-            @click.prevent="openNote(result.href)"
-          ></a>
-        </p>
-        <p class="result-contents" v-html="result.contentHighlights"></p>
+          ></p>
+          <p class="result-contents" v-html="result.contentHighlights"></p>
+        </a>
       </div>
     </div>
   </div>
@@ -31,10 +34,8 @@
 <style lang="scss" scoped>
 @import "../colours";
 
-a {
-  &:hover {
-    filter: opacity(70%);
-  }
+.result p {
+  margin: 0;
 }
 
 .result-contents {

diff --git a/flatnotes/src/global.scss b/flatnotes/src/global.scss
index e6ee3178d6086467194324a82ffcce0274660d40..bd6da326d9c51817bf3a1f79233c007ce51d0b46 100644 (file)
--- a/flatnotes/src/global.scss
+++ b/flatnotes/src/global.scss
@@ -22,6 +22,7 @@ a {
   &:hover {
     text-decoration: none;
     color: inherit;
+    cursor: pointer;
   }
 }