From e3df414cdbb37bd26ef36231c1d25625aba8cf8e Mon Sep 17 00:00:00 2001
From: FireMaskterK <20838718+FireMasterK@users.noreply.github.com>
Date: Sun, 31 Oct 2021 18:36:47 +0000
Subject: [PATCH] Simplify uk-button css.

---
 src/App.vue                          |  4 ++++
 src/components/Channel.vue           |  8 +-------
 src/components/ErrorHandler.vue      |  9 +++++++--
 src/components/FeedPage.vue          |  2 +-
 src/components/ImportPage.vue        |  7 +------
 src/components/LoginPage.vue         |  6 +-----
 src/components/RegisterPage.vue      |  6 +-----
 src/components/SubscriptionsPage.vue |  9 ++-------
 src/components/WatchVideo.vue        | 25 +++++--------------------
 9 files changed, 23 insertions(+), 53 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index f530fb27..a5fa1e81 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -119,4 +119,8 @@ b {
 .uk-grid > div {
     padding-bottom: 1vh;
 }
+
+.uk-button {
+    background: #222;
+}
 </style>
diff --git a/src/components/Channel.vue b/src/components/Channel.vue
index 4447d7dc..c702de7d 100644
--- a/src/components/Channel.vue
+++ b/src/components/Channel.vue
@@ -9,13 +9,7 @@
         <!-- eslint-disable-next-line vue/no-v-html -->
         <p style="white-space: pre-wrap"><span v-html="purifyHTML(urlify(channel.description))"></span></p>
 
-        <button
-            v-if="authenticated"
-            class="uk-button uk-button-small"
-            style="background: #222"
-            type="button"
-            @click="subscribeHandler"
-        >
+        <button v-if="authenticated" class="uk-button uk-button-small" type="button" @click="subscribeHandler">
             {{ subscribed ? $t("actions.unsubscribe") : $t("actions.subscribe") }}
         </button>
 
diff --git a/src/components/ErrorHandler.vue b/src/components/ErrorHandler.vue
index bfda08c8..d6b2268a 100644
--- a/src/components/ErrorHandler.vue
+++ b/src/components/ErrorHandler.vue
@@ -1,9 +1,9 @@
 <template>
     <p>{{ message }}</p>
-    <button uk-toggle="target: #stacktrace" class="uk-button uk-button-small" style="background: #222" type="button">
+    <button @click="toggleTrace" class="uk-button uk-button-small" type="button">
         {{ $t("actions.show_more") }}
     </button>
-    <p id="stacktrace" style="white-space: pre-wrap" hidden>{{ error }}</p>
+    <p ref="stacktrace" style="white-space: pre-wrap" hidden>{{ error }}</p>
 </template>
 
 <script>
@@ -12,5 +12,10 @@ export default {
         error: { type: String, default: null },
         message: { type: String, default: null },
     },
+    methods: {
+        toggleTrace() {
+            this.$refs.stacktrace.hidden = !this.$refs.stacktrace.hidden;
+        },
+    },
 };
 </script>
diff --git a/src/components/FeedPage.vue b/src/components/FeedPage.vue
index d3c86dc3..73d171ac 100644
--- a/src/components/FeedPage.vue
+++ b/src/components/FeedPage.vue
@@ -4,7 +4,7 @@
     <button
         v-if="authenticated"
         class="uk-button uk-button-small"
-        style="background: #222; margin-right: 0.5rem"
+        style="margin-right: 0.5rem"
         type="button"
         @click="exportHandler"
     >
diff --git a/src/components/ImportPage.vue b/src/components/ImportPage.vue
index 20eee3b9..282acb72 100644
--- a/src/components/ImportPage.vue
+++ b/src/components/ImportPage.vue
@@ -11,12 +11,7 @@
                 <b>Override: <input v-model="override" class="uk-checkbox" type="checkbox"/></b>
             </div>
             <div class="uk-form-row">
-                <a
-                    class="uk-width-1-1 uk-button uk-button-primary uk-button-large uk-width-auto"
-                    style="background: #222"
-                    @click="handleImport"
-                    >Import</a
-                >
+                <a class="uk-width-1-1 uk-button uk-button-large uk-width-auto" @click="handleImport">Import</a>
             </div>
         </form>
         <br />
diff --git a/src/components/LoginPage.vue b/src/components/LoginPage.vue
index efbb8b15..64188625 100644
--- a/src/components/LoginPage.vue
+++ b/src/components/LoginPage.vue
@@ -22,11 +22,7 @@
                 />
             </div>
             <div class="uk-form-row">
-                <a
-                    class="uk-width-1-1 uk-button uk-button-primary uk-button-large uk-width-auto"
-                    style="background: #222"
-                    @click="login"
-                >
+                <a class="uk-width-1-1 uk-button uk-button-large uk-width-auto" @click="login">
                     {{ $t("titles.login") }}
                 </a>
             </div>
