diff --git a/server/model/monitor.js b/server/model/monitor.js index 49fcfb303..ae738a6bb 100644 --- a/server/model/monitor.js +++ b/server/model/monitor.js @@ -122,7 +122,9 @@ class Monitor extends BeanModel { try { await this.updateTlsInfo(checkCertificate(res)); } catch (e) { - console.error(e.message) + if (e.message !== "No TLS certificate in response") { + console.error(e.message) + } } } diff --git a/src/assets/app.scss b/src/assets/app.scss index cb72fb9dd..0c32f2b8c 100644 --- a/src/assets/app.scss +++ b/src/assets/app.scss @@ -5,6 +5,26 @@ font-family: ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,segoe ui,Roboto,helvetica neue,Arial,noto sans,sans-serif,apple color emoji,segoe ui emoji,segoe ui symbol,noto color emoji; } +.modal { + backdrop-filter: blur(3px); +} + +.modal-content { + border-radius: 1rem; + box-shadow: 0 15px 70px rgba(0, 0, 0, .1); + + .dark & { + box-shadow: 0 15px 70px rgb(0 0 0); + background-color: $dark-bg; + } +} + +.VuePagination__count { + font-size: 13px; + text-align: center; +} + + .shadow-box { overflow: hidden; box-shadow: 0 15px 70px rgba(0, 0, 0, .1); @@ -29,10 +49,87 @@ background-color: $highlight; border-color: $highlight; } + + .dark & { + color: $dark-font-color2; + } } -.modal-content { - border-radius: 1rem; - backdrop-filter: blur(3px); -} + +// Dark Theme override here +.dark { + background-color: #090C10; + color: $dark-font-color; + + .shadow-box { + background-color: $dark-bg; + } + + .form-check-input { + background-color: $dark-bg2; + } + + .form-switch .form-check-input { + background-color: #131a21; + } + + a, + .table, + .nav-link { + color: $dark-font-color; + } + + .form-control, + .form-control:focus, + .form-select, + .form-select:focus { + color: $dark-font-color; + background-color: $dark-bg2; + } + + .form-control, .form-select { + border-color: $dark-border-color; + } + + .table-hover > tbody > tr:hover { + --bs-table-accent-bg: #070A10; + color: $dark-font-color; + } + + .nav-pills .nav-link.active, .nav-pills .show > .nav-link { + color: $dark-font-color2; + } + + .bg-primary { + color: $dark-font-color2; + } + + .btn-secondary { + color: white; + } + + .btn-close { + opacity: 1; + } + + .modal-header { + border-color: $dark-bg; + } + + .modal-footer { + border-color: $dark-bg; + } + + // Pagination + .page-item.disabled .page-link { + background-color: $dark-bg; + border-color: $dark-border-color; + } + + .page-link { + background-color: $dark-bg; + border-color: $dark-border-color; + color: $dark-font-color; + } +} diff --git a/src/assets/vars.scss b/src/assets/vars.scss index ebec378a5..6d331370b 100644 --- a/src/assets/vars.scss +++ b/src/assets/vars.scss @@ -5,4 +5,10 @@ $link-color: #111; $border-radius: 50rem; $highlight: #7ce8a4; -$highlight-white: #e7faec; \ No newline at end of file +$highlight-white: #e7faec; + +$dark-font-color: #b1b8c0; +$dark-font-color2: #020b05; +$dark-bg: #0D1117; +$dark-bg2: #070A10; +$dark-border-color: #1d2634; diff --git a/src/components/HeartbeatBar.vue b/src/components/HeartbeatBar.vue index eed132d1c..ddd1617c8 100644 --- a/src/components/HeartbeatBar.vue +++ b/src/components/HeartbeatBar.vue @@ -133,7 +133,7 @@ export default { } - diff --git a/src/components/NotificationDialog.vue b/src/components/NotificationDialog.vue index e4adb528f..b6862458c 100644 --- a/src/components/NotificationDialog.vue +++ b/src/components/NotificationDialog.vue @@ -325,7 +325,7 @@

