matty/ncd-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pl-fe: make themes work with style-src: self csp

Browse Source 
Signed-off-by: Nicole Mikołajczyk <git@mkljczk.pl>
This commit is contained in:
Nicole Mikołajczyk
2025-05-27 00:45:25 +02:00
parent 0582c37c28
commit 38f053bb5d
2 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/pl-fe/src/init/pl-fe-head.tsx
View File

@ -46,10 +46,10 @@ const PlFeHead = () => {
'dark': theme === 'dark',
'dark black': theme === 'black',
})}
// @ts-ignore
style={themeCss + ['dark', 'black'].includes(theme) ? 'color-scheme: dark;' : ''}
/>
<body className={bodyClass} dir={direction} />
{themeCss && <style id='theme' type='text/css'>{`:root{${themeCss}}`}</style>}
{['dark', 'black'].includes(theme) && <style type='text/css'>{':root { color-scheme: dark; }'}</style>}
<meta name='theme-color' content={plFeConfig.brandColor} />
</Helmet>
);

4
packages/pl-fe/src/utils/theme.ts
View File

@ -76,7 +76,7 @@ const generateNeutral = (brandColor: string): string | null => {
return hslToHex({ h, s: 20, l: 55 });
};
const parseShades = (obj: Record<string, any>, color: string, shades: Record<string, any>): void => {
const parseShades = (obj: Record<string, string>, color: string, shades: Record<string, any>): void => {
if (!shades) return;
if (typeof shades === 'string') {
@ -98,7 +98,7 @@ const parseShades = (obj: Record<string, any>, color: string, shades: Record<str
};
// Convert colors as CSS variables
const parseColors = (colors: TailwindColorPalette): TailwindColorPalette =>
const parseColors = (colors: TailwindColorPalette): Record<string, string> =>
Object.keys(colors).reduce((obj, color) => {
parseShades(obj, color, colors[color] as TailwindColorObject);
return obj;