From c1514d77965afa55565159d9e7bebc8df590b4cc Mon Sep 17 00:00:00 2001
From: L4stIdi0t <movi3.idi0t@gmail.com>
Date: Sun, 24 May 2026 21:51:23 +0200
Subject: [PATCH 1/2] fix: restore fixed render mode for logs tab

---
 apps/app-frontend/src/routes.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/app-frontend/src/routes.js b/apps/app-frontend/src/routes.js
index c12306b5ad..00f7268811 100644
--- a/apps/app-frontend/src/routes.js
+++ b/apps/app-frontend/src/routes.js
@@ -240,7 +240,7 @@ export default new createRouter({
 					component: Instance.Logs,
 					meta: {
 						useRootContext: true,
-						// renderMode: 'fixed',
+						renderMode: 'fixed',
 						breadcrumb: [{ name: '?Instance', link: '/instance/{id}/' }, { name: 'Logs' }],
 					},
 				},

From a8a75e585abbf4aa4a82b6fb68d465d265dde756 Mon Sep 17 00:00:00 2001
From: L4stIdi0t <movi3.idi0t@gmail.com>
Date: Sun, 24 May 2026 22:45:47 +0200
Subject: [PATCH 2/2] feat: react to system theme changes in real time

When the 'System' theme is selected, listen for OS-level
prefers-color-scheme changes and update the app theme immediately,
without requiring a restart.
---
 apps/app-frontend/src/store/theme.ts | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/apps/app-frontend/src/store/theme.ts b/apps/app-frontend/src/store/theme.ts
index 0d5d0c9b3f..20b8aabc8e 100644
--- a/apps/app-frontend/src/store/theme.ts
+++ b/apps/app-frontend/src/store/theme.ts
@@ -1,5 +1,7 @@
 import { defineStore } from 'pinia'
 
+let systemThemeMq: MediaQueryList | null = null
+
 export const DEFAULT_FEATURE_FLAGS = {
 	project_background: false,
 	page_path: false,
@@ -49,21 +51,22 @@ export const useTheming = defineStore('themeStore', {
 			this.setThemeClass()
 		},
 		setThemeClass() {
+			const html = document.getElementsByTagName('html')[0]
 			for (const theme of THEME_OPTIONS) {
-				document.getElementsByTagName('html')[0].classList.remove(`${theme}-mode`)
+				html.classList.remove(`${theme}-mode`)
 			}
 
+			systemThemeMq?.removeEventListener('change', this.setThemeClass)
+			systemThemeMq = null
+
 			let theme = this.selectedTheme
 			if (this.selectedTheme === 'system') {
-				const darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)')
-				if (darkThemeMq.matches) {
-					theme = 'dark'
-				} else {
-					theme = 'light'
-				}
+				systemThemeMq = window.matchMedia('(prefers-color-scheme: dark)')
+				systemThemeMq.addEventListener('change', this.setThemeClass)
+				theme = systemThemeMq.matches ? 'dark' : 'light'
 			}
 
-			document.getElementsByTagName('html')[0].classList.add(`${theme}-mode`)
+			html.classList.add(`${theme}-mode`)
 		},
 		getFeatureFlag(key: FeatureFlag) {
 			return this.featureFlags[key] ?? DEFAULT_FEATURE_FLAGS[key]