diff --git a/src/packages/frontend/account/editor-settings/font-size.tsx b/src/packages/frontend/account/editor-settings/font-size.tsx index 0e931f1a200..fc81d4010ba 100644 --- a/src/packages/frontend/account/editor-settings/font-size.tsx +++ b/src/packages/frontend/account/editor-settings/font-size.tsx @@ -5,6 +5,7 @@ import { InputNumber } from "antd"; import { LabeledRow } from "@cocalc/frontend/components"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { useIntl } from "react-intl"; interface Props { @@ -24,7 +25,7 @@ export function EditorSettingsFontSize(props: Props) { className="cc-account-prefs-font-size" > props.on_change("font_size", n ?? 14)} + onChange={(n) => props.on_change("font_size", n ?? DEFAULT_FONT_SIZE)} min={5} max={32} value={props.font_size} diff --git a/src/packages/frontend/editors/slate/editable-markdown.tsx b/src/packages/frontend/editors/slate/editable-markdown.tsx index 797ee9db80d..cc032541cdd 100644 --- a/src/packages/frontend/editors/slate/editable-markdown.tsx +++ b/src/packages/frontend/editors/slate/editable-markdown.tsx @@ -28,6 +28,7 @@ import { EditorFunctions } from "@cocalc/frontend/editors/markdown-input/multimo import { SAVE_DEBOUNCE_MS } from "@cocalc/frontend/frame-editors/code-editor/const"; import { useFrameContext } from "@cocalc/frontend/frame-editors/frame-tree/frame-context"; import { Path } from "@cocalc/frontend/frame-editors/frame-tree/path"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { EditorState } from "@cocalc/frontend/frame-editors/frame-tree/types"; import { markdown_to_html } from "@cocalc/frontend/markdown"; import Fragment, { FragmentId } from "@cocalc/frontend/misc/fragment-id"; @@ -171,7 +172,7 @@ export const EditableMarkdown: React.FC = React.memo((props: Props) => { const isMountedRef = useIsMountedRef(); const id = id0 ?? ""; const actions = actions0 ?? {}; - const font_size = font_size0 ?? desc?.get("font_size") ?? 14; // so possible to use without specifying this. TODO: should be from account settings + const font_size = font_size0 ?? desc?.get("font_size") ?? DEFAULT_FONT_SIZE; // so possible to use without specifying this. TODO: should be from account settings const [change, setChange] = useState(0); const editor = useMemo(() => { diff --git a/src/packages/frontend/frame-editors/latex-editor/output-files.tsx b/src/packages/frontend/frame-editors/latex-editor/output-files.tsx index 789889af4e0..01a6b3323d0 100644 --- a/src/packages/frontend/frame-editors/latex-editor/output-files.tsx +++ b/src/packages/frontend/frame-editors/latex-editor/output-files.tsx @@ -63,7 +63,7 @@ export function OutputFiles({ path: filePath, displayPath, isMain: false, - summary: fileSummaries[filePath] ?? "Loading...", + summary: fileSummaries[filePath] ?? "Summary not available...", }; }); diff --git a/src/packages/frontend/frame-editors/latex-editor/output.tsx b/src/packages/frontend/frame-editors/latex-editor/output.tsx index 6fe0a1cfdbc..d7e68807ba2 100644 --- a/src/packages/frontend/frame-editors/latex-editor/output.tsx +++ b/src/packages/frontend/frame-editors/latex-editor/output.tsx @@ -40,6 +40,7 @@ import { import { EditorState } from "@cocalc/frontend/frame-editors/frame-tree/types"; import { project_api } from "@cocalc/frontend/frame-editors/generic/client"; import { editor, labels } from "@cocalc/frontend/i18n"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { TITLE_BAR_BORDER } from "../frame-tree/style"; import { Actions } from "./actions"; @@ -253,8 +254,8 @@ export function Output(props: OutputProps) { // Handle zoom changes from pinch-to-zoom or wheel gestures const handleZoomChange = useCallback( (data: Data) => { - // Convert fontSize to zoom scale (fontSize 14 = 1.0 zoom) - const newZoom = data.fontSize / 14; + // Convert fontSize to zoom scale (DEFAULT_FONT_SIZE = 1.0 zoom) + const newZoom = data.fontSize / DEFAULT_FONT_SIZE; const local_view_state = actions.store.get("local_view_state"); actions.setState({ local_view_state: local_view_state.setIn([id, "pdf_zoom"], newZoom), @@ -369,11 +370,8 @@ export function Output(props: OutputProps) { const autoSyncInProgress = actions.store.get("autoSyncInProgress"); if (autoSyncInProgress) { - // Debounce the flag clearing to avoid clearing too early during scrolling - clearTimeout((window as any).__autoSyncClearTimeout); - (window as any).__autoSyncClearTimeout = setTimeout(() => { - actions.setState({ autoSyncInProgress: false }); - }, 500); // Wait longer to ensure scrolling has stabilized + // Clear immediately to allow next forward sync without delay + actions.setState({ autoSyncInProgress: false }); } }} onPageDimensions={setPageDimensions} diff --git a/src/packages/frontend/frame-editors/latex-editor/pdfjs.tsx b/src/packages/frontend/frame-editors/latex-editor/pdfjs.tsx index 0258023d3d7..c82a4ac5109 100644 --- a/src/packages/frontend/frame-editors/latex-editor/pdfjs.tsx +++ b/src/packages/frontend/frame-editors/latex-editor/pdfjs.tsx @@ -35,6 +35,7 @@ import usePinchToZoom, { } from "@cocalc/frontend/frame-editors/frame-tree/pinch-to-zoom"; import { EditorState } from "@cocalc/frontend/frame-editors/frame-tree/types"; import { list_alternatives, seconds_ago } from "@cocalc/util/misc"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { COLORS } from "@cocalc/util/theme"; import { Actions, Actions as LatexEditorActions } from "./actions"; import { dblclick } from "./mouse-click"; @@ -248,7 +249,7 @@ export function PDFJS({ if (evt.key == "0" && (evt.metaKey || evt.ctrlKey)) { actions.set_font_size( id, - redux.getStore("account").get("font_size") ?? 14, + redux.getStore("account").get("font_size") ?? DEFAULT_FONT_SIZE, ); return; } @@ -440,7 +441,8 @@ export function PDFJS({ // Use onZoom callback if available (new zoom system), otherwise fall back to font_size if (onZoom) { - const fontSize = getFontSize(scale); + // For zoom-to-fit, always use DEFAULT_FONT_SIZE as base to avoid account font size dependency + const fontSize = scale * DEFAULT_FONT_SIZE; onZoom({ fontSize }); } else { actions.set_font_size(id, getFontSize(scale)); @@ -464,7 +466,8 @@ export function PDFJS({ // Use onZoom callback if available (new zoom system), otherwise fall back to font_size if (onZoom) { - const fontSize = getFontSize(scale); + // For zoom-to-fit, always use DEFAULT_FONT_SIZE as base to avoid account font size dependency + const fontSize = scale * DEFAULT_FONT_SIZE; onZoom({ fontSize }); } else { actions.set_font_size(id, getFontSize(scale)); @@ -840,11 +843,16 @@ export function PDFJS({ if (zoom !== undefined) { return zoom; } - return font_size / (redux.getStore("account").get("font_size") ?? 14); + return ( + font_size / + (redux.getStore("account").get("font_size") ?? DEFAULT_FONT_SIZE) + ); }, [zoom, font_size]); function getFontSize(scale: number): number { - return (redux.getStore("account").get("font_size") ?? 14) * scale; + return ( + (redux.getStore("account").get("font_size") ?? DEFAULT_FONT_SIZE) * scale + ); } function renderOtherViewers() { diff --git a/src/packages/frontend/frame-editors/whiteboard-editor/overview.tsx b/src/packages/frontend/frame-editors/whiteboard-editor/overview.tsx index 8f1d4d1f6ea..eae1c74a732 100644 --- a/src/packages/frontend/frame-editors/whiteboard-editor/overview.tsx +++ b/src/packages/frontend/frame-editors/whiteboard-editor/overview.tsx @@ -12,6 +12,7 @@ import { VirtuosoGrid } from "react-virtuoso"; import { useEditorRedux } from "@cocalc/frontend/app-framework"; import { Loading } from "@cocalc/frontend/components"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { State, elementsList } from "./actions"; import DeletePage from "./delete-page"; import { useFrameContext } from "./hooks"; @@ -21,7 +22,7 @@ import { Overview as OnePage } from "./tools/navigation"; export default function Overview() { const { actions, id: frameId, project_id, path, desc } = useFrameContext(); const useEditor = useEditorRedux({ project_id, path }); - const size = 15 * (desc?.get("font_size") ?? 14); + const size = 15 * (desc?.get("font_size") ?? DEFAULT_FONT_SIZE); const isLoaded = useEditor("is_loaded"); const pagesMap = useEditor("pages"); const elementsMap = useEditor("elements"); diff --git a/src/packages/frontend/frame-editors/x11-editor/x11.tsx b/src/packages/frontend/frame-editors/x11-editor/x11.tsx index 0c198747f7d..6a69cea088d 100644 --- a/src/packages/frontend/frame-editors/x11-editor/x11.tsx +++ b/src/packages/frontend/frame-editors/x11-editor/x11.tsx @@ -23,6 +23,7 @@ import { } from "@cocalc/frontend/app-framework"; import { Loading } from "@cocalc/frontend/components"; import { retry_until_success } from "@cocalc/util/async-utils"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { cmp } from "@cocalc/util/misc"; import { Actions } from "./actions"; import { TAB_BAR_GREY } from "./theme"; @@ -56,7 +57,8 @@ export function X11({ const windowRef = useRef(null as any); const focusRef = useRef(null as any); - const default_font_size = useTypedRedux("account", "font_size") ?? 14; + const default_font_size = + useTypedRedux("account", "font_size") ?? DEFAULT_FONT_SIZE; const windows: Map = useRedux(name, "windows"); const x11_is_idle: boolean = useRedux(name, "x11_is_idle"); const disabled: boolean = useRedux(name, "disabled"); diff --git a/src/packages/frontend/jupyter/history-viewer.tsx b/src/packages/frontend/jupyter/history-viewer.tsx index 4b9cbb142a9..e2b965e3b65 100644 --- a/src/packages/frontend/jupyter/history-viewer.tsx +++ b/src/packages/frontend/jupyter/history-viewer.tsx @@ -11,6 +11,7 @@ import { fromJS, List, Map } from "immutable"; import { redux, useTypedRedux } from "@cocalc/frontend/app-framework"; import { ErrorDisplay } from "@cocalc/frontend/components"; import * as cell_utils from "@cocalc/jupyter/util/cell-utils"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { path_split } from "@cocalc/util/misc"; import { CellList } from "./cell-list"; import { cm_options } from "./cm_options"; @@ -30,7 +31,7 @@ function get_cells(doc): { cells: Map; cell_list: List } { export function HistoryViewer({ project_id, path, doc, font_size }) { const default_font_size = - font_size ?? useTypedRedux("account", "font_size") ?? 14; + font_size ?? useTypedRedux("account", "font_size") ?? DEFAULT_FONT_SIZE; const { head: directory } = path_split(path); const { cells, cell_list } = get_cells(doc); diff --git a/src/packages/util/consts/ui.ts b/src/packages/util/consts/ui.ts index 552a923303b..ba52f5ca41a 100644 --- a/src/packages/util/consts/ui.ts +++ b/src/packages/util/consts/ui.ts @@ -29,5 +29,7 @@ export const DOC_AI = "https://doc.cocalc.com/ai.html"; // anywhere in our frontend. export const R_IDE = "R IDE"; +// Default font size for account settings and UI elements +export const DEFAULT_FONT_SIZE = 14; // Icon unicode character for dark mode toggle (◑ - circle with right half black) export const DARK_MODE_ICON = 0x25d1;