Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2026-03-07 21:22:34 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

🎨 Add data-id attributes to elements in the font appearance menu (#16162)

Browse source 
fix https://github.com/siyuan-note/siyuan/issues/12518
This commit is contained in:
Jeffrey Chen 2025-10-22 09:30:13 +08:00 • committed by GitHub
parent f37b8461ad
commit f41b72ddc5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 25 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

26
app/src/protyle/toolbar/Font.ts
View file

@ -58,13 +58,13 @@ export const appearanceMenu = (protyle: IProtyle, nodeElements?: Element[]) => {
let lastColorHTML = "";
const lastFonts = window.siyuan.storage[Constants.LOCAL_FONTSTYLES];
if (lastFonts.length > 0) {
lastColorHTML = `<div class="fn__flex">
lastColorHTML = `<div data-id="lastUsed" class="fn__flex">
${window.siyuan.languages.lastUsed}
<span class="fn__space"></span>
<kbd class="fn__kbd fn__flex-center${window.siyuan.config.keymap.editor.insert.lastUsed.custom ? "" : " fn__none"}">${updateHotkeyTip(window.siyuan.config.keymap.editor.insert.lastUsed.custom)}</kbd>
</div>
<div class="fn__hr--small"></div>
<div class="fn__flex fn__flex-wrap" style="align-items: center">`;
<div data-id="lastUsedWrap" class="fn__flex fn__flex-wrap" style="align-items: center">`;
lastFonts.forEach((item: string) => {
const lastFontStatus = item.split(Constants.ZWSP);
switch (lastFontStatus[0]) {
@ -110,9 +110,9 @@ export const appearanceMenu = (protyle: IProtyle, nodeElements?: Element[]) => {
}
element.innerHTML = `${lastColorHTML}
<div class="fn__hr"></div>
<div>${window.siyuan.languages.color}</div>
<div data-id="color">${window.siyuan.languages.color}</div>
<div class="fn__hr--small"></div>
<div class="fn__flex fn__flex-wrap">
<div data-id="colorWrap" class="fn__flex fn__flex-wrap">
<button class="color__square ariaLabel" data-position="3south" data-type="style1" aria-label="${window.siyuan.languages.default}">A</button>
<button class="color__square" data-type="style1" style="color: var(--b3-card-error-color);background-color: var(--b3-card-error-background);">A</button>
<button class="color__square" data-type="style1" style="color: var(--b3-card-warning-color);background-color: var(--b3-card-warning-background);">A</button>
@ -120,26 +120,26 @@ export const appearanceMenu = (protyle: IProtyle, nodeElements?: Element[]) => {
<button class="color__square" data-type="style1" style="color: var(--b3-card-success-color);background-color: var(--b3-card-success-background);">A</button>
</div>
<div class="fn__hr"></div>
<div>${window.siyuan.languages.colorFont}</div>
<div data-id="colorFont">${window.siyuan.languages.colorFont}</div>
<div class="fn__hr--small"></div>
<div class="fn__flex fn__flex-wrap">
<div data-id="colorFontWrap" class="fn__flex fn__flex-wrap">
${colorHTML}
</div>
<div class="fn__hr"></div>
<div>${window.siyuan.languages.colorPrimary}</div>
<div data-id="colorPrimary">${window.siyuan.languages.colorPrimary}</div>
<div class="fn__hr--small"></div>
<div class="fn__flex fn__flex-wrap">
<div data-id="colorPrimaryWrap" class="fn__flex fn__flex-wrap">
${bgHTML}
</div>
<div class="fn__hr"></div>
<div>${window.siyuan.languages.fontStyle}</div>
<div data-id="fontStyle">${window.siyuan.languages.fontStyle}</div>
<div class="fn__hr--small"></div>
<div class="fn__flex">
<div data-id="fontStyleWrap" class="fn__flex">
<button data-type="style2" class="protyle-font__style" style="-webkit-text-stroke: 0.2px var(--b3-theme-on-background);-webkit-text-fill-color : transparent;">${window.siyuan.languages.hollow}</button>
<button data-type="style4" class="protyle-font__style" style="text-shadow: 1px 1px var(--b3-theme-surface-lighter), 2px 2px var(--b3-theme-surface-lighter), 3px 3px var(--b3-theme-surface-lighter), 4px 4px var(--b3-theme-surface-lighter)">${window.siyuan.languages.shadow}</button>
</div>
<div class="fn__hr${disableFont ? " fn__none" : ""}"></div>
<div class="fn__flex${disableFont ? " fn__none" : ""}">
<div data-id="fontSize" class="fn__flex${disableFont ? " fn__none" : ""}">
${window.siyuan.languages.fontSize}
<span class="fn__flex-1"></span>
<label class="fn__flex">
@ -149,7 +149,7 @@ export const appearanceMenu = (protyle: IProtyle, nodeElements?: Element[]) => {
<span class="fn__space--small"></span>
</label>
</div>
<div class="${disableFont ? " fn__none" : ""}">
<div data-id="fontSizeWrap" class="${disableFont ? " fn__none" : ""}">
<div class="fn__hr"></div>
<div class="b3-tooltips b3-tooltips__n fn__flex${fontSize.endsWith("em") ? " fn__none" : ""}" aria-label="${fontSize}">
<input class="b3-slider fn__block" id="fontSizePX" max="72" min="9" step="1" type="range" value="${parseInt(fontSize)}">
@ -159,7 +159,7 @@ export const appearanceMenu = (protyle: IProtyle, nodeElements?: Element[]) => {
</div>
</div>
<div class="fn__hr--b"></div>
<div class="fn__flex">
<div data-id="clearFontStyle" class="fn__flex">
<div class="fn__space--small"></div>
<button class="b3-button b3-button--remove fn__block" data-type="clear">
<svg><use xlink:href="#iconTrashcan"></use></svg>${window.siyuan.languages.clearFontStyle}