Merge pull request #27854 from nextcloud/fix/27371/fix-dark-theme-public-pages

Fix dark theme on public link shares

apps/accessibility/lib/AppInfo/Application.php

@@ -78,6 +78,7 @@ class Application extends App implements IBootstrap {
 			$hash = md5(implode('-', $userValues));
 			$linkToCSS = $urlGenerator->linkToRoute(self::APP_ID . '.accessibility.getCss', ['md5' => $hash]);
 			\OCP\Util::addHeader('link', ['rel' => 'stylesheet', 'media' => '(prefers-color-scheme: dark)', 'href' => $linkToCSS]);
+			\OCP\Util::addScript('accessibility', 'accessibilityoca');
 		}
 	}
 }

apps/accessibility/lib/Service/JSDataService.php

@@ -60,6 +60,7 @@ class JSDataService extends InitialStateProvider {
 		}
 
 		return [
+			'checkMedia' => $user === null,
 			'theme' => $theme,
 			'highcontrast' => $highcontrast,
 		];

apps/accessibility/src/accessibilityoca.js

@@ -24,6 +24,11 @@
 import { loadState } from '@nextcloud/initial-state'
 
 OCA.Accessibility = loadState('accessibility', 'data')
+if (OCA.Accessibility.checkMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+	// Overwrite the theme for Guests based on the prefers-color-scheme
+	OCA.Accessibility.theme = 'dark'
+}
+
 if (OCA.Accessibility.theme !== false) {
 	document.body.classList.add(`theme--${OCA.Accessibility.theme}`)
 } else {

core/templates/filepicker.html

@@ -52,10 +52,7 @@
 							<span class="filename-parts__last">{filename2}</span>
 						</span>
 					</td>
-					<td class="filesize"
-						style="color:rgb({sizeColor}, {sizeColor}, {sizeColor})">
-						{size}
-					</td>
+					<td class="filesize">{size}</td>
 					<td class="date">{date}</td>
 				</tr>
 			</tbody>