From 7cb9671fe386ddd3df13075d1014a69c73db52c7 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Fri, 22 Nov 2024 20:09:32 +0200
Subject: [PATCH] feat(theme): start implementing a theme for TriliumNext

---
 .../app/widgets/type_widgets/options/appearance/theme.js       | 3 ++-
 src/public/stylesheets/theme-next.css                          | 0
 src/public/translations/en/translation.json                    | 3 ++-
 src/routes/index.ts                                            | 2 ++
 4 files changed, 6 insertions(+), 2 deletions(-)
 create mode 100644 src/public/stylesheets/theme-next.css

diff --git a/src/public/app/widgets/type_widgets/options/appearance/theme.js b/src/public/app/widgets/type_widgets/options/appearance/theme.js
index 5948b373f..2de30778d 100644
--- a/src/public/app/widgets/type_widgets/options/appearance/theme.js
+++ b/src/public/app/widgets/type_widgets/options/appearance/theme.js
@@ -41,8 +41,9 @@ export default class ThemeOptions extends OptionsWidget {
 
     async optionsLoaded(options) {
         const themes = [
+            { val: 'next', title: t("theme.triliumnext") },
             { val: 'light', title: t('theme.light_theme') },
-            { val: 'dark', title: t('theme.dark_theme') }
+            { val: 'dark', title: t('theme.dark_theme') }            
         ].concat(await server.get('options/user-themes'));
 
         this.$themeSelect.empty();
diff --git a/src/public/stylesheets/theme-next.css b/src/public/stylesheets/theme-next.css
new file mode 100644
index 000000000..e69de29bb
diff --git a/src/public/translations/en/translation.json b/src/public/translations/en/translation.json
index 9bfc970be..eff426973 100644
--- a/src/public/translations/en/translation.json
+++ b/src/public/translations/en/translation.json
@@ -1061,7 +1061,8 @@
     "theme_label": "Theme",
     "override_theme_fonts_label": "Override theme fonts",
     "light_theme": "Light",
-    "dark_theme": "Dark"
+    "dark_theme": "Dark",
+    "triliumnext": "TriliumNext"
   },
   "zoom_factor": {
     "title": "Zoom Factor (desktop build only)",
diff --git a/src/routes/index.ts b/src/routes/index.ts
index ca204e868..f5951d3c6 100644
--- a/src/routes/index.ts
+++ b/src/routes/index.ts
@@ -54,6 +54,8 @@ function getThemeCssUrl(theme: string) {
         return false; // light theme is always loaded as baseline
     } else if (theme === 'dark') {
         return `${assetPath}/stylesheets/theme-dark.css`;
+    } else if (theme === "next") {
+        return `${assetPath}/stylesheets/theme-next.css`;
     } else {
         const themeNote = attributeService.getNoteWithLabel('appTheme', theme);