diff --git a/app/src/assets/scss/business/_layout.scss b/app/src/assets/scss/business/_layout.scss index 925afd1a6..90bc23386 100644 --- a/app/src/assets/scss/business/_layout.scss +++ b/app/src/assets/scss/business/_layout.scss @@ -233,17 +233,14 @@ &:hover, &.item--focus { .item__close svg { - opacity: 1; + opacity: .68; } } &--readonly { padding-left: 13px; + padding-right: 8px; max-width: none; - - .item__close svg { - opacity: 1; - } } &--pin { @@ -320,18 +317,15 @@ align-items: center; svg { - border-radius: 10px; - height: 8px; - width: 8px; + height: 16px; + width: 16px; color: var(--b3-theme-on-surface); transition: var(--b3-transition); - padding: 4px; opacity: 0; } &:hover svg { - color: var(--b3-theme-on-background); - background-color: var(--b3-theme-background-light); + opacity: 1 !important; } } } diff --git a/app/src/assets/scss/component/_chip.scss b/app/src/assets/scss/component/_chip.scss index d92bafba8..bbb5a63d6 100644 --- a/app/src/assets/scss/component/_chip.scss +++ b/app/src/assets/scss/component/_chip.scss @@ -87,7 +87,7 @@ a.b3-chip:hover { width: 16px; transition: var(--b3-transition); cursor: pointer; - opacity: .38; + opacity: .68; &:hover { opacity: 1; diff --git a/app/src/assets/scss/component/_dialog.scss b/app/src/assets/scss/component/_dialog.scss index 73a4167ef..c3b24451a 100644 --- a/app/src/assets/scss/component/_dialog.scss +++ b/app/src/assets/scss/component/_dialog.scss @@ -79,7 +79,13 @@ cursor: pointer; top: 10px; right: -32px; - height: 16px; - width: 16px; + height: 18px; + width: 18px; + opacity: .68; + color: var(--b3-theme-on-surface); + + &:hover { + opacity: 1; + } } } diff --git a/app/src/assets/scss/component/_menu.scss b/app/src/assets/scss/component/_menu.scss index c5c2c751b..32d1df8c1 100644 --- a/app/src/assets/scss/component/_menu.scss +++ b/app/src/assets/scss/component/_menu.scss @@ -193,7 +193,7 @@ background-color: var(--b3-list-hover); & > .b3-menu__action { - opacity: 1; + opacity: .68; } } @@ -215,17 +215,14 @@ &__action { opacity: 0; - color: var(--b3-theme-on-surface); - width: 8px; - height: 8px; + width: 16px; + height: 16px; align-self: center; margin-left: 8px; - padding: 4px; - border-radius: 8px; + color: var(--b3-theme-on-surface); &:hover { - color: var(--b3-theme-on-background); - background: var(--b3-theme-background-light); + opacity: 1; } } diff --git a/app/src/assets/scss/mobile.scss b/app/src/assets/scss/mobile.scss index b8c3c2cf0..bd0b7a75f 100644 --- a/app/src/assets/scss/mobile.scss +++ b/app/src/assets/scss/mobile.scss @@ -80,12 +80,6 @@ margin: 6px 4px; color: var(--b3-theme-on-surface); - &--small { - height: 14px; - width: 14px; - padding: 11px 8px; - } - &[disabled] { opacity: 0.38; } diff --git a/app/src/assets/template/mobile/index.tpl b/app/src/assets/template/mobile/index.tpl index c321e127d..3c9cd5f37 100644 --- a/app/src/assets/template/mobile/index.tpl +++ b/app/src/assets/template/mobile/index.tpl @@ -48,10 +48,10 @@
- + - - + +
diff --git a/app/src/dialog/index.ts b/app/src/dialog/index.ts index e18f2c3a9..c8566ef67 100644 --- a/app/src/dialog/index.ts +++ b/app/src/dialog/index.ts @@ -25,7 +25,7 @@ export class Dialog { this.element.innerHTML = `
- +
${options.title || ""}
${options.content}
`; diff --git a/app/src/layout/Tab.ts b/app/src/layout/Tab.ts index 66b1baf6c..dd544f5fc 100644 --- a/app/src/layout/Tab.ts +++ b/app/src/layout/Tab.ts @@ -45,7 +45,7 @@ export class Tab { iconHTML = `${unicode2Emoji(options.docIcon)}`; } this.headElement.innerHTML = `${iconHTML}${escapeHtml(options.title)} -`; +`; this.headElement.addEventListener("mouseenter", (event) => { event.stopPropagation(); event.preventDefault(); diff --git a/app/src/layout/Wnd.ts b/app/src/layout/Wnd.ts index b0d7ad385..fa7342245 100644 --- a/app/src/layout/Wnd.ts +++ b/app/src/layout/Wnd.ts @@ -55,9 +55,9 @@ export class Wnd {
@@ -93,11 +93,11 @@ export class Wnd { this.headersElement.parentElement.addEventListener("click", (event) => { let target = event.target as HTMLElement; while (target && !target.isEqualNode(this.headersElement)) { - if (target.classList.contains("item__close") && target.getAttribute("data-type") === "new") { + if (target.classList.contains("block__icon") && target.getAttribute("data-type") === "new") { setPanelFocus(this.headersElement.parentElement.parentElement); newFile(undefined, undefined, undefined, true); break; - } else if (target.classList.contains("item__close") && target.getAttribute("data-type") === "more") { + } else if (target.classList.contains("block__icon") && target.getAttribute("data-type") === "more") { this.renderTabList(event); break; } else if (target.tagName === "LI" && target.getAttribute("data-id") && !pdfIsLoading(this.element)) { @@ -560,12 +560,12 @@ export class Wnd { const graphicElement = item.querySelector(".item__graphic"); window.siyuan.menus.menu.append(new MenuItem({ label: escapeHtml(item.querySelector(".item__text").textContent), - action: "iconClose", + action: "iconCloseRound", iconHTML: iconElement ? `${iconElement.innerHTML}` : "", icon: graphicElement ? graphicElement.firstElementChild.getAttribute("xlink:href").substring(1) : "", bind: (element) => { element.addEventListener("click", (event) => { - if (hasClosestByTag(event.target as Element, "svg")) { + if (hasClosestByClassName(event.target as Element, "b3-menu__action")) { this.removeTab(item.getAttribute("data-id")); if (element.previousElementSibling || element.nextElementSibling) { element.remove(); diff --git a/app/src/menus/workspace.ts b/app/src/menus/workspace.ts index cacc90e22..b76c82327 100644 --- a/app/src/menus/workspace.ts +++ b/app/src/menus/workspace.ts @@ -152,14 +152,11 @@ export const workspaceMenu = (rect: DOMRect) => { window.siyuan.storage[Constants.LOCAL_LAYOUTS].forEach((item: ISaveLayout) => { layoutSubMenu.push({ iconHTML: Constants.ZWSP, - label: `
- ${item.name} - - -
`, + action:"iconCloseRound", + label: item.name, bind(menuElement) { menuElement.addEventListener("click", (event) => { - if (hasClosestByClassName(event.target as HTMLElement, "fn__a")) { + if (hasClosestByClassName(event.target as Element, "b3-menu__action")) { event.preventDefault(); event.stopPropagation(); window.siyuan.storage[Constants.LOCAL_LAYOUTS].find((layoutItem: ISaveLayout, index: number) => { @@ -316,22 +313,26 @@ const workspaceItem = (item: IWorkspace) => { iconHTML: Constants.ZWSP, type: "submenu", submenu: [{ + iconHTML: Constants.ZWSP, label: window.siyuan.languages.openBy, click() { openWorkspace(item.path); } }, { + iconHTML: Constants.ZWSP, label: window.siyuan.languages.showInFolder, click() { shell.showItemInFolder(item.path); } }, { + iconHTML: Constants.ZWSP, label: window.siyuan.languages.copyPath, click() { writeText(item.path); showMessage(window.siyuan.languages.copied); } }, { + iconHTML: Constants.ZWSP, label: window.siyuan.languages.removeWorkspaceTip, click() { fetchPost("/api/system/removeWorkspaceDir", {path: item.path});