为桌面端窗口标题栏添加应用图标 (#7032)

* 🎨 为桌面端窗口标题栏添加应用图标

* 🎨 为桌面端窗口标题栏添加应用图标

* 🎨 使用 `getElementById` 替代 `querySelector`
This commit is contained in:
颖逸 2023-01-12 11:35:34 +08:00 committed by GitHub
parent db523f5b7e
commit 88fd082df4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 22 additions and 4 deletions

View file

@ -55,7 +55,7 @@ body {
-webkit-font-smoothing: auto;
.toolbar {
padding: 0 0 0 5px;
padding: 0;
}
.fullscreen {

View file

@ -182,6 +182,13 @@ progressLoading: 400
padding-left: 0;
}
#windowAppIcon {
-webkit-app-region: drag;
width: 42px;
margin-left: 1px;
justify-content: center;
}
#windowControls {
top: 0;
z-index: 502;

View file

@ -179,7 +179,8 @@ export const onGetConfig = (isStart: boolean) => {
};
const initBar = () => {
document.querySelector(".toolbar").innerHTML = `
const toolbar = document.getElementById("toolbar");
toolbar.innerHTML = `
<div id="barWorkspace" class="toolbar__item">
<span class="toolbar__text">${getWorkspaceName()}</span>
<svg class="toolbar__svg"><use xlink:href="#iconDown"></use></svg>
@ -208,7 +209,7 @@ const initBar = () => {
<svg><use xlink:href="#icon${window.siyuan.config.appearance.modeOS ? "Mode" : (window.siyuan.config.appearance.mode === 0 ? "Light" : "Dark")}"></use></svg>
</div>
<div class="fn__flex" id="windowControls"></div>`;
document.querySelector(".toolbar").addEventListener("click", (event: MouseEvent) => {
toolbar.addEventListener("click", (event: MouseEvent) => {
let target = event.target as HTMLElement;
while (!target.classList.contains("toolbar")) {
if (target.id === "barBack") {
@ -463,8 +464,18 @@ const initWindow = () => {
}
return;
}
const controlsElement = document.querySelector("#windowControls");
document.body.classList.add("body--win32");
//添加应用图标
const toolbar = document.getElementById("toolbar");
toolbar.insertAdjacentHTML("afterbegin", `<div class="toolbar__item" id="windowAppIcon">
<svg>
<use xlink:href="#iconSiYuan"></use>
</svg>
</div>`);
//添加窗口控件
const controlsElement = document.getElementById("windowControls");
controlsElement.innerHTML = `<div class="toolbar__item b3-tooltips b3-tooltips__sw" aria-label="${window.siyuan.languages.min}" id="minWindow">
<svg>
<use xlink:href="#iconMin"></use>