From 7b99d98c553f40ec4d633d0d4fdf65f275c80e77 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shp@cock.li>
Date: Tue, 24 Nov 2020 12:32:42 +0200
Subject: Replace all use of <a> + href='#' with proper buttons

---
 src/components/notification/notification.vue | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

(limited to 'src/components/notification/notification.vue')

diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index 2bbde108..ba3648fd 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -14,14 +14,13 @@
           {{ notification.from_profile.screen_name }}
         </router-link>
       </small>
-      <a
-        href="#"
-        class="unmute"
+      <button
+        class="button-unstyled unmute"
         @click.prevent="toggleMute"
       ><FAIcon
         class="fa-scale-110 fa-old-padding"
         icon="eye-slash"
-      /></a>
+      /></button>
     </div>
     <div
       v-else
@@ -132,14 +131,14 @@
               />
             </span>
           </div>
-          <a
+          <button
             v-if="needMute"
-            href="#"
+            class="button-unstyled"
             @click.prevent="toggleMute"
           ><FAIcon
             class="fa-scale-110 fa-old-padding"
             icon="eye-slash"
-          /></a>
+          /></button>
         </span>
         <div
           v-if="notification.type === 'follow' || notification.type === 'follow_request'"
-- 
cgit v1.2.3-70-g09d2


From a6e495e4138e80888ea77e144f0330cd83d4a986 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shp@cock.li>
Date: Tue, 24 Nov 2020 16:10:03 +0200
Subject: fix warnings

---
 src/App.scss                                 |  2 +-
 src/components/notification/notification.vue | 10 ++++++----
 src/components/timeline/timeline.vue         |  4 +++-
 3 files changed, 10 insertions(+), 6 deletions(-)

(limited to 'src/components/notification/notification.vue')

diff --git a/src/App.scss b/src/App.scss
index 1d0abb51..76a5e797 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -71,7 +71,6 @@ a {
 }
 
 .button-default {
-  user-select: none;
   color: $fallback--text;
   color: var(--btnText, $fallback--text);
   background-color: $fallback--fg;
@@ -85,6 +84,7 @@ a {
   font-size: 14px;
   font-family: sans-serif;
   font-family: var(--interfaceFont, sans-serif);
+  user-select: none;
 
   i[class*=icon-],
   :not(&.-icon),
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index ba3648fd..08eb80c9 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -135,10 +135,12 @@
             v-if="needMute"
             class="button-unstyled"
             @click.prevent="toggleMute"
-          ><FAIcon
-            class="fa-scale-110 fa-old-padding"
-            icon="eye-slash"
-          /></button>
+          >
+            <FAIcon
+              class="fa-scale-110 fa-old-padding"
+              icon="eye-slash"
+            />
+          </button>
         </span>
         <div
           v-if="notification.type === 'follow' || notification.type === 'follow_request'"
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index 52fd674e..0326342b 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -66,7 +66,9 @@
         class="button-unstyled -link -fullwidth"
         @click.prevent="fetchOlderStatuses()"
       >
-        <div class="new-status-notification text-center panel-footer">{{ $t('timeline.load_older') }}</div>
+        <div class="new-status-notification text-center panel-footer">
+          {{ $t('timeline.load_older') }}
+        </div>
       </button>
       <div
         v-else
-- 
cgit v1.2.3-70-g09d2


From 04af772c1e8851bb8e4ce9b46e8146c0755309ed Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shp@cock.li>
Date: Tue, 24 Nov 2020 17:47:37 +0200
Subject: address missing button style, fix remaining warning

---
 src/App.scss                                 | 12 +++++++-----
 src/components/notification/notification.vue | 10 ++++++----
 2 files changed, 13 insertions(+), 9 deletions(-)

(limited to 'src/components/notification/notification.vue')

diff --git a/src/App.scss b/src/App.scss
index 76a5e797..b2c7be13 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -71,6 +71,7 @@ a {
 }
 
 .button-default {
+  user-select: none;
   color: $fallback--text;
   color: var(--btnText, $fallback--text);
   background-color: $fallback--fg;
@@ -84,10 +85,8 @@ a {
   font-size: 14px;
   font-family: sans-serif;
   font-family: var(--interfaceFont, sans-serif);
-  user-select: none;
 
   i[class*=icon-],
-  :not(&.-icon),
   .svg-inline--fa {
     color: $fallback--text;
     color: var(--btnText, $fallback--text);
@@ -110,7 +109,8 @@ a {
     background-color: $fallback--fg;
     background-color: var(--btnPressed, $fallback--fg);
 
-    svg, i {
+    svg,
+    i {
       color: $fallback--text;
       color: var(--btnPressedText, $fallback--text);
     }
@@ -123,7 +123,8 @@ a {
     background-color: $fallback--fg;
     background-color: var(--btnDisabled, $fallback--fg);
 
-    svg, i {
+    svg,
+    i {
       color: $fallback--text;
       color: var(--btnDisabledText, $fallback--text);
     }
@@ -137,7 +138,8 @@ a {
     box-shadow: 0px 0px 4px 0px rgba(255, 255, 255, 0.3), 0px 1px 0px 0px rgba(0, 0, 0, 0.2) inset, 0px -1px 0px 0px rgba(255, 255, 255, 0.2) inset;
     box-shadow: var(--buttonPressedShadow);
 
-    svg, i {
+    svg,
+    i {
       color: $fallback--text;
       color: var(--btnToggledText, $fallback--text);
     }
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index 08eb80c9..f56aa977 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -17,10 +17,12 @@
       <button
         class="button-unstyled unmute"
         @click.prevent="toggleMute"
-      ><FAIcon
-        class="fa-scale-110 fa-old-padding"
-        icon="eye-slash"
-      /></button>
+      >
+        <FAIcon
+          class="fa-scale-110 fa-old-padding"
+          icon="eye-slash"
+        />
+      </button>
     </div>
     <div
       v-else
-- 
cgit v1.2.3-70-g09d2

