Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-01-27 22:49:56 -05:00
Code Issues Activity

Properly unset custom font and offer theme defaults as default

Browse source
This commit is contained in:
Aileen Booker 2024-10-08 16:33:07 +01:00
parent 9e552da8d8
commit bbcab4696c
1 changed files with 10 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
apps/admin-x-settings/src/components/settings/site/designAndBranding/BrandSettings.tsx
View file

@ -29,6 +29,8 @@ export interface BrandSettingValues {
bodyFont: string bodyFont: string
} }
const DEFAULT_FONT = 'Theme default';
const BrandSettings: React.FC<{ values: BrandSettingValues, updateSetting: (key: string, value: SettingValue) => void }> = ({values,updateSetting}) => { const BrandSettings: React.FC<{ values: BrandSettingValues, updateSetting: (key: string, value: SettingValue) => void }> = ({values,updateSetting}) => {
const {mutateAsync: uploadImage} = useUploadImage(); const {mutateAsync: uploadImage} = useUploadImage();
const [siteDescription, setSiteDescription] = useState(values.description); const [siteDescription, setSiteDescription] = useState(values.description);
@ -46,16 +48,16 @@ const BrandSettings: React.FC<{ values: BrandSettingValues, updateSetting: (key:
const editor = usePinturaEditor(); const editor = usePinturaEditor();
const [headingFont, setHeadingFont] = useState(values.headingFont); const [headingFont, setHeadingFont] = useState(values.headingFont || DEFAULT_FONT);
const [bodyFont, setBodyFont] = useState(values.bodyFont); const [bodyFont, setBodyFont] = useState(values.bodyFont || DEFAULT_FONT);
// TODO: replace with getCustomFonts() once custom-fonts is updated and differentiates // TODO: replace with getCustomFonts() once custom-fonts is updated and differentiates
// between heading and body fonts // between heading and body fonts
const customHeadingFonts: HeadingFontOption[] = CUSTOM_FONTS.map(x => ({label: x, value: x})); const customHeadingFonts: HeadingFontOption[] = CUSTOM_FONTS.map(x => ({label: x, value: x}));
customHeadingFonts.push({label: 'Theme default', value: 'Theme default'}); customHeadingFonts.unshift({label: DEFAULT_FONT, value: DEFAULT_FONT});
const customBodyFonts: BodyFontOption[] = CUSTOM_FONTS.map(x => ({label: x, value: x})); const customBodyFonts: BodyFontOption[] = CUSTOM_FONTS.map(x => ({label: x, value: x}));
customBodyFonts.push({label: 'Theme default', value: 'Theme default'}); customBodyFonts.unshift({label: DEFAULT_FONT, value: DEFAULT_FONT});
const selectedHeadingFont = {label: headingFont, value: headingFont}; const selectedHeadingFont = {label: headingFont, value: headingFont};
const selectedBodyFont = {label: bodyFont, value: bodyFont}; const selectedBodyFont = {label: bodyFont, value: bodyFont};
@ -82,8 +84,8 @@ const BrandSettings: React.FC<{ values: BrandSettingValues, updateSetting: (key:
selectedOption={selectedHeadingFont} selectedOption={selectedHeadingFont}
title={'Heading font'} title={'Heading font'}
onSelect={(option) => { onSelect={(option) => {
if (option?.value === 'Theme default') { if (option?.value === DEFAULT_FONT) {
setHeadingFont(''); setHeadingFont(DEFAULT_FONT);
updateSetting('heading_font', ''); updateSetting('heading_font', '');
} else { } else {
setHeadingFont(option?.value || ''); setHeadingFont(option?.value || '');
@ -97,8 +99,8 @@ const BrandSettings: React.FC<{ values: BrandSettingValues, updateSetting: (key:
selectedOption={selectedBodyFont} selectedOption={selectedBodyFont}
title={'Body font'} title={'Body font'}
onSelect={(option) => { onSelect={(option) => {
if (option?.value === 'Theme default') { if (option?.value === DEFAULT_FONT) {
setBodyFont(''); setBodyFont(DEFAULT_FONT);
updateSetting('body_font', ''); updateSetting('body_font', '');
} else { } else {
setBodyFont(option?.value || ''); setBodyFont(option?.value || '');