diff --git a/packages/app-mobile/components/NoteBodyViewer/NoteBodyViewer.test.tsx b/packages/app-mobile/components/NoteBodyViewer/NoteBodyViewer.test.tsx index a64eddbb03..949b717c5c 100644 --- a/packages/app-mobile/components/NoteBodyViewer/NoteBodyViewer.test.tsx +++ b/packages/app-mobile/components/NoteBodyViewer/NoteBodyViewer.test.tsx @@ -43,6 +43,7 @@ const WrappedNoteViewer: React.FC = ( ; @@ -82,7 +83,7 @@ const useRerenderHandler = (props: Props) => { const effectDependencies = [ props.noteBody, props.noteMarkupLanguage, props.renderer, props.highlightedKeywords, props.noteHash, props.noteResources, props.themeId, props.paddingBottom, lastResourceLoadCounter, - createEditPopupSyntax, destroyEditPopupSyntax, pluginSettingKeys, + createEditPopupSyntax, destroyEditPopupSyntax, pluginSettingKeys, props.fontSize, ]; const previousDeps = usePrevious(effectDependencies, []); // eslint-disable-next-line @typescript-eslint/no-explicit-any -- Old code before rule was applied @@ -149,8 +150,9 @@ const useRerenderHandler = (props: Props) => { theme: JSON.stringify({ bodyPaddingTop: '0.8em', bodyPaddingBottom: props.paddingBottom, - ...theme, + + noteViewerFontSize: props.fontSize, }), codeTheme: theme.codeThemeCss, diff --git a/packages/app-mobile/components/global-style.ts b/packages/app-mobile/components/global-style.ts index ef6720c5e4..d9e52af692 100644 --- a/packages/app-mobile/components/global-style.ts +++ b/packages/app-mobile/components/global-style.ts @@ -9,13 +9,14 @@ const baseStyle = { appearance: 'light', fontSize: 16, fontSizeLarge: 20, - noteViewerFontSize: 16, margin: 15, // No text and no interactive component should be within this margin itemMarginTop: 10, itemMarginBottom: 10, fontSizeSmaller: 14, disabledOpacity: 0.2, lineHeight: '1.6em', + // The default, may be overridden in settings: + noteViewerFontSize: 16, }; export type ThemeStyle = BaseTheme & typeof baseStyle & { diff --git a/packages/app-mobile/components/screens/Note/Note.tsx b/packages/app-mobile/components/screens/Note/Note.tsx index 671369ff65..6a7536256c 100644 --- a/packages/app-mobile/components/screens/Note/Note.tsx +++ b/packages/app-mobile/components/screens/Note/Note.tsx @@ -82,6 +82,7 @@ interface Props extends BaseProps { themeId: number; editorFontSize: number; editorFont: number; // e.g. Setting.FONT_MENLO + viewerFontSize: number; showSideMenu: boolean; searchQuery: string; ftsEnabled: number; @@ -1459,6 +1460,7 @@ class NoteScreenComponent extends BaseScreenComponent imp noteResources={this.state.noteResources} highlightedKeywords={keywords} themeId={this.props.themeId} + fontSize={this.props.viewerFontSize} noteHash={this.props.noteHash} onCheckboxChange={this.onBodyViewerCheckboxChange} onMarkForDownload={this.onMarkForDownload} @@ -1637,6 +1639,7 @@ const NoteScreen = connect((state: AppState) => { themeId: state.settings.theme, editorFont: state.settings['style.editor.fontFamily'] as number, editorFontSize: state.settings['style.editor.fontSize'], + viewerFontSize: state.settings['style.viewer.fontSize'], toolbarEnabled: state.settings['editor.mobile.toolbarEnabled'], ftsEnabled: state.settings['db.ftsEnabled'], sharedData: state.sharedData, diff --git a/packages/lib/models/settings/builtInMetadata.ts b/packages/lib/models/settings/builtInMetadata.ts index d286650569..f8947f8ecd 100644 --- a/packages/lib/models/settings/builtInMetadata.ts +++ b/packages/lib/models/settings/builtInMetadata.ts @@ -1057,6 +1057,20 @@ const builtInMetadata = (Setting: typeof SettingType) => { // Deprecated in favour of windowContentZoomFactor 'style.zoom': { value: 100, type: SettingItemType.Int, public: false, storage: SettingStorage.File, isGlobal: true, appTypes: [AppType.Desktop], section: 'appearance', label: () => '', minimum: 50, maximum: 500, step: 10 }, + 'style.viewer.fontSize': { + value: 16, + type: SettingItemType.Int, + public: true, + storage: SettingStorage.File, + isGlobal: true, + appTypes: [AppType.Mobile], + section: 'appearance', + label: () => _('Viewer font size'), + minimum: 4, + maximum: 50, + step: 1, + }, + 'style.editor.fontSize': { value: 15, type: SettingItemType.Int,