From c59c3b5c1f8fba38d6b2e4bfd19714cb1f75ba85 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?John=20Molakvo=C3=A6?= <skjnldsv@protonmail.com>
Date: Tue, 10 May 2022 16:47:48 +0200
Subject: Migrate to static icons colours
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: John Molakvoæ <skjnldsv@protonmail.com>
---
 apps/encryption/css/settings-personal.scss | 10 +++++-----
 apps/files/css/files.scss                  |  4 ++--
 apps/files_external/css/settings.scss      |  2 +-
 apps/theming/src/UserThemes.vue            | 15 +++++++++++----
 4 files changed, 19 insertions(+), 12 deletions(-)

(limited to 'apps')

diff --git a/apps/encryption/css/settings-personal.scss b/apps/encryption/css/settings-personal.scss
index d9846cc77f6..f7892c001df 100644
--- a/apps/encryption/css/settings-personal.scss
+++ b/apps/encryption/css/settings-personal.scss
@@ -2,14 +2,14 @@
  This file is licensed under the Affero General Public License version 3 or later.
  See the COPYING-README file. */
 
-#encryptAllError
-, #encryptAllSuccess
-, #recoveryEnabledError
-, #recoveryEnabledSuccess {
+#encryptAllError,
+#encryptAllSuccess,
+#recoveryEnabledError,
+#recoveryEnabledSuccess {
 	display: none;
 }
 
 /* icons for sidebar */
 .nav-icon-basic-encryption-module {
-	@include icon-color('app', 'encryption', $color-black);
+	background-image: var(--icon-encryption-dark);
 }
\ No newline at end of file
diff --git a/apps/files/css/files.scss b/apps/files/css/files.scss
index 2c9be4ef3fe..87b4151078d 100644
--- a/apps/files/css/files.scss
+++ b/apps/files/css/files.scss
@@ -133,7 +133,7 @@
 	@include icon-color('recent', 'files', $color-black);
 }
 .nav-icon-favorites {
-	@include icon-color('star-dark', 'actions', $color-black, 2, true);
+	@include icon-color('starred', 'actions', $color-black, 2, true);
 }
 .nav-icon-sharingin,
 .nav-icon-sharingout,
@@ -157,7 +157,7 @@
 	@include icon-color('unshare', 'files', $color-black);
 }
 .nav-icon-favorites-starred {
-	@include icon-color('star-dark', 'actions', $color-yellow, 2, true);
+	@include icon-color('starred', 'actions', $color-yellow, 2, true);
 }
 
 #app-navigation .nav-files a.nav-icon-files {
diff --git a/apps/files_external/css/settings.scss b/apps/files_external/css/settings.scss
index f11ea06c155..f4d8b677d96 100644
--- a/apps/files_external/css/settings.scss
+++ b/apps/files_external/css/settings.scss
@@ -150,5 +150,5 @@
 }
 
 .nav-icon-external-storage {
-	@include icon-color('app-dark', 'files_external', $color-black);
+	background-image: var(--icon-external-dark);
 }
diff --git a/apps/theming/src/UserThemes.vue b/apps/theming/src/UserThemes.vue
index 5128e2c6c8d..ee514f049a5 100644
--- a/apps/theming/src/UserThemes.vue
+++ b/apps/theming/src/UserThemes.vue
@@ -100,13 +100,12 @@ export default {
 			this.themes.forEach(theme => {
 				if (theme.id === id && enabled) {
 					theme.enabled = true
-					document.body.setAttribute(`data-theme-${theme.id}`, true)
 					return
 				}
 				theme.enabled = false
-				document.body.removeAttribute(`data-theme-${theme.id}`)
 			})
 
+			this.updateBodyAttributes()
 			this.selectItem(enabled, id)
 		},
 		changeFont({ enabled, id }) {
@@ -114,16 +113,24 @@ export default {
 			this.fonts.forEach(font => {
 				if (font.id === id && enabled) {
 					font.enabled = true
-					document.body.setAttribute(`data-theme-${font.id}`, true)
 					return
 				}
 				font.enabled = false
-				document.body.removeAttribute(`data-theme-${font.id}`)
 			})
 
+			this.updateBodyAttributes()
 			this.selectItem(enabled, id)
 		},
 
+		updateBodyAttributes() {
+			const enabledThemesIDs = this.themes.filter(theme => theme.enabled === true).map(theme => theme.id)
+			this.themes.forEach(theme => {
+				document.body.toggleAttribute(`data-theme-${theme.id}`, theme.enabled)
+			})
+
+			document.body.setAttribute('data-themes', enabledThemesIDs.join(','))
+		},
+
 		/**
 		 * Commit a change and force reload css
 		 * Fetching the file again will trigger the server update
-- 
cgit v1.2.3