diff --git a/src/components/RegisterPage.vue b/src/components/RegisterPage.vue
index 0941cad1..074cea56 100644
--- a/src/components/RegisterPage.vue
+++ b/src/components/RegisterPage.vue
@@ -22,11 +22,7 @@
                 />
             </div>
             <div class="uk-form-row">
-                <a
-                    class="uk-width-1-1 uk-button uk-button-primary uk-button-large uk-width-auto"
-                    style="background: #222"
-                    @click="register"
-                >
+                <a class="uk-width-1-1 uk-button uk-button-large uk-width-auto" @click="register">
                     {{ $t("titles.register") }}</a
                 >
             </div>
diff --git a/src/components/SubscriptionsPage.vue b/src/components/SubscriptionsPage.vue
index 9d75bd80..6709b9b1 100644
--- a/src/components/SubscriptionsPage.vue
+++ b/src/components/SubscriptionsPage.vue
@@ -2,12 +2,7 @@
     <h1 class="uk-text-bold uk-text-center">{{ $t("titles.subscriptions") }}</h1>
 
     <div style="text-align: center">
-        <button
-            v-if="authenticated"
-            class="uk-button uk-button-small"
-            style="background: #222; margin-right: 0.5rem"
-            type="button"
-        >
+        <button v-if="authenticated" class="uk-button uk-button-small" style=" margin-right: 0.5rem" type="button">
             <router-link to="/import">
                 {{ $t("actions.import_from_json") }}
             </router-link>
@@ -16,7 +11,7 @@
         <button
             v-if="authenticated"
             class="uk-button uk-button-small"
-            style="background: #222; color: white"
+            style="color: white"
             type="button"
             @click="exportHandler"
         >
diff --git a/src/components/WatchVideo.vue b/src/components/WatchVideo.vue
index 29f2151f..c16d05b8 100644
--- a/src/components/WatchVideo.vue
+++ b/src/components/WatchVideo.vue
@@ -45,11 +45,7 @@
                         <b v-t="'video.ratings_disabled'" />
                     </div>
                 </template>
-                <a
-                    :href="'https://youtu.be/' + getVideoId()"
-                    class="uk-margin-small-left uk-button uk-button-small"
-                    style="background: #222"
-                >
+                <a :href="'https://youtu.be/' + getVideoId()" class="uk-margin-small-left uk-button uk-button-small">
                     <b>{{ $t("player.watch_on") }}&nbsp;</b>
                     <font-awesome-icon class="uk-margin-small-right" :icon="['fab', 'youtube']"></font-awesome-icon>
                 </a>
@@ -57,7 +53,6 @@
                     v-if="video.lbryId"
                     :href="'https://odysee.com/' + video.lbryId"
                     class="uk-margin-small-left uk-button uk-button-small"
-                    style="background: #222"
                 >
                     <b>{{ $t("player.watch_on") }} LBRY</b>
                 </a>
@@ -77,20 +72,14 @@
                     {{ video.uploader }} </router-link
                 >&thinsp;<font-awesome-icon v-if="video.uploaderVerified" icon="check"></font-awesome-icon>
                 <div class="uk-flex-1"></div>
-                <button
-                    v-if="authenticated"
-                    class="uk-button uk-button-small"
-                    style="background: #222"
-                    type="button"
-                    @click="subscribeHandler"
-                >
+                <button v-if="authenticated" class="uk-button uk-button-small" type="button" @click="subscribeHandler">
                     {{ subscribed ? $t("actions.unsubscribe") : $t("actions.subscribe") }}
                 </button>
             </div>
 
             <hr />
 
-            <a class="uk-button uk-button-small" style="background: #222" @click="showDesc = !showDesc">
+            <a class="uk-button uk-button-small" @click="showDesc = !showDesc">
                 {{ showDesc ? $t("actions.minimize_description") : $t("actions.show_description") }}
             </a>
             <!-- eslint-disable-next-line vue/no-v-html -->
@@ -139,11 +128,7 @@
             </div>
 
             <div v-if="video" class="uk-width-1-5@xl uk-width-1-4@s uk-width-1 uk-flex-last@s uk-flex-first">
-                <a
-                    class="uk-button uk-button-small uk-margin-small-bottom uk-hidden@s"
-                    style="background: #222"
-                    @click="showRecs = !showRecs"
-                >
+                <a class="uk-button uk-button-small uk-margin-small-bottom uk-hidden@s" @click="showRecs = !showRecs">
                     {{ showRecs ? $t("actions.minimize_recommendations") : $t("actions.show_recommendations") }}
                 </a>
                 <div
@@ -219,7 +204,7 @@ export default {
             (async () => {
                 const videoId = this.getVideoId();
                 const instance = this;
-                if (window.db) {
+                if (window.db && !this.video.error) {
                     var tx = window.db.transaction("watch_history", "readwrite");
                     var store = tx.objectStore("watch_history");
                     var request = store.get(videoId);