diff --git a/apps/readest-app/src/app/reader/components/settings/MiscPanel.tsx b/apps/readest-app/src/app/reader/components/settings/MiscPanel.tsx index 8c4fd557..96a6cb8e 100644 --- a/apps/readest-app/src/app/reader/components/settings/MiscPanel.tsx +++ b/apps/readest-app/src/app/reader/components/settings/MiscPanel.tsx @@ -1,5 +1,5 @@ import clsx from 'clsx'; -import React, { useEffect, useState } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import i18n from 'i18next'; import { useEnv } from '@/context/EnvContext'; import { useReaderStore } from '@/store/readerStore'; @@ -14,7 +14,7 @@ import DropDown from './DropDown'; const MiscPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => { const _ = useTranslation(); - const { envConfig } = useEnv(); + const { envConfig, appService } = useEnv(); const { settings, isFontLayoutSettingsGlobal, setSettings } = useSettingsStore(); const { getView, getViewSettings, setViewSettings } = useReaderStore(); const viewSettings = getViewSettings(bookKey)!; @@ -26,6 +26,9 @@ const MiscPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => { const [draftStylesheetSaved, setDraftStylesheetSaved] = useState(true); const [error, setError] = useState(null); + const [inputFocusInAndroid, setInputFocusInAndroid] = useState(false); + const textareaRef = useRef(null); + const handleUserStylesheetChange = (e: React.ChangeEvent) => { const cssInput = e.target.value; setDraftStylesheet(cssInput); @@ -72,6 +75,24 @@ const MiscPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => { e.nativeEvent.stopImmediatePropagation(); }; + const handleInputFocus = () => { + if (appService?.isAndroidApp) { + setInputFocusInAndroid(true); + } + setTimeout(() => { + textareaRef.current?.scrollIntoView({ + behavior: 'instant', + block: 'center', + }); + }, 300); + }; + + const handleInputBlur = () => { + if (appService?.isAndroidApp) { + setInputFocusInAndroid(false); + } + }; + const getCurrentUILangOption = () => { const uiLanguage = viewSettings.uiLanguage; return { @@ -118,7 +139,9 @@ const MiscPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => { }, [isContinuousScroll]); return ( -
+

{_('Language')}

@@ -185,6 +208,7 @@ const MiscPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => { >