diff --git a/src/authentication/renderer/authentication.main.js b/src/authentication/renderer/authentication.main.js
index 0b3c37e98..ebf173a6c 100644
--- a/src/authentication/renderer/authentication.main.js
+++ b/src/authentication/renderer/authentication.main.js
@@ -6,7 +6,7 @@
import { createApp } from 'vue'
import { setupWebPage } from '../../shared/setupWebPage.js'
-import '../../shared/assets/global.styles.css'
+import '../../shared/assets/styles.css'
await setupWebPage()
diff --git a/src/callbox/renderer/callbox.main.ts b/src/callbox/renderer/callbox.main.ts
index 04b8cdff2..c7a05dce7 100644
--- a/src/callbox/renderer/callbox.main.ts
+++ b/src/callbox/renderer/callbox.main.ts
@@ -6,7 +6,7 @@
import { createApp } from 'vue'
import { setupWebPage } from '../../shared/setupWebPage.js'
-import '../../shared/assets/global.styles.css'
+import '../../shared/assets/styles.css'
await setupWebPage()
diff --git a/src/certificate/renderer/certificate.main.ts b/src/certificate/renderer/certificate.main.ts
index 978391e38..48bfacc17 100644
--- a/src/certificate/renderer/certificate.main.ts
+++ b/src/certificate/renderer/certificate.main.ts
@@ -6,7 +6,7 @@
import { createApp } from 'vue'
import { setupWebPage } from '../../shared/setupWebPage.js'
-import '../../shared/assets/global.styles.css'
+import '../../shared/assets/styles.css'
await setupWebPage()
diff --git a/src/help/renderer/help.app.js b/src/help/renderer/help.app.js
index 7d19568ac..ba10675b5 100644
--- a/src/help/renderer/help.app.js
+++ b/src/help/renderer/help.app.js
@@ -6,7 +6,7 @@
import { createApp } from 'vue'
import { setupWebPage } from '../../shared/setupWebPage.js'
-import '../../shared/assets/global.styles.css'
+import '../../shared/assets/styles.css'
import './help.styles.css'
await setupWebPage()
diff --git a/src/shared/assets/global.styles.css b/src/shared/assets/global.styles.css
index 00dc23724..5bf386cac 100644
--- a/src/shared/assets/global.styles.css
+++ b/src/shared/assets/global.styles.css
@@ -1,4 +1,4 @@
-/*
+/*!
* SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors
* SPDX-License-Identifier: AGPL-3.0-or-later
*/
@@ -11,6 +11,6 @@
@import '@global-styles/apps/theming/theme/light.plain.css' (prefers-color-scheme: light);
@import '@global-styles/apps/theming/theme/dark.plain.css' (prefers-color-scheme: dark);
-/*!* Theme styles for explicit set themes *!*/
+/* Theme styles for explicit set themes */
@import '@global-styles/apps/theming/theme/light.css';
@import '@global-styles/apps/theming/theme/dark.css';
diff --git a/src/shared/assets/styles.css b/src/shared/assets/styles.css
new file mode 100644
index 000000000..8d11e36c9
--- /dev/null
+++ b/src/shared/assets/styles.css
@@ -0,0 +1,23 @@
+/*!
+ * SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+@import './global.styles.css';
+
+* {
+ box-sizing: border-box;
+}
+
+:focus-visible {
+ outline-color: var(--color-main-text);
+}
+
+:root /* The base variables calculation */,
+body /* Theming overrides */{
+ /* It is IMPORTANT to set value in "px" for further calculations */
+ --body-container-margin: 0px !important;
+ --body-container-radius: 0 !important;
+ /* Make it more desktop-like and less a web-page: remove the image, keep only plain color */
+ --image-background: none;
+}
diff --git a/src/talk/renderer/TitleBar/TitleBar.vue b/src/talk/renderer/TitleBar/TitleBar.vue
index 3d5b15571..3a30fe434 100644
--- a/src/talk/renderer/TitleBar/TitleBar.vue
+++ b/src/talk/renderer/TitleBar/TitleBar.vue
@@ -62,7 +62,7 @@ const { isDevMode } = useDevMode()
height: var(--header-height);
margin-bottom: calc(-1 * var(--header-height));
box-sizing: border-box;
- color: var(--color-header-contrast);
+ color: var(--color-background-plain-text);
user-select: none;
}
diff --git a/src/talk/renderer/TitleBar/components/MainMenu.vue b/src/talk/renderer/TitleBar/components/MainMenu.vue
index 37bf21224..08648d418 100644
--- a/src/talk/renderer/TitleBar/components/MainMenu.vue
+++ b/src/talk/renderer/TitleBar/components/MainMenu.vue
@@ -38,7 +38,7 @@ const openInWeb = () => window.open(generateUrl(getCurrentTalkRoutePath()), '_bl
variant="tertiary-no-background"
container="body">
-
+
diff --git a/src/talk/renderer/assets/styles.css b/src/talk/renderer/assets/styles.css
deleted file mode 100644
index 646ee6fa0..000000000
--- a/src/talk/renderer/assets/styles.css
+++ /dev/null
@@ -1,26 +0,0 @@
-/**
- * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-
-* {
- /*
- It's safe to reset box-sizing for all the page.
- In Nextcloud (at least 26) box-sizing is set to border-box to the entire (#content-vue .content).
- Nextcloud Talk Desktop has only and its own components.
- */
- box-sizing: border-box;
-}
-
-:focus-visible {
- outline-color: var(--color-main-text);
-}
-
-#header {
- /*
- Adjusting of text and icons appearing on Nextcloud header to contrast with.
- Nextcloud (28-29) server has a workaround with '--background-image-color-text' variable.
- Starting from Nextcloud 30 server has '--color-background-plain-text' variable.
- */
- --color-header-contrast: var(--color-background-plain-text, var(--background-image-color-text, #ffffff))
-}
diff --git a/src/talk/renderer/talk.main.ts b/src/talk/renderer/talk.main.ts
index dd925853a..a2fe4d733 100644
--- a/src/talk/renderer/talk.main.ts
+++ b/src/talk/renderer/talk.main.ts
@@ -6,12 +6,10 @@
import { setupWebPage } from '../../shared/setupWebPage.js'
import { createTalkDesktopApp } from './TalkDesktop.app.ts'
-import '../../shared/assets/global.styles.css'
+import '../../shared/assets/styles.css'
import '@talk/src/icons.css'
-import './assets/styles.css'
-import './assets/overrides.css'
+import './talk.styles.css'
-// Initially open the Welcome page, if not specified
await setupWebPage()
await createTalkDesktopApp()
diff --git a/src/talk/renderer/assets/overrides.css b/src/talk/renderer/talk.styles.css
similarity index 71%
rename from src/talk/renderer/assets/overrides.css
rename to src/talk/renderer/talk.styles.css
index b24b33a89..119a451d9 100644
--- a/src/talk/renderer/assets/overrides.css
+++ b/src/talk/renderer/talk.styles.css
@@ -1,4 +1,4 @@
-/**
+/*!
* SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
* SPDX-License-Identifier: AGPL-3.0-or-later
*/
@@ -7,13 +7,6 @@
* Overrides default Nextcloud styles
*/
-:root,
-body {
- /* It is IMPORTANT to set "px" here, not just "0" */
- --body-container-margin: 0px !important;
- --body-container-radius: 0 !important;
-}
-
#content {
margin-top: var(--header-height) !important;
}
diff --git a/src/upgrade/renderer/upgrade.main.ts b/src/upgrade/renderer/upgrade.main.ts
index 11966a92f..e83dd7719 100644
--- a/src/upgrade/renderer/upgrade.main.ts
+++ b/src/upgrade/renderer/upgrade.main.ts
@@ -6,7 +6,7 @@
import { createApp } from 'vue'
import { setupWebPage } from '../../shared/setupWebPage.js'
-import '../../shared/assets/global.styles.css'
+import '../../shared/assets/styles.css'
await setupWebPage()