From f0298827de194b0339ff1ad340e189e641e2a341 Mon Sep 17 00:00:00 2001 From: Matias De lellis Date: Tue, 6 Feb 2024 11:29:05 -0300 Subject: [PATCH] Improve Quicknotes icon on dark themes.. --- css/global.css | 9 ------ css/icons.css | 28 +++++++++++++++++++ css/style.css | 4 +-- lib/Dashboard/NotesWidget.php | 2 +- .../BeforeTemplateRenderedListener.php | 2 +- 5 files changed, 32 insertions(+), 13 deletions(-) delete mode 100644 css/global.css create mode 100644 css/icons.css diff --git a/css/global.css b/css/global.css deleted file mode 100644 index eec182f..0000000 --- a/css/global.css +++ /dev/null @@ -1,9 +0,0 @@ -.dashboard-quicknotes-icon { - background-image: url(../img/app-dark.svg); - filter: var(--background-invert-if-dark); -} - -.dashboard-pinned-icon { - background-image: url(../img/pinned.svg); - filter: var(--background-invert-if-dark); -} diff --git a/css/icons.css b/css/icons.css new file mode 100644 index 0000000..1aab75e --- /dev/null +++ b/css/icons.css @@ -0,0 +1,28 @@ +:root { + --original-icon-quicknotes-dark: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgdmlld0JveD0iMCAwIDMyIDMyIgogICBmaWxsPSIjMDAwMDAwIgogICB2ZXJzaW9uPSIxLjEiCiAgIGlkPSJzdmcxIgogICB3aWR0aD0iMzIiCiAgIGhlaWdodD0iMzIiCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPGRlZnMKICAgICBpZD0iZGVmczEiIC8+CiAgPGcKICAgICBpZD0iZzMiCiAgICAgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMS40MDEzODExZS00LDQuOTg2MTg5MmUtNSkiPgogICAgPHBhdGgKICAgICAgIGQ9Im0gMjguMTk4LDI1LjIzMSBjIC0wLjEwMzUyLDEuNTE2MSAtMS42NTUyLDIuNTM5MiAtMy4wODQxLDIuMzM5NyAtNy4yNjcyLC0wLjAwODYgLTE0LjUzNSwtMC4wMjI2IC0yMS44MDIsLTAuMDUzMTggLTEuMzI1NCwtMC4wOTA2NiAtMi4yMTM1LC0xLjI0NDYgLTIuMjg2NSwtMi40OTkyIC0xLjQ5ZS00LDAuOTU2NjUgMC4wMDEyLDEuOTE0OCAwLDIuODcxNCAtMC4xOTk3NiwxLjQzMTcgMC43Njg4OCwyLjk4MDQgMi4yODY1LDMuMDg0MSA3LjI4MDQsMC4wMzA2MSAxNC41NzQsLTAuMDA4NiAyMS44NTUsMCAxLjQzMTcsMC4xOTk3NiAyLjk4MDQsLTAuNzY4ODggMy4wODQxLC0yLjI4NjUgbCAtMC4wNTMxOCwtMy40NTY0IHoiCiAgICAgICBpZD0icGF0aDEiIC8+CiAgICA8cGF0aAogICAgICAgZD0iTSAzLjU3ODQsMy43NDg2IEMgMi4zMDUzLDMuNzI2NjI2IDEuMTgyNCw0LjU3Nzg5IDEuMDc5Miw1LjYwOTcgMS4wNDg2NCwxMS41MTkgMS4wMzQ3NSwxNy40MDY3IDEuMDI2MDMsMjMuMzE2NyBjIC0wLjE5OTM4LDEuMTYyIDAuNzcxNzYsMi40MTUgMi4yODY1LDIuNDk5MiA3LjI2NjYsMC4wMjQ4NCAxNC41MzQsMC4wNDYwOCAyMS44MDIsMC4wNTMxOCAxLjQyOSwwLjE2MjE0IDIuOTgwNiwtMC42MjkzMSAzLjA4NDEsLTEuODYxMSAwLjAyNjQ1LC01LjExMzEgMC4wNTIzMiwtMTAuMjU0IDAuMDUzMTgsLTE1LjM2NyBsIC04LjU2MTEsOC41NjExIGMgLTAuNjM4MDksMC42MzgwOCAtMS40MjM1LDAuODY3MTEgLTIuMjMzMywwLjkwMzk3IC0wLjM5MjQ4LDAuMzIxMiAtMC43ODEyLDAuNjMyNjIgLTEuMjc2MiwwLjc5NzYyIC0wLjY3MTI2LDAuMjIzNzYgLTEuNzEwMiwwLjMxMDQyIC0yLjU1MjQsLTAuNTMxNzUgLTAuODQyMTYsLTAuODQyMTYgLTAuNzU1NSwtMS44ODExIC0wLjUzMTc1LC0yLjU1MjQgMC4xNjUsLTAuNDk0OTkgMC40NzY0MiwtMC44ODM3MiAwLjc5NzYyLC0xLjI3NjIgMC4wMzY4NSwtMC44MDk4NiAwLjI2NTg4LC0xLjU5NTIgMC45MDM5NywtMi4yMzMzIGwgOC41NjExLC04LjU2MTEgYyAtNi41Nzk2LC0wLjAxMzM1NyAtMTMuMjAxLDAuMDA2MjYgLTE5Ljc4MSwwIHoiCiAgICAgICBpZD0icGF0aDIiIC8+CiAgICA8cGF0aAogICAgICAgZD0ibSAxNi4wNjIsMTMuNTMyIGMgLTAuNDQwNDksMC40NDA0OSAtMC41NTUyOSwxLjA1NTggLTAuNDEzNiwxLjYxNjggbCAtMC4xODgsMC4xODggYyAtMC42NjY1OCwwLjY2NjU4IC0wLjkzNDg5LDEuNDcxNSAtMC42MDE2LDEuODA0OCAwLjMzMzI5LDAuMzMzMjkgMS4xMzgyLDAuMDY0OTcgMS44MDQ4LC0wLjYwMTYgbCAwLjE4OCwtMC4xODggYyAwLjU2MDk2LDAuMTQxNjkgMS4xNzYzLDAuMDI2ODggMS42MTY4LC0wLjQxMzYgbCAxMi4wMzIsLTEyLjAzMiBjIDAuNjY2NTgsLTAuNjY2NTggMC42NjY1OCwtMS43Mzk4IDAsLTIuNDA2NCAtMC42NjY1NywtMC42NjY1OCAtMS43Mzk4LC0wLjY2NjU4IC0yLjQwNjQsMCB6IgogICAgICAgaWQ9InBhdGgzIiAvPgogIDwvZz4KPC9zdmc+Cg=="); + --original-icon-quicknotes-white: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgdmlld0JveD0iMCAwIDMyIDMyIgogICBmaWxsPSIjZmZmZmZmIgogICB2ZXJzaW9uPSIxLjEiCiAgIGlkPSJzdmcxIgogICB3aWR0aD0iMzIiCiAgIGhlaWdodD0iMzIiCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPGRlZnMKICAgICBpZD0iZGVmczEiIC8+CiAgPGcKICAgICBpZD0iZzMiCiAgICAgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMS40MDEzODExZS00LDQuOTg2MTg5MmUtNSkiPgogICAgPHBhdGgKICAgICAgIGQ9Im0gMjguMTk4LDI1LjIzMSBjIC0wLjEwMzUyLDEuNTE2MSAtMS42NTUyLDIuNTM5MiAtMy4wODQxLDIuMzM5NyAtNy4yNjcyLC0wLjAwODYgLTE0LjUzNSwtMC4wMjI2IC0yMS44MDIsLTAuMDUzMTggLTEuMzI1NCwtMC4wOTA2NiAtMi4yMTM1LC0xLjI0NDYgLTIuMjg2NSwtMi40OTkyIC0xLjQ5ZS00LDAuOTU2NjUgMC4wMDEyLDEuOTE0OCAwLDIuODcxNCAtMC4xOTk3NiwxLjQzMTcgMC43Njg4OCwyLjk4MDQgMi4yODY1LDMuMDg0MSA3LjI4MDQsMC4wMzA2MSAxNC41NzQsLTAuMDA4NiAyMS44NTUsMCAxLjQzMTcsMC4xOTk3NiAyLjk4MDQsLTAuNzY4ODggMy4wODQxLC0yLjI4NjUgbCAtMC4wNTMxOCwtMy40NTY0IHoiCiAgICAgICBpZD0icGF0aDEiIC8+CiAgICA8cGF0aAogICAgICAgZD0iTSAzLjU3ODQsMy43NDg2IEMgMi4zMDUzLDMuNzI2NjI2IDEuMTgyNCw0LjU3Nzg5IDEuMDc5Miw1LjYwOTcgMS4wNDg2NCwxMS41MTkgMS4wMzQ3NSwxNy40MDY3IDEuMDI2MDMsMjMuMzE2NyBjIC0wLjE5OTM4LDEuMTYyIDAuNzcxNzYsMi40MTUgMi4yODY1LDIuNDk5MiA3LjI2NjYsMC4wMjQ4NCAxNC41MzQsMC4wNDYwOCAyMS44MDIsMC4wNTMxOCAxLjQyOSwwLjE2MjE0IDIuOTgwNiwtMC42MjkzMSAzLjA4NDEsLTEuODYxMSAwLjAyNjQ1LC01LjExMzEgMC4wNTIzMiwtMTAuMjU0IDAuMDUzMTgsLTE1LjM2NyBsIC04LjU2MTEsOC41NjExIGMgLTAuNjM4MDksMC42MzgwOCAtMS40MjM1LDAuODY3MTEgLTIuMjMzMywwLjkwMzk3IC0wLjM5MjQ4LDAuMzIxMiAtMC43ODEyLDAuNjMyNjIgLTEuMjc2MiwwLjc5NzYyIC0wLjY3MTI2LDAuMjIzNzYgLTEuNzEwMiwwLjMxMDQyIC0yLjU1MjQsLTAuNTMxNzUgLTAuODQyMTYsLTAuODQyMTYgLTAuNzU1NSwtMS44ODExIC0wLjUzMTc1LC0yLjU1MjQgMC4xNjUsLTAuNDk0OTkgMC40NzY0MiwtMC44ODM3MiAwLjc5NzYyLC0xLjI3NjIgMC4wMzY4NSwtMC44MDk4NiAwLjI2NTg4LC0xLjU5NTIgMC45MDM5NywtMi4yMzMzIGwgOC41NjExLC04LjU2MTEgYyAtNi41Nzk2LC0wLjAxMzM1NyAtMTMuMjAxLDAuMDA2MjYgLTE5Ljc4MSwwIHoiCiAgICAgICBpZD0icGF0aDIiIC8+CiAgICA8cGF0aAogICAgICAgZD0ibSAxNi4wNjIsMTMuNTMyIGMgLTAuNDQwNDksMC40NDA0OSAtMC41NTUyOSwxLjA1NTggLTAuNDEzNiwxLjYxNjggbCAtMC4xODgsMC4xODggYyAtMC42NjY1OCwwLjY2NjU4IC0wLjkzNDg5LDEuNDcxNSAtMC42MDE2LDEuODA0OCAwLjMzMzI5LDAuMzMzMjkgMS4xMzgyLDAuMDY0OTcgMS44MDQ4LC0wLjYwMTYgbCAwLjE4OCwtMC4xODggYyAwLjU2MDk2LDAuMTQxNjkgMS4xNzYzLDAuMDI2ODggMS42MTY4LC0wLjQxMzYgbCAxMi4wMzIsLTEyLjAzMiBjIDAuNjY2NTgsLTAuNjY2NTggMC42NjY1OCwtMS43Mzk4IDAsLTIuNDA2NCAtMC42NjY1NywtMC42NjY1OCAtMS43Mzk4LC0wLjY2NjU4IC0yLjQwNjQsMCB6IgogICAgICAgaWQ9InBhdGgzIiAvPgogIDwvZz4KPC9zdmc+Cg=="); +} + +.icon-quicknotes, +.icon-quicknotes-dark { + background-image: var(--original-icon-quicknotes-dark); +} + +.icon-quicknotes-white { + background-image: var(--original-icon-quicknotes-white); +} + +.dashboard-pinned-icon { + background-image: url(../img/pinned.svg); + filter: var(--background-invert-if-dark); +} + +@media (prefers-color-scheme: dark) { + .icon-quicknotes, + .icon-quicknotes-dark { + background-image: var(--original-icon-quicknotes-white); + } + .icon-quicknotes-white { + background-image: var(--original-icon-quicknotes-dark); + } +} diff --git a/css/style.css b/css/style.css index e33602f..1cee83e 100644 --- a/css/style.css +++ b/css/style.css @@ -1,6 +1,6 @@ -.icon-quicknotes { +/*.icon-quicknotes { background-image: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjAiIHZpZXdCb3g9IjAgMCAzMiAzMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KIDxnIGZpbGw9IiNmZmYiPgogIDxwYXRoIGQ9Im0yOC4xOTggMjUuMjMxYy0wLjEwMzUyIDEuNTE2MS0xLjY1NTIgMi41MzkyLTMuMDg0MSAyLjMzOTctNy4yNjcyLTAuMDA4Ni0xNC41MzUtMC4wMjI2LTIxLjgwMi0wLjA1MzE4LTEuMzI1NC0wLjA5MDY2LTIuMjEzNS0xLjI0NDYtMi4yODY1LTIuNDk5Mi0xLjQ5ZS00IDAuOTU2NjUgMC4wMDEyIDEuOTE0OCAwIDIuODcxNC0wLjE5OTc2IDEuNDMxNyAwLjc2ODg4IDIuOTgwNCAyLjI4NjUgMy4wODQxIDcuMjgwNCAwLjAzMDYxIDE0LjU3NC0wLjAwODYgMjEuODU1IDAgMS40MzE3IDAuMTk5NzYgMi45ODA0LTAuNzY4ODggMy4wODQxLTIuMjg2NWwtMC4wNTMxOC0zLjQ1NjR6Ii8+CiAgPHBhdGggZD0ibTMuNTc4NCAzLjc0ODZjLTEuMjczMS0wLjAyMTk3NC0yLjM5NiAwLjgyOTI5LTIuNDk5MiAxLjg2MTEtMC4wMzA1NiA1LjkwOTMtMC4wNDQ0NSAxMS43OTctMC4wNTMxNyAxNy43MDctMC4xOTkzOCAxLjE2MiAwLjc3MTc2IDIuNDE1IDIuMjg2NSAyLjQ5OTIgNy4yNjY2IDAuMDI0ODQgMTQuNTM0IDAuMDQ2MDggMjEuODAyIDAuMDUzMTggMS40MjkgMC4xNjIxNCAyLjk4MDYtMC42MjkzMSAzLjA4NDEtMS44NjExIDAuMDI2NDUtNS4xMTMxIDAuMDUyMzItMTAuMjU0IDAuMDUzMTgtMTUuMzY3bC04LjU2MTEgOC41NjExYy0wLjYzODA5IDAuNjM4MDgtMS40MjM1IDAuODY3MTEtMi4yMzMzIDAuOTAzOTctMC4zOTI0OCAwLjMyMTItMC43ODEyIDAuNjMyNjItMS4yNzYyIDAuNzk3NjItMC42NzEyNiAwLjIyMzc2LTEuNzEwMiAwLjMxMDQyLTIuNTUyNC0wLjUzMTc1LTAuODQyMTYtMC44NDIxNi0wLjc1NTUtMS44ODExLTAuNTMxNzUtMi41NTI0IDAuMTY1LTAuNDk0OTkgMC40NzY0Mi0wLjg4MzcyIDAuNzk3NjItMS4yNzYyIDAuMDM2ODUtMC44MDk4NiAwLjI2NTg4LTEuNTk1MiAwLjkwMzk3LTIuMjMzM2w4LjU2MTEtOC41NjExYy02LjU3OTYtMC4wMTMzNTctMTMuMjAxIDAuMDA2MjYtMTkuNzgxIDB6Ii8+CiAgPHBhdGggZD0ibTE2LjA2MiAxMy41MzJjLTAuNDQwNDkgMC40NDA0OS0wLjU1NTI5IDEuMDU1OC0wLjQxMzYgMS42MTY4bC0wLjE4OCAwLjE4OGMtMC42NjY1OCAwLjY2NjU4LTAuOTM0ODkgMS40NzE1LTAuNjAxNiAxLjgwNDggMC4zMzMyOSAwLjMzMzI5IDEuMTM4MiAwLjA2NDk3IDEuODA0OC0wLjYwMTZsMC4xODgtMC4xODhjMC41NjA5NiAwLjE0MTY5IDEuMTc2MyAwLjAyNjg4IDEuNjE2OC0wLjQxMzZsMTIuMDMyLTEyLjAzMmMwLjY2NjU4LTAuNjY2NTggMC42NjY1OC0xLjczOTggMC0yLjQwNjQtMC42NjY1Ny0wLjY2NjU4LTEuNzM5OC0wLjY2NjU4LTIuNDA2NCAweiIvPgogPC9nPgo8L3N2Zz4K") -} +}*/ .icon-pin { background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZlcnNpb249IjEuMSIgdmlld2JveD0iMCAwIDE2IDE2IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Im0xMS41NzEgMi40djQuOWwxLjQyODYgMi4xdjEuNGgtNC4yODU3djMuNWwtMC43MTQyOSAwLjctMC43MTQyOS0wLjd2LTMuNWgtNC4yODU3di0xLjRsMS40Mjg2LTIuMXYtNC45YzAtMC43NyAwLjY0Mjg2LTEuNCAxLjQyODYtMS40aDQuMjg1N2MwLjc5Mjg2IDAgMS40Mjg2IDAuNjIzIDEuNDI4NiAxLjR6bS01LjcxNDMgMHY1LjQyNWwtMS4wNzE0IDEuNTc1aDYuNDI4NmwtMS4wNzE0LTEuNTc1di01LjQyNXoiIHN0cm9rZS13aWR0aD0iLjcwNzExIi8+PC9zdmc+Cg==") diff --git a/lib/Dashboard/NotesWidget.php b/lib/Dashboard/NotesWidget.php index 651215f..3e0e9da 100644 --- a/lib/Dashboard/NotesWidget.php +++ b/lib/Dashboard/NotesWidget.php @@ -45,7 +45,7 @@ class NotesWidget implements IWidget { * @inheritDoc */ public function getIconClass(): string { - return 'dashboard-quicknotes-icon'; + return 'icon-quicknotes'; } /** diff --git a/lib/Listeners/BeforeTemplateRenderedListener.php b/lib/Listeners/BeforeTemplateRenderedListener.php index cc6f040..79e6042 100644 --- a/lib/Listeners/BeforeTemplateRenderedListener.php +++ b/lib/Listeners/BeforeTemplateRenderedListener.php @@ -27,7 +27,7 @@ class BeforeTemplateRenderedListener implements IEventListener { return; } - Util::addStyle('quicknotes', 'global'); + Util::addStyle('quicknotes', 'icons'); $pathInfo = $this->request->getPathInfo(); if (strpos($pathInfo, '/call/') === 0 || strpos($pathInfo, '/apps/spreed') === 0) {