1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-06-09 01:17:06 +02:00

fix: Use the right theme even if the payload is a variant. (#9292)

Also, use extra css selectors to increase specificity so that this
takes precedence over the MUI themes.

I don't like that we need to do this weird selector thing, but hey, it
is what it is.
This commit is contained in:
Thomas Heartman 2025-02-11 14:28:36 +01:00 committed by GitHub
parent cac38b0cee
commit abb0450a6a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 27 additions and 6 deletions

View File

@ -169,7 +169,7 @@ exports[`FeedbackCESForm 1`] = `
hidden="" hidden=""
> >
<button <button
class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium Mui-disabled MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium css-l6m2tn-MuiButtonBase-root-MuiButton-root" class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium Mui-disabled MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium css-1ln3ri4-MuiButtonBase-root-MuiButton-root"
disabled="" disabled=""
tabindex="-1" tabindex="-1"
type="submit" type="submit"

View File

@ -75,7 +75,7 @@ exports[`renders an empty list correctly 1`] = `
/> />
<button <button
aria-labelledby="useId-0" aria-labelledby="useId-0"
className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium css-1xfu7h-MuiButtonBase-root-MuiButton-root" className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium css-1cn29am-MuiButtonBase-root-MuiButton-root"
disabled={false} disabled={false}
onBlur={[Function]} onBlur={[Function]}
onClick={[Function]} onClick={[Function]}

View File

@ -7,6 +7,7 @@ import legacyLightTheme from 'themes/theme.legacy';
import legacyDarkTheme from 'themes/dark-theme.legacy'; import legacyDarkTheme from 'themes/dark-theme.legacy';
import type { Theme } from '@mui/material/styles/createTheme'; import type { Theme } from '@mui/material/styles/createTheme';
import { useUiFlag } from './useUiFlag'; import { useUiFlag } from './useUiFlag';
import type { Variant } from 'utils/variants';
interface IUseThemeModeOutput { interface IUseThemeModeOutput {
resolveTheme: () => Theme; resolveTheme: () => Theme;
@ -19,12 +20,22 @@ export const useThemeMode = (): IUseThemeModeOutput => {
const key = 'unleash-theme'; const key = 'unleash-theme';
const uiGlobalFontSizeEnabled = useUiFlag('uiGlobalFontSize'); const uiGlobalFontSizeEnabled = useUiFlag('uiGlobalFontSize');
const resolveTheme = () => { let useNewTheme = false;
if (themeMode === 'light') { if (typeof uiGlobalFontSizeEnabled === 'boolean') {
return uiGlobalFontSizeEnabled ? lightTheme : legacyLightTheme; useNewTheme = uiGlobalFontSizeEnabled;
} else if (
typeof uiGlobalFontSizeEnabled === 'object' &&
'name' in uiGlobalFontSizeEnabled
) {
useNewTheme = (uiGlobalFontSizeEnabled as Variant).name !== 'disabled';
} }
return uiGlobalFontSizeEnabled ? darkTheme : legacyDarkTheme; const resolveTheme = () => {
if (themeMode === 'light') {
return useNewTheme ? lightTheme : legacyLightTheme;
}
return useNewTheme ? darkTheme : legacyDarkTheme;
}; };
const onSetThemeMode = () => { const onSetThemeMode = () => {

View File

@ -39,7 +39,12 @@ const theme = {
fontWeightBold: '700', fontWeightBold: '700',
fontWeightMedium: '700', fontWeightMedium: '700',
allVariants: { lineHeight: 1.4 }, allVariants: { lineHeight: 1.4 },
button: { lineHeight: 1.75, fontSize: '16px' }, button: {
lineHeight: 1.75,
'&&&': {
fontSize: '16px',
},
},
h1: { h1: {
fontSize: '1.5rem', fontSize: '1.5rem',
lineHeight: 1.875, lineHeight: 1.875,

View File

@ -31,7 +31,12 @@ export const theme = {
fontWeightBold: '700', fontWeightBold: '700',
fontWeightMedium: '700', fontWeightMedium: '700',
allVariants: { lineHeight: 1.4 }, allVariants: { lineHeight: 1.4 },
button: { lineHeight: 1.75, fontSize: '16px' }, button: {
lineHeight: 1.75,
'&&&': {
fontSize: '16px',
},
},
h1: { h1: {
fontSize: '1.5rem', fontSize: '1.5rem',
lineHeight: 1.875, lineHeight: 1.875,