From 8ed99ab82cb4d60dff4f4729bf0dd8a066fd1c7f Mon Sep 17 00:00:00 2001 From: thecodrr Date: Fri, 26 Feb 2021 10:23:53 +0500 Subject: [PATCH] feat: disable sticky toolbar for now --- apps/web/src/components/editor/index.js | 28 ----------------------- apps/web/src/components/editor/tinymce.js | 16 +++++-------- 2 files changed, 6 insertions(+), 38 deletions(-) diff --git a/apps/web/src/components/editor/index.js b/apps/web/src/components/editor/index.js index 28a3bbf50..ca4121081 100644 --- a/apps/web/src/components/editor/index.js +++ b/apps/web/src/components/editor/index.js @@ -20,7 +20,6 @@ import useTablet from "../../utils/use-tablet"; import Toolbar from "./toolbar"; import Banner from "../banner"; import EditorLoading from "./loading"; -import { useTheme } from "emotion-theming"; const ReactMCE = React.lazy(() => import("./tinymce")); @@ -36,7 +35,6 @@ function Editor({ noteId }) { const toggleProperties = useStore((store) => store.toggleProperties); const updateWordCount = useStore((store) => store.updateWordCount); const init = useStore((store) => store.init); - const theme = useTheme(); const isFocusMode = useAppStore((store) => store.isFocusMode); const isMobile = useMobile(); const isTablet = useTablet(); @@ -112,32 +110,6 @@ function Editor({ noteId }) { flexDirection="column" overflow="hidden" overflowY="auto" - onScroll={(e) => { - const title = document.querySelector(".editorTitle"); - const headerOffset = title.scrollHeight; - const hideOffset = headerOffset + 60 + 40; - const { editor } = editorRef.current; - if (e.target.scrollTop >= hideOffset && !editor.isToolbarSticky) { - editor.pauseScrollIntoView = true; - const toolbar = document.querySelector(".tox-editor-header"); - toolbar.style.position = "fixed"; - toolbar.style.top = "40px"; - toolbar.style.bottom = "auto"; - toolbar.style.width = `${title.clientWidth}px`; - toolbar.style.backgroundColor = theme.colors["background"]; - editor.isToolbarSticky = true; - } else if ( - e.target.scrollTop < hideOffset - 20 && - editor.isToolbarSticky - ) { - editor.pauseScrollIntoView = true; - const toolbar = document.querySelector(".tox-editor-header"); - toolbar.style.position = "relative"; - toolbar.style.top = "0px"; - toolbar.style.bottom = "auto"; - editor.isToolbarSticky = false; - } - }} > { editor.on("ScrollIntoView", (e) => { e.preventDefault(); - if (editor.pauseScrollIntoView) { - editor.pauseScrollIntoView = false; - } else { - e.elm.scrollIntoView({ - behavior: "smooth", - block: "nearest", - }); - } + e.elm.scrollIntoView({ + behavior: "smooth", + block: "nearest", + }); }); }, browser_spellcheck: true,