🎨 aria label

This commit is contained in:
Vanessa 2023-09-09 17:00:51 +08:00
parent 658e68d752
commit b0653df37c
9 changed files with 24 additions and 8 deletions

View file

@ -1,5 +1,8 @@
document.body.insertAdjacentHTML('afterbegin', `<svg style="position: absolute; width: 0; height: 0; overflow: hidden;" xmlns="http://www.w3.org/2000/svg"> document.body.insertAdjacentHTML('afterbegin', `<svg style="position: absolute; width: 0; height: 0; overflow: hidden;" xmlns="http://www.w3.org/2000/svg">
<defs> <defs>
<symbol id="iconAttr" viewBox="0 0 32 32">
<path d="M4.75 31q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM19.75 31q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM12.25 23.5q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM27.25 23.5q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM4.75 16q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM19.75 16q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM12.25 8.5q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM27.25 8.5q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102z"></path>
</symbol>
<symbol id="iconPaste" viewBox="0 0 32 32"> <symbol id="iconPaste" viewBox="0 0 32 32">
<path d="M26.714 2.607h-3.616v-1.339c0-0.147-0.12-0.268-0.268-0.268h-1.875c-0.147 0-0.268 0.121-0.268 0.268v1.339h-5.089v-1.339c0-0.147-0.12-0.268-0.268-0.268h-1.875c-0.147 0-0.268 0.121-0.268 0.268v1.339h-3.616c-0.593 0-1.071 0.479-1.071 1.071v4.018h-3.214c-0.593 0-1.071 0.479-1.071 1.071v21.161c0 0.593 0.479 1.071 1.071 1.071h17.143c0.593 0 1.071-0.479 1.071-1.071v-3.214h3.214c0.593 0 1.071-0.479 1.071-1.071v-21.964c0-0.593-0.479-1.071-1.071-1.071zM21.089 28.589h-14.464v-18.482h7.299v5.826c0 0.74 0.599 1.339 1.339 1.339h5.826v11.317zM21.089 15.13h-5.022v-5.022h0.007l5.016 5.016v0.007zM25.375 24.304h-1.875v-10.179l-6.429-6.429h-6.161v-2.679h2.277v1.071c0 0.147 0.12 0.268 0.268 0.268h1.875c0.147 0 0.268-0.12 0.268-0.268v-1.071h5.089v1.071c0 0.147 0.12 0.268 0.268 0.268h1.875c0.147 0 0.268-0.12 0.268-0.268v-1.071h2.277v19.286z"></path> <path d="M26.714 2.607h-3.616v-1.339c0-0.147-0.12-0.268-0.268-0.268h-1.875c-0.147 0-0.268 0.121-0.268 0.268v1.339h-5.089v-1.339c0-0.147-0.12-0.268-0.268-0.268h-1.875c-0.147 0-0.268 0.121-0.268 0.268v1.339h-3.616c-0.593 0-1.071 0.479-1.071 1.071v4.018h-3.214c-0.593 0-1.071 0.479-1.071 1.071v21.161c0 0.593 0.479 1.071 1.071 1.071h17.143c0.593 0 1.071-0.479 1.071-1.071v-3.214h3.214c0.593 0 1.071-0.479 1.071-1.071v-21.964c0-0.593-0.479-1.071-1.071-1.071zM21.089 28.589h-14.464v-18.482h7.299v5.826c0 0.74 0.599 1.339 1.339 1.339h5.826v11.317zM21.089 15.13h-5.022v-5.022h0.007l5.016 5.016v0.007zM25.375 24.304h-1.875v-10.179l-6.429-6.429h-6.161v-2.679h2.277v1.071c0 0.147 0.12 0.268 0.268 0.268h1.875c0.147 0 0.268-0.12 0.268-0.268v-1.071h5.089v1.071c0 0.147 0.12 0.268 0.268 0.268h1.875c0.147 0 0.268-0.12 0.268-0.268v-1.071h2.277v19.286z"></path>
</symbol> </symbol>

View file

@ -28,6 +28,12 @@
<body> <body>
<h2>SiYuan</h2> <h2>SiYuan</h2>
<div class="fn__clear"> <div class="fn__clear">
<div>
<svg>
<use xlink:href="#iconAttr"></use>
</svg>
iconAttr
</div>
<div> <div>
<svg> <svg>
<use xlink:href="#iconPaste"></use> <use xlink:href="#iconPaste"></use>

View file

@ -1,5 +1,8 @@
document.body.insertAdjacentHTML('afterbegin', `<svg style="position: absolute; width: 0; height: 0; overflow: hidden;" xmlns="http://www.w3.org/2000/svg"> document.body.insertAdjacentHTML('afterbegin', `<svg style="position: absolute; width: 0; height: 0; overflow: hidden;" xmlns="http://www.w3.org/2000/svg">
<defs> <defs>
<symbol id="iconAttr" viewBox="0 0 32 32">
<path d="M4.75 31q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM19.75 31q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM12.25 23.5q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM27.25 23.5q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM4.75 16q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM19.75 16q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM12.25 8.5q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102zM27.25 8.5q-1.547 0-2.648-1.102t-1.102-2.648 1.102-2.648 2.648-1.102 2.648 1.102 1.102 2.648-1.102 2.648-2.648 1.102z"></path>
</symbol>
<symbol id="iconPaste" viewBox="0 0 32 32"> <symbol id="iconPaste" viewBox="0 0 32 32">
<path d="M25.545 3.727h-5.7c-0.573-1.582-2.073-2.727-3.845-2.727s-3.273 1.145-3.845 2.727h-5.7c-1.5 0-2.727 1.227-2.727 2.727v21.818c0 1.5 1.227 2.727 2.727 2.727h19.091c1.5 0 2.727-1.227 2.727-2.727v-21.818c0-1.5-1.227-2.727-2.727-2.727zM16 3.727c0.75 0 1.364 0.614 1.364 1.364s-0.614 1.364-1.364 1.364-1.364-0.614-1.364-1.364 0.614-1.364 1.364-1.364zM25.545 28.273h-19.091v-21.818h2.727v4.091h13.636v-4.091h2.727v21.818z"></path> <path d="M25.545 3.727h-5.7c-0.573-1.582-2.073-2.727-3.845-2.727s-3.273 1.145-3.845 2.727h-5.7c-1.5 0-2.727 1.227-2.727 2.727v21.818c0 1.5 1.227 2.727 2.727 2.727h19.091c1.5 0 2.727-1.227 2.727-2.727v-21.818c0-1.5-1.227-2.727-2.727-2.727zM16 3.727c0.75 0 1.364 0.614 1.364 1.364s-0.614 1.364-1.364 1.364-1.364-0.614-1.364-1.364 0.614-1.364 1.364-1.364zM25.545 28.273h-19.091v-21.818h2.727v4.091h13.636v-4.091h2.727v21.818z"></path>
</symbol> </symbol>

View file

@ -61,9 +61,9 @@ export class Wnd {
<ul class="fn__flex layout-tab-bar"></ul> <ul class="fn__flex layout-tab-bar"></ul>
<ul class="layout-tab-bar layout-tab-bar--readonly fn__flex-1"> <ul class="layout-tab-bar layout-tab-bar--readonly fn__flex-1">
<li class="item item--readonly"> <li class="item item--readonly">
<span data-type="new" class="block__icon block__icon--show" title="${window.siyuan.languages.newFile}"><svg><use xlink:href="#iconAdd"></use></svg></span> <span data-type="new" class="block__icon block__icon--show ariaLabel" aria-label="${window.siyuan.languages.newFile}"><svg><use xlink:href="#iconAdd"></use></svg></span>
<span class="fn__flex-1"></span> <span class="fn__flex-1"></span>
<span data-type="more" data-menu="true" class="block__icon block__icon--show" title="${window.siyuan.languages.more}"><svg><use xlink:href="#iconDown"></use></svg></span> <span data-type="more" data-menu="true" class="block__icon block__icon--show ariaLabel" aria-label="${window.siyuan.languages.switchTab}"><svg><use xlink:href="#iconDown"></use></svg></span>
</li> </li>
</ul> </ul>
</div> </div>

View file

@ -361,6 +361,7 @@ export const initFileMenu = (app: App, notebookId: string, pathString: string, l
})); }));
window.siyuan.menus.menu.append(new MenuItem({ window.siyuan.menus.menu.append(new MenuItem({
label: window.siyuan.languages.attr, label: window.siyuan.languages.attr,
icon: "iconAttr",
click() { click() {
fetchPost("/api/block/getDocInfo", { fetchPost("/api/block/getDocInfo", {
id id

View file

@ -46,12 +46,12 @@ export class Breadcrumb {
'<div class="protyle-breadcrumb__bar"></div>'} '<div class="protyle-breadcrumb__bar"></div>'}
<span class="protyle-breadcrumb__space"></span> <span class="protyle-breadcrumb__space"></span>
<button class="protyle-breadcrumb__icon fn__none" data-type="exit-focus">${window.siyuan.languages.exitFocus}</button> <button class="protyle-breadcrumb__icon fn__none" data-type="exit-focus">${window.siyuan.languages.exitFocus}</button>
<button class="block__icon block__icon--show fn__flex-center" data-type="readonly"><svg><use xlink:href="#iconUnlock"></use></svg></button> <button class="block__icon block__icon--show fn__flex-center ariaLabel" aria-label="${window.siyuan.languages.editReadonly}" data-type="readonly"><svg><use xlink:href="#iconUnlock"></use></svg></button>
<span class="fn__space"></span> <span class="fn__space"></span>
<button class="block__icon block__icon--show fn__flex-center" data-type="a" data-position="right" aria-label="${window.siyuan.languages.gutterTip2}"><svg><use xlink:href="#iconFile"></use></svg></button> <button class="block__icon block__icon--show fn__flex-center ariaLabel" data-type="doc" aria-label="${window.siyuan.languages.gutterTip2}"><svg><use xlink:href="#iconFile"></use></svg></button>
<span class="fn__space"></span> <span class="fn__space"></span>
<button class="block__icon block__icon--show fn__flex-center" data-type="more"><svg><use xlink:href="#iconMore"></use></svg></button> <button class="block__icon block__icon--show fn__flex-center ariaLabel" data-type="more" aria-label="${window.siyuan.languages.more}"><svg><use xlink:href="#iconMore"></use></svg></button>
<button class="block__icon block__icon--show fn__flex-center fn__none" style="margin-left: 8px" data-type="context" aria-label="${window.siyuan.languages.context}"><svg><use xlink:href="#iconAlignCenter"></use></svg></button>`; <button class="block__icon block__icon--show fn__flex-center fn__none ariaLabel" style="margin-left: 8px" data-type="context" aria-label="${window.siyuan.languages.context}"><svg><use xlink:href="#iconAlignCenter"></use></svg></button>`;
this.element = element.firstElementChild as HTMLElement; this.element = element.firstElementChild as HTMLElement;
element.addEventListener("click", (event) => { element.addEventListener("click", (event) => {
@ -83,7 +83,7 @@ export class Breadcrumb {
event.preventDefault(); event.preventDefault();
event.stopPropagation(); event.stopPropagation();
break; break;
} else if (type === "a") { } else if (type === "doc") {
if (window.siyuan.shiftIsPressed) { if (window.siyuan.shiftIsPressed) {
fetchPost("/api/block/getDocInfo", { fetchPost("/api/block/getDocInfo", {
id: protyle.block.rootID id: protyle.block.rootID
@ -475,6 +475,7 @@ export class Breadcrumb {
const isCustomFullWidth = protyle.wysiwyg.element.getAttribute(Constants.CUSTOM_SY_FULLWIDTH); const isCustomFullWidth = protyle.wysiwyg.element.getAttribute(Constants.CUSTOM_SY_FULLWIDTH);
window.siyuan.menus.menu.append(new MenuItem({ window.siyuan.menus.menu.append(new MenuItem({
label: window.siyuan.languages.fullWidth, label: window.siyuan.languages.fullWidth,
icon: "iconDock",
type: "submenu", type: "submenu",
submenu: [{ submenu: [{
iconHTML: "", iconHTML: "",

View file

@ -1475,6 +1475,7 @@ export class Gutter {
if (!protyle.disabled) { if (!protyle.disabled) {
window.siyuan.menus.menu.append(new MenuItem({ window.siyuan.menus.menu.append(new MenuItem({
label: window.siyuan.languages.attr, label: window.siyuan.languages.attr,
icon: "iconAttr",
accelerator: window.siyuan.config.keymap.editor.general.attr.custom + "/" + updateHotkeyTip("⇧Click"), accelerator: window.siyuan.config.keymap.editor.general.attr.custom + "/" + updateHotkeyTip("⇧Click"),
click() { click() {
openAttr(nodeElement); openAttr(nodeElement);

View file

@ -53,6 +53,7 @@ export const openTitleMenu = (protyle: IProtyle, position: {
} }
window.siyuan.menus.menu.append(new MenuItem({ window.siyuan.menus.menu.append(new MenuItem({
label: window.siyuan.languages.attr, label: window.siyuan.languages.attr,
icon: "iconAttr",
accelerator: window.siyuan.config.keymap.editor.general.attr.custom + "/" + updateHotkeyTip("⇧Click"), accelerator: window.siyuan.config.keymap.editor.general.attr.custom + "/" + updateHotkeyTip("⇧Click"),
click() { click() {
openFileAttr(response.data.ial); openFileAttr(response.data.ial);

View file

@ -254,7 +254,7 @@ export const avContextmenu = (protyle: IProtyle, event: MouseEvent & { detail: a
}); });
}); });
menu.addItem({ menu.addItem({
icon: "iconList", icon: "iconAttr",
label: window.siyuan.languages.attr, label: window.siyuan.languages.attr,
type: "submenu", type: "submenu",
submenu: editAttrSubmenu submenu: editAttrSubmenu