From c7595049bd6bb6a928b9d06b043049c0bc67cb02 Mon Sep 17 00:00:00 2001 From: Bnyro Date: Thu, 6 Oct 2022 19:58:31 +0200 Subject: [PATCH 01/56] better handling of the auto theme to prevent further bugs with it --- src/App.vue | 26 -------------------------- src/components/FooterComponent.vue | 3 --- src/components/SearchSuggestions.vue | 8 -------- src/main.js | 8 ++++++++ 4 files changed, 8 insertions(+), 37 deletions(-) diff --git a/src/App.vue b/src/App.vue index f3e7bb92..9e9d889d 100644 --- a/src/App.vue +++ b/src/App.vue @@ -108,10 +108,6 @@ b { @apply text-black bg-white; } -.auto { - @apply dark:(text-white bg-dark-900); -} - .dark { @apply text-white bg-dark-900; } @@ -137,12 +133,6 @@ b { @apply text-gray-400 bg-dark-400; } -.auto .input, -.auto .select, -.auto .btn { - @apply dark:(text-gray-400 bg-dark-400); -} - .input { @apply pl-2.5; } @@ -160,10 +150,6 @@ hr { @apply border-dark-100; } -.auto hr { - @apply dark:border-dark-100; -} - h1, h2 { @apply m-0 font-bold; @@ -193,18 +179,10 @@ h2 { @apply hover:(text-gray-300 underline underline-gray-300); } -.auto .link { - @apply dark:hover:(text-gray-300 underline underline-gray-300); -} - .dark .link-secondary { @apply text-gray-300 hover:(text-gray-400 underline underline-gray-400); } -.auto .link-secondary { - @apply dark:(text-gray-300 hover:(text-gray-400 underline underline-gray-400)); -} - .line { @apply px-2.5 py-0.25 my-0.45 rounded-xl bg-dark-900; } @@ -212,8 +190,4 @@ h2 { .dark .line { @apply bg-white; } - -.auto .line { - @apply dark:(bg-white); -} diff --git a/src/components/FooterComponent.vue b/src/components/FooterComponent.vue index b65bc79e..1381c495 100644 --- a/src/components/FooterComponent.vue +++ b/src/components/FooterComponent.vue @@ -52,7 +52,4 @@ footer { .dark footer { @apply bg-dark-800; } -.auto footer { - @apply dark:(bg-dark-800); -} diff --git a/src/components/SearchSuggestions.vue b/src/components/SearchSuggestions.vue index 2b5f9d80..794085db 100644 --- a/src/components/SearchSuggestions.vue +++ b/src/components/SearchSuggestions.vue @@ -89,10 +89,6 @@ export default { @apply bg-dark-400; } -.auto .suggestions-container { - @apply dark:bg-dark-400; -} - .suggestion-selected { @apply bg-gray-200; } @@ -101,10 +97,6 @@ export default { @apply bg-dark-100; } -.auto .suggestion-selected { - @apply dark:bg-dark-100; -} - .suggestion { @apply p-y-1; } diff --git a/src/main.js b/src/main.js index c7437bbf..d4325921 100644 --- a/src/main.js +++ b/src/main.js @@ -239,6 +239,13 @@ const mixin = { }, computed: { theme() { + this.refreshTheme; // forces Vue to recompute the value when the var gets changed + if (this.getPreferenceString("theme", "dark") == "auto") { + const darkModePreference = window.matchMedia("(prefers-color-scheme: dark)"); + // Forces the app to recompute the theme class + darkModePreference.addEventListener("change", () => this.refreshTheme++); + return darkModePreference.matches ? "dark" : "light"; + } return this.getPreferenceString("theme", "dark"); }, authenticated(_this) { @@ -269,6 +276,7 @@ const mixin = { return { TimeAgo: TimeAgo, TimeAgoConfig: timeAgo, + refreshTheme: 0, }; }, }; From 9621c346c0b1d242da13346c92105820cb0b861f Mon Sep 17 00:00:00 2001 From: Bnyro Date: Thu, 6 Oct 2022 21:20:35 +0200 Subject: [PATCH 02/56] fix stacked listeners --- src/main.js | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/src/main.js b/src/main.js index d4325921..5538c39d 100644 --- a/src/main.js +++ b/src/main.js @@ -64,6 +64,7 @@ import "@unocss/reset/tailwind.css"; import "uno.css"; const timeAgo = new TimeAgo("en-US"); +const darkModePreference = window.matchMedia("(prefers-color-scheme: dark)"); import("./registerServiceWorker"); @@ -240,13 +241,11 @@ const mixin = { computed: { theme() { this.refreshTheme; // forces Vue to recompute the value when the var gets changed - if (this.getPreferenceString("theme", "dark") == "auto") { - const darkModePreference = window.matchMedia("(prefers-color-scheme: dark)"); - // Forces the app to recompute the theme class - darkModePreference.addEventListener("change", () => this.refreshTheme++); + let themePref = this.getPreferenceString("theme", "dark"); + if (themePref == "auto") { return darkModePreference.matches ? "dark" : "light"; } - return this.getPreferenceString("theme", "dark"); + return themePref; }, authenticated(_this) { return _this.getAuthToken() !== undefined; @@ -279,6 +278,10 @@ const mixin = { refreshTheme: 0, }; }, + mounted() { + // Forces the app to recompute the theme class + darkModePreference.addEventListener("change", () => this.refreshTheme++); + }, }; const i18n = createI18n({ From 5dcd061b2a11719d5c72701a9a01110d8bf18af1 Mon Sep 17 00:00:00 2001 From: talkor Date: Sun, 9 Oct 2022 08:54:39 +0300 Subject: [PATCH 03/56] fix: align buttons --- src/App.vue | 2 +- src/components/WatchVideo.vue | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/App.vue b/src/App.vue index f3e7bb92..cb960569 100644 --- a/src/App.vue +++ b/src/App.vue @@ -101,7 +101,7 @@ b { } .btn { - @apply h-full py-2 lt-md:px-2 md:px-4 rounded cursor-pointer; + @apply py-2 lt-md:px-2 md:px-4 rounded cursor-pointer inline-block; } .reset { diff --git a/src/components/WatchVideo.vue b/src/components/WatchVideo.vue index 7811df81..d5312ef7 100644 --- a/src/components/WatchVideo.vue +++ b/src/components/WatchVideo.vue @@ -74,7 +74,7 @@ -
+
From cba9ff5871bc9739b01e0b3adf08fe5d281ce721 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Sun, 9 Oct 2022 20:21:33 +0000 Subject: [PATCH 04/56] chore(deps): add renovate.json --- renovate.json | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 renovate.json diff --git a/renovate.json b/renovate.json new file mode 100644 index 00000000..39a2b6e9 --- /dev/null +++ b/renovate.json @@ -0,0 +1,6 @@ +{ + "$schema": "https://docs.renovatebot.com/renovate-schema.json", + "extends": [ + "config:base" + ] +} From 2fb5aa2becd7f8d4fe3fbcf919a8f636a5e43b75 Mon Sep 17 00:00:00 2001 From: Kavin <20838718+FireMasterK@users.noreply.github.com> Date: Mon, 10 Oct 2022 10:13:21 +0100 Subject: [PATCH 05/56] Move theme handling away from mixin. --- src/App.vue | 19 +++++++++++++++++++ src/main.js | 14 -------------- 2 files changed, 19 insertions(+), 14 deletions(-) diff --git a/src/App.vue b/src/App.vue index 9e9d889d..f324e374 100644 --- a/src/App.vue +++ b/src/App.vue @@ -15,12 +15,31 @@