0ct0pu5/siyuan
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

🐛 CSS

Browse source
This commit is contained in:
Vanessa 2024-12-03 14:01:51 +08:00
parent 1710194122
commit 07334bed6a
3 changed files with 10 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
app/src/protyle/index.ts
View file

@ -73,18 +73,20 @@ export class Protyle {
options: mergedOptions,
block: {},
highlight: {
mark: new Highlight(),
markHL: new Highlight(),
mark: CSS?.highlights ? new Highlight() : undefined,
markHL: CSS?.highlights ? new Highlight() : undefined,
ranges: [],
rangeIndex: 0,
styleElement: document.createElement("style"),
}
};
const styleId = genUUID();
this.protyle.highlight.styleElement.dataset.uuid = styleId;
this.protyle.highlight.styleElement.textContent = `.protyle-wysiwyg::highlight(search-mark-${styleId}) {background-color: var(--b3-protyle-inline-mark-background);color: var(--b3-protyle-inline-mark-color);}
if (CSS?.highlights) {
const styleId = genUUID();
this.protyle.highlight.styleElement.dataset.uuid = styleId;
this.protyle.highlight.styleElement.textContent = `.protyle-wysiwyg::highlight(search-mark-${styleId}) {background-color: var(--b3-protyle-inline-mark-background);color: var(--b3-protyle-inline-mark-color);}
.protyle-wysiwyg::highlight(search-mark-hl-${styleId}) {background-color: var(--b3-theme-primary-lighter);box-shadow: 0 0 0 .5px var(--b3-theme-on-background);}`;
}
this.protyle.hint = new Hint(this.protyle);
if (mergedOptions.render.breadcrumb) {

2
app/src/protyle/render/searchMarkRender.ts
View file

@ -1,5 +1,5 @@
export const searchMarkRender = (protyle: IProtyle, matchElements: NodeListOf<Element>) => {
if (matchElements.length === 0) {
if (matchElements.length === 0 || !CSS || !CSS.highlights) {
return;
}
protyle.highlight.markHL.clear();

4
app/src/search/util.ts
View file

@ -1161,7 +1161,7 @@ const renderNextSearchMark = (options: {
target: Element,
}) => {
const contentRect = options.edit.protyle.contentElement.getBoundingClientRect();
if (CSS.highlights) {
if (CSS?.highlights) {
options.edit.protyle.highlight.markHL.clear();
options.edit.protyle.highlight.mark.clear();
options.edit.protyle.highlight.rangeIndex++;
@ -1239,7 +1239,7 @@ export const getArticle = (options: {
}
const contentRect = options.edit.protyle.contentElement.getBoundingClientRect();
let matchRectTop: number;
if (CSS.highlights) {
if (CSS?.highlights) {
options.edit.protyle.highlight.rangeIndex = 0;
searchMarkRender(options.edit.protyle, matchElements);
matchRectTop = options.edit.protyle.highlight.ranges[0].getBoundingClientRect().top;