From 5818a5983a1b33445da59f2c7a4644a1bc61f68d Mon Sep 17 00:00:00 2001 From: sijumoncy <72241997+sijumoncy@users.noreply.github.com> Date: Wed, 29 May 2024 09:20:54 +0530 Subject: [PATCH] general font change for all resource and editor seperate change option --- .../EditorPage/TextEditor/Editor.jsx | 6 +-- .../EditorPage/TextEditor/EditorMenuBar.jsx | 45 ++++++++++++++++++- .../TextEditor/ReferenceScribex.jsx | 12 ++--- .../EditorPage/TextEditor/index.jsx | 10 +++-- renderer/src/layouts/editor/SubMenuBar.js | 33 +++++++++----- renderer/src/modules/editor/Editor.js | 45 +++++++++++++++++-- 6 files changed, 122 insertions(+), 29 deletions(-) diff --git a/renderer/src/components/EditorPage/TextEditor/Editor.jsx b/renderer/src/components/EditorPage/TextEditor/Editor.jsx index 9423e062c..aed580380 100644 --- a/renderer/src/components/EditorPage/TextEditor/Editor.jsx +++ b/renderer/src/components/EditorPage/TextEditor/Editor.jsx @@ -39,7 +39,7 @@ export default function Editor(props) { const { state: { - chapter, selectedFont, fontSize, projectScriptureDir, + chapter, selectedFont, editorFontSize, projectScriptureDir, }, } = useContext(ReferenceContext); @@ -166,8 +166,8 @@ export default function Editor(props) { id="fulleditor" style={{ fontFamily: selectedFont || 'sans-serif', - fontSize: `${fontSize}rem`, - lineHeight: (fontSize > 1.3) ? 1.5 : '', + fontSize: `${editorFontSize}rem`, + lineHeight: (editorFontSize > 1.3) ? 1.5 : '', direction: `${projectScriptureDir === 'RTL' ? 'rtl' : 'auto'}`, }} className="border-l-2 border-r-2 border-secondary pb-16 overflow-auto h-full scrollbars-width leading-8" diff --git a/renderer/src/components/EditorPage/TextEditor/EditorMenuBar.jsx b/renderer/src/components/EditorPage/TextEditor/EditorMenuBar.jsx index 6cbaf96b7..49391c0fe 100644 --- a/renderer/src/components/EditorPage/TextEditor/EditorMenuBar.jsx +++ b/renderer/src/components/EditorPage/TextEditor/EditorMenuBar.jsx @@ -4,6 +4,7 @@ import { ProjectContext } from '@/components/context/ProjectContext'; import MenuDropdown from '@/components/MenuDropdown/MenuDropdown'; import { LockClosedIcon, BookmarkIcon, LockOpenIcon } from '@heroicons/react/24/outline'; // import BibleNavigationX from '@/components/EditorPage/TextEditor/BibleNavigationX'; +import { useTranslation } from 'react-i18next'; import BibleNavigationX from './BibleNavigationX'; import Buttons from './Buttons'; import InsertMenu from './InsertMenu'; @@ -17,16 +18,29 @@ export default function EditorMenuBar(props) { setVerseNumber, handleSelectedFont, setTriggerVerseInsert, + setEditorFontSize, + editorFontSize, } = props; + const { t } = useTranslation(); + const { states: { scrollLock }, actions: { setScrollLock }, } = useContext(ProjectContext); + const handleFontSize = (status) => { + if (status === 'dec' && editorFontSize > 0.70) { + setEditorFontSize(editorFontSize - 0.2); + } + if (status === 'inc' && editorFontSize < 2) { + setEditorFontSize(editorFontSize + 0.2); + } + }; + return (
-
+
Editor
+ + +
{ setSelectedBook(bookId.toUpperCase()); diff --git a/renderer/src/components/EditorPage/TextEditor/index.jsx b/renderer/src/components/EditorPage/TextEditor/index.jsx index c2e35b7b0..e11bdc78e 100644 --- a/renderer/src/components/EditorPage/TextEditor/index.jsx +++ b/renderer/src/components/EditorPage/TextEditor/index.jsx @@ -28,8 +28,10 @@ export default function TextEditor() { const { usfmData, bookAvailable } = useReadUsfmFile(); const { - state: { bookId, selectedFont }, - actions: { handleSelectedFont, onChangeChapter, onChangeVerse }, + state: { bookId, selectedFont, editorFontSize }, + actions: { + handleSelectedFont, onChangeChapter, onChangeVerse, setEditorFontSize, + }, } = useContext(ReferenceContext); const { @@ -59,7 +61,7 @@ export default function TextEditor() { useEffect(() => { onChangeChapter(chapterNumber, 1); onChangeVerse(verseNumber, 1); - // eslint-disable-next-line react-hooks/exhaustive-deps + // eslint-disable-next-line react-hooks/exhaustive-deps }, [chapterNumber, verseNumber]); const { catalog } = useCatalog({ proskomma, stateId, verbose }); @@ -94,6 +96,7 @@ export default function TextEditor() { ...perfState, ...actions, ...perfActions, + editorFontSize, selectedFont, chapterNumber, verseNumber, @@ -101,6 +104,7 @@ export default function TextEditor() { bookName, bookChange, bookAvailable, + setEditorFontSize, setBookChange, setChapterNumber, setVerseNumber, diff --git a/renderer/src/layouts/editor/SubMenuBar.js b/renderer/src/layouts/editor/SubMenuBar.js index 205ff41d2..44b7b2709 100644 --- a/renderer/src/layouts/editor/SubMenuBar.js +++ b/renderer/src/layouts/editor/SubMenuBar.js @@ -36,6 +36,10 @@ export default function SubMenuBar() { row, // openResource1, // openResource3, + fontSize1, + fontSize2, + fontSize3, + fontSize4, }, actions: { @@ -43,8 +47,13 @@ export default function SubMenuBar() { setOpenResource3, setLayout, setRow, + setFontsize1, + setFontsize2, + setFontsize3, + setFontsize4, }, } = useContext(ReferenceContext); + const { states: { editorSave, @@ -128,20 +137,20 @@ export default function SubMenuBar() { supabaseResourceType(); } }); - const { - state: { - fontSize, - }, - actions: { - setFontsize, - }, - } = useContext(ReferenceContext); + + // All Panel together const handleFontSize = (status) => { - if (status === 'dec' && fontSize > 0.70) { - setFontsize(fontSize - 0.2); + if (status === 'dec') { + fontSize1 > 0.70 && setFontsize1(fontSize1 - 0.2); + fontSize2 > 0.70 && setFontsize2(fontSize2 - 0.2); + fontSize3 > 0.70 && setFontsize3(fontSize3 - 0.2); + fontSize4 > 0.70 && setFontsize4(fontSize4 - 0.2); } - if (status === 'inc' && fontSize < 2) { - setFontsize(fontSize + 0.2); + if (status === 'inc') { + fontSize1 < 2 && setFontsize1(fontSize1 + 0.2); + fontSize2 < 2 && setFontsize2(fontSize2 + 0.2); + fontSize3 < 2 && setFontsize3(fontSize3 + 0.2); + fontSize4 < 2 && setFontsize4(fontSize4 + 0.2); } }; return ( diff --git a/renderer/src/modules/editor/Editor.js b/renderer/src/modules/editor/Editor.js index f02159a84..a169b05bd 100644 --- a/renderer/src/modules/editor/Editor.js +++ b/renderer/src/modules/editor/Editor.js @@ -32,7 +32,7 @@ export default function Editor({ const { state: { selectedFont, - fontSize, + editorFontSize, bookmarksVerses, bookName, chapter, @@ -43,6 +43,7 @@ export default function Editor({ setBookmarksVerses, setObsNavigation, handleSelectedFont, + setEditorFontSize, }, } = useContext(ReferenceContext); const [bookMarked, setBookMarks] = useState(false); @@ -52,6 +53,15 @@ export default function Editor({ setScrollLock(!scrollLock); }; + const handleFontSize = (status) => { + if (status === 'dec' && editorFontSize > 0.70) { + setEditorFontSize(editorFontSize - 0.2); + } + if (status === 'inc' && editorFontSize < 2) { + setEditorFontSize(editorFontSize + 0.2); + } + }; + useEffect(() => { if (((bookmarksVerses?.find((x) => x.bookname === bookName && x.chapter === chapter) !== undefined))) { @@ -148,7 +158,34 @@ export default function Editor({
{t('label-editor-pane')}
-
+
+ {/* */}
@@ -183,8 +220,8 @@ export default function Editor({
1.3) ? 1.5 : '', + fontSize: `${editorFontSize}rem`, + lineHeight: (editorFontSize > 1.3) ? 1.5 : '', direction: `${projectScriptureDir === 'RTL' ? 'rtl' : 'auto'}`, }} aria-label="editor"