Status: Apprise is installed - Apprise is not installed. Read more + Apprise is not installed. Read more

@@ -512,3 +512,13 @@ export default { }, } + + diff --git a/src/layouts/Layout.vue b/src/layouts/Layout.vue index 4405ebb7b..9607483eb 100644 --- a/src/layouts/Layout.vue +++ b/src/layouts/Layout.vue @@ -1,76 +1,78 @@ - diff --git a/src/main.js b/src/main.js index 5b9ab9441..6ef72034c 100644 --- a/src/main.js +++ b/src/main.js @@ -9,6 +9,7 @@ import { FontAwesomeIcon } from "./icon.js"; import EmptyLayout from "./layouts/EmptyLayout.vue"; import Layout from "./layouts/Layout.vue"; import socket from "./mixins/socket"; +import theme from "./mixins/theme"; import Dashboard from "./pages/Dashboard.vue"; import DashboardHome from "./pages/DashboardHome.vue"; import Details from "./pages/Details.vue"; @@ -77,6 +78,7 @@ const router = createRouter({ const app = createApp({ mixins: [ socket, + theme ], data() { return { diff --git a/src/mixins/socket.js b/src/mixins/socket.js index 59abd27c1..46449adeb 100644 --- a/src/mixins/socket.js +++ b/src/mixins/socket.js @@ -29,7 +29,7 @@ export default { notificationList: [], windowWidth: window.innerWidth, showListMobile: false, - connectionErrorMsg: "Cannot connect to the socket server. Reconnecting..." + connectionErrorMsg: "Cannot connect to the socket server. Reconnecting...", } }, diff --git a/src/mixins/theme.js b/src/mixins/theme.js new file mode 100644 index 000000000..673a8caa6 --- /dev/null +++ b/src/mixins/theme.js @@ -0,0 +1,39 @@ +export default { + + data() { + return { + system: (window.matchMedia("(prefers-color-scheme: dark)")) ? "dark" : "light", + userTheme: localStorage.theme, + }; + }, + + mounted() { + // Default Light + if (! this.userTheme) { + this.userTheme = "light"; + } + + document.body.classList.add(this.theme); + }, + + computed: { + theme() { + if (this.userTheme === "auto") { + return this.system; + } + return this.userTheme; + } + }, + + watch: { + userTheme(to, from) { + localStorage.theme = to; + }, + + theme(to, from) { + document.body.classList.remove(from); + document.body.classList.add(this.theme); + } + } +} + diff --git a/src/pages/Dashboard.vue b/src/pages/Dashboard.vue index 60b7ca467..bbb60a265 100644 --- a/src/pages/Dashboard.vue +++ b/src/pages/Dashboard.vue @@ -89,7 +89,7 @@ export default { } - diff --git a/src/pages/DashboardHome.vue b/src/pages/DashboardHome.vue index 1fd4f6028..969652f31 100644 --- a/src/pages/DashboardHome.vue +++ b/src/pages/DashboardHome.vue @@ -169,7 +169,7 @@ export default { } - diff --git a/src/pages/Settings.vue b/src/pages/Settings.vue index 5eaab88b5..72f2d6a0e 100644 --- a/src/pages/Settings.vue +++ b/src/pages/Settings.vue @@ -20,6 +20,19 @@ +
+
+ + + + + + + + +
+
+
-
+

Notifications

@@ -201,8 +214,17 @@ export default { } - diff --git a/src/util.js b/src/util.js index 8e80cb61a..44630993a 100644 --- a/src/util.js +++ b/src/util.js @@ -29,7 +29,7 @@ function ucfirst(str) { exports.ucfirst = ucfirst; function debug(msg) { if (process.env.NODE_ENV === "development") { - console.log(msg); + console.debug(msg); } } exports.debug = debug; diff --git a/src/util.ts b/src/util.ts index 4d5323208..1ed6d4c64 100644 --- a/src/util.ts +++ b/src/util.ts @@ -39,6 +39,6 @@ export function ucfirst(str) { export function debug(msg) { if (process.env.NODE_ENV === "development") { - console.log(msg) + console.debug(msg); } }