mirror of
https://github.com/zadam/trilium.git
synced 2025-11-26 02:24:23 +01:00
fix(type_widgets): double wrapper for read-only text
This commit is contained in:
parent
7ecdee7a89
commit
a398f07f9f
@ -1,8 +1,8 @@
|
|||||||
import type { CSSProperties, RefObject } from "preact/compat";
|
import type { CSSProperties, HTMLProps, RefObject } from "preact/compat";
|
||||||
|
|
||||||
type HTMLElementLike = string | HTMLElement | JQuery<HTMLElement>;
|
type HTMLElementLike = string | HTMLElement | JQuery<HTMLElement>;
|
||||||
|
|
||||||
interface RawHtmlProps {
|
interface RawHtmlProps extends Pick<HTMLProps<HTMLElement>, "tabindex" | "dir"> {
|
||||||
className?: string;
|
className?: string;
|
||||||
html?: HTMLElementLike;
|
html?: HTMLElementLike;
|
||||||
style?: CSSProperties;
|
style?: CSSProperties;
|
||||||
|
|||||||
@ -2,7 +2,7 @@ import { useEffect, useMemo, useRef } from "preact/hooks";
|
|||||||
import { TypeWidgetProps } from "../type_widget";
|
import { TypeWidgetProps } from "../type_widget";
|
||||||
import "./ReadOnlyText.css";
|
import "./ReadOnlyText.css";
|
||||||
import { useNoteBlob, useNoteLabel, useTriliumEvent, useTriliumOptionBool } from "../../react/hooks";
|
import { useNoteBlob, useNoteLabel, useTriliumEvent, useTriliumOptionBool } from "../../react/hooks";
|
||||||
import RawHtml from "../../react/RawHtml";
|
import { RawHtmlBlock } from "../../react/RawHtml";
|
||||||
|
|
||||||
// we load CKEditor also for read only notes because they contain content styles required for correct rendering of even read only notes
|
// we load CKEditor also for read only notes because they contain content styles required for correct rendering of even read only notes
|
||||||
// we could load just ckeditor-content.css but that causes CSS conflicts when both build CSS and this content CSS is loaded at the same time
|
// we could load just ckeditor-content.css but that causes CSS conflicts when both build CSS and this content CSS is loaded at the same time
|
||||||
@ -17,6 +17,7 @@ import TouchBar, { TouchBarButton, TouchBarSpacer } from "../../react/TouchBar";
|
|||||||
import appContext from "../../../components/app_context";
|
import appContext from "../../../components/app_context";
|
||||||
import { applyReferenceLinks } from "./read_only_helper";
|
import { applyReferenceLinks } from "./read_only_helper";
|
||||||
import { applyInlineMermaid, rewriteMermaidDiagramsInContainer } from "../../../services/content_renderer";
|
import { applyInlineMermaid, rewriteMermaidDiagramsInContainer } from "../../../services/content_renderer";
|
||||||
|
import clsx from "clsx";
|
||||||
|
|
||||||
export default function ReadOnlyText({ note, noteContext, ntxId }: TypeWidgetProps) {
|
export default function ReadOnlyText({ note, noteContext, ntxId }: TypeWidgetProps) {
|
||||||
const blob = useNoteBlob(note);
|
const blob = useNoteBlob(note);
|
||||||
@ -52,14 +53,12 @@ export default function ReadOnlyText({ note, noteContext, ntxId }: TypeWidgetPro
|
|||||||
});
|
});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<>
|
||||||
className={`note-detail-readonly-text note-detail-printable ${codeBlockWordWrap ? "word-wrap" : ""}`}
|
<RawHtmlBlock
|
||||||
tabindex={100}
|
|
||||||
dir={isRtl ? "rtl" : "ltr"}
|
|
||||||
>
|
|
||||||
<RawHtml
|
|
||||||
containerRef={contentRef}
|
containerRef={contentRef}
|
||||||
className="note-detail-readonly-text-content ck-content use-tn-links"
|
className={clsx("note-detail-readonly-text-content ck-content use-tn-links", codeBlockWordWrap && "word-wrap")}
|
||||||
|
tabindex={100}
|
||||||
|
dir={isRtl ? "rtl" : "ltr"}
|
||||||
html={blob?.content}
|
html={blob?.content}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
@ -75,7 +74,7 @@ export default function ReadOnlyText({ note, noteContext, ntxId }: TypeWidgetPro
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</TouchBar>
|
</TouchBar>
|
||||||
</div>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user