Mirrors/notesnook
1
0
Fork 0
mirror of https://github.com/streetwriters/notesnook.git synced 2026-02-23 19:49:56 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #9170 from streetwriters/editor/fix-line-height-css-issues

Browse Source 
editor: fix icons not aligning in outline,task,check lists & callouts because of custom line height
This commit is contained in:
Abdullah Atta
2026-01-14 13:52:36 +05:00
committed by GitHub
parent d00f7f6255 c8cd5a4dc8
commit 7e87cf7fdc
3 changed files with 11 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/editor-mobile/src/components/editor.tsx
View File

@@ -882,8 +882,7 @@ const Tiptap = ({
<div
style={{
display: tab.session?.locked ? "none" : "block",
lineHeight: settings.defaultLineHeight
display: tab.session?.locked ? "none" : "block"
}}
ref={contentPlaceholderRef}
className="theme-scope-editor"
@@ -947,6 +946,7 @@ const TiptapProvider = (): JSX.Element => {
editorContainer.style.padding = "0px 16px";
editorContainer.style.color = colors.primary.paragraph;
editorContainer.style.fontSize = `${settings.fontSize}px`;
editorContainer.style.lineHeight = `${settings.defaultLineHeight}`;
editorContainer.style.fontFamily =
getFontById(settings.fontFamily)?.font || "sans-serif";
contentRef.current = editorContainer;
@@ -966,8 +966,9 @@ const TiptapProvider = (): JSX.Element => {
contentRef.current.style.fontSize = `${settings.fontSize}px`;
contentRef.current.style.fontFamily =
getFontById(settings.fontFamily)?.font || "sans-serif";
contentRef.current.style.lineHeight = `${settings.defaultLineHeight}`;
}
}, [settings.fontSize, settings.fontFamily]);
}, [settings.fontSize, settings.fontFamily, settings.defaultLineHeight]);
return <Tiptap settings={settings} getContentDiv={getContentDiv} />;
};

6
packages/editor/src/extensions/task-item/component.tsx
View File

@@ -93,7 +93,7 @@ export function TaskItemComponent(
cursor: "grab",
mr: "0.2rem",
fontFamily: "inherit",
marginTop: "0.065rem"
marginTop: "calc((1lh - 18px) / 2)"
}}
size={isMobile ? "2.46ch" : "2.22ch"}
/>
@@ -117,7 +117,7 @@ export function TaskItemComponent(
borderColor: "accent"
},
fontFamily: "inherit",
marginTop: "0.13rem"
marginTop: "calc((1lh - 16px) / 2)"
}}
onMouseDown={(e) => {
if (globalThis.keyboardShown) {
@@ -155,7 +155,7 @@ export function TaskItemComponent(
bg: "background",
opacity: 0,
alignSelf: "flex-start",
marginTop: "0.16rem"
marginTop: "calc((1lh - 14px) / 2)"
}}
>
{editor.isEditable && (

8
packages/editor/styles/styles.css
View File

@@ -604,7 +604,7 @@ p > *::selection {
.outline-list > li::before {
position: absolute;
top: 0px;
top: calc((1lh - 18px) / 2);
cursor: pointer;
content: "";
background-size: 18px;
@@ -729,7 +729,7 @@ p > *::selection {
.simple-checklist > li::after {
position: absolute;
top: 0px;
top: calc((1lh - 18px) / 2);
cursor: pointer;
content: "";
background-size: 18px;
@@ -747,7 +747,7 @@ p > *::selection {
.simple-checklist > li.checked::before {
position: absolute;
top: 2px;
top: calc((1lh - 14px) / 2);
cursor: pointer;
content: "";
background-size: 18px;
@@ -790,7 +790,7 @@ p > *::selection {
.ProseMirror div.callout > :first-child::after {
position: absolute;
top: 0px;
top: calc((1lh - 18px) / 2);
right: 0px;
cursor: pointer;
content: "";