Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-22 17:40:13 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

💄 https://github.com/siyuan-note/siyuan/issues/7520

Browse source
This commit is contained in:
Vanessa 2023-03-17 11:35:08 +08:00
parent db987d36e8
commit b8ea5d582a
11 changed files with 125 additions and 118 deletions
Download patch file Download diff file Expand all files Collapse all files

2
app/src/assets/scss/base.scss
View file

@ -59,7 +59,7 @@ ctrl+p 搜索: 202
.keyboard: 222 .keyboard: 222
// 需小于 .b3-dialog 关于中的锁屏密码设置 // 需小于 .b3-dialog 关于中的锁屏密码设置
.side-panel: 220 #menu & .side-panel: 220
// 需小于 #windowControls // 需小于 #windowControls
// 需大于 .protyle-util https://github.com/siyuan-note/siyuan/issues/5069 // 需大于 .protyle-util https://github.com/siyuan-note/siyuan/issues/5069

13
app/src/assets/scss/component/_menu.scss
View file

@ -27,7 +27,7 @@
} }
&--fullscreen { &--fullscreen {
top: 35px; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
border: 0; border: 0;
@ -36,6 +36,7 @@
right: 0; right: 0;
max-height: none; max-height: none;
padding: 0; padding: 0;
border-radius: 0;
.b3-menu { .b3-menu {
&__submenu { &__submenu {
@ -57,6 +58,7 @@
border-bottom: .5px solid var(--b3-theme-background-light); border-bottom: .5px solid var(--b3-theme-background-light);
line-height: 42px; line-height: 42px;
background-color: var(--b3-theme-background); background-color: var(--b3-theme-background);
text-decoration: none;
&:last-child { &:last-child {
margin-bottom: 24px; margin-bottom: 24px;
@ -84,6 +86,9 @@
padding: 0 8px; padding: 0 8px;
display: flex; display: flex;
background-color: var(--b3-theme-background); background-color: var(--b3-theme-background);
position: sticky;
top: 0;
z-index: 1;
} }
&__separator { &__separator {
@ -101,6 +106,7 @@
height: 17px; height: 17px;
width: 17px; width: 17px;
margin: 0 16px 0 8px; margin: 0 16px 0 8px;
border-radius: 4px;
&--arrow { &--arrow {
width: 12px; width: 12px;
@ -160,8 +166,9 @@
align-content: flex-start; align-content: flex-start;
.b3-menu__item { .b3-menu__item {
min-width: auto; width: auto;
margin-top: 7px; height: 32px;
padding: 8px;
} }
.b3-menu__label { .b3-menu__label {

38
app/src/assets/scss/mobile.scss
View file

@ -102,6 +102,7 @@
box-shadow: none; box-shadow: none;
min-width: 1px; min-width: 1px;
line-height: 30px; line-height: 30px;
font-size: 17px;
&:focus, &:focus,
&:hover { &:hover {
@ -121,42 +122,22 @@
.side-panel { .side-panel {
top: 0; top: 0;
left: auto; left: -110vw;
right: -100vw; right: auto;
position: fixed; position: fixed;
background-color: var(--b3-theme-surface); background-color: var(--b3-theme-surface);
height: 100vh; height: 100vh;
width: 80vw; width: 100vw;
z-index: 220; z-index: 220;
transition: top .15s cubic-bezier(0, 0, .2, 1) 0ms, left .15s cubic-bezier(0, 0, .2, 1) 0ms, right .15s cubic-bezier(0, 0, .2, 1) 0ms; transition: top .15s cubic-bezier(0, 0, .2, 1) 0ms, left .15s cubic-bezier(0, 0, .2, 1) 0ms;
&--left {
left: -100vw;
right: auto;
}
&--all { &--all {
width: 100vw; left: 0;
right: 0; right: 0;
top: -200vh; top: -200vh;
} }
} }
.scrim {
background-color: rgba(0, 0, 0, 0.32);
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 1;
z-index: 4;
transition: opacity 150ms linear;
animation-duration: 1s;
animation-fill-mode: both;
animation-name: fadeIn;
}
#model { #model {
.config-about__logo { .config-about__logo {
display: flex; display: flex;
@ -224,8 +205,11 @@
} }
} }
#menu img.b3-list-item__graphic { #menu {
border-radius: 4px; transition: right 0.15s cubic-bezier(0, 0, 0.2, 1) 0ms;
z-index: 220;
right: -110vw;
left: auto;
} }
.keyboard { .keyboard {

7
app/src/assets/template/mobile/index.tpl
View file

@ -27,14 +27,15 @@
</div> </div>
<div id="editor" class="fn__none fn__flex-1"></div> <div id="editor" class="fn__none fn__flex-1"></div>
<div id="empty"></div> <div id="empty"></div>
<div class="scrim fn__none"></div> <div id="sidebar" class="side-panel fn__flex-column">
<div id="sidebar" class="side-panel side-panel--left fn__flex-column">
<div class="toolbar toolbar--border toolbar--dark"> <div class="toolbar toolbar--border toolbar--dark">
<svg data-type="sidebar-file-tab" class="toolbar__icon toolbar__icon--active"><use xlink:href="#iconFiles"></use></svg> <svg data-type="sidebar-file-tab" class="toolbar__icon toolbar__icon--active"><use xlink:href="#iconFiles"></use></svg>
<svg data-type="sidebar-outline-tab" class="toolbar__icon"><use xlink:href="#iconAlignCenter"></use></svg> <svg data-type="sidebar-outline-tab" class="toolbar__icon"><use xlink:href="#iconAlignCenter"></use></svg>
<svg data-type="sidebar-bookmark-tab" class="toolbar__icon"><use xlink:href="#iconBookmark"></use></svg> <svg data-type="sidebar-bookmark-tab" class="toolbar__icon"><use xlink:href="#iconBookmark"></use></svg>
<svg data-type="sidebar-tag-tab" class="toolbar__icon"><use xlink:href="#iconTags"></use></svg> <svg data-type="sidebar-tag-tab" class="toolbar__icon"><use xlink:href="#iconTags"></use></svg>
<svg data-type="sidebar-backlink-tab" class="toolbar__icon"><use xlink:href="#iconLink"></use></svg> <svg data-type="sidebar-backlink-tab" class="toolbar__icon"><use xlink:href="#iconLink"></use></svg>
<span class="fn__flex-1"></span>
<svg class="toolbar__icon"><use xlink:href="#iconRight"></use></svg>
</div> </div>
<div class="fn__flex-1 b3-list--mobile"> <div class="fn__flex-1 b3-list--mobile">
<div class="fn__flex-column" data-type="sidebar-file"></div> <div class="fn__flex-column" data-type="sidebar-file"></div>
@ -44,7 +45,7 @@
<div class="fn__flex-column fn__none" data-type="sidebar-backlink"></div> <div class="fn__flex-column fn__none" data-type="sidebar-backlink"></div>
</div> </div>
</div> </div>
<div id="menu" style="overflow: auto" class="side-panel b3-list b3-list--background fn__flex-column"></div> <div id="menu" class="b3-menu b3-menu--fullscreen"></div>
<div id="model" class="side-panel side-panel--all fn__flex-column"> <div id="model" class="side-panel side-panel--all fn__flex-column">
<div class="toolbar toolbar--border"> <div class="toolbar toolbar--border">
<svg class="toolbar__icon toolbar__icon--small"><use xlink:href="#iconMenu"></use></svg> <svg class="toolbar__icon toolbar__icon--small"><use xlink:href="#iconMenu"></use></svg>

2
app/src/menus/Menu.ts
View file

@ -50,8 +50,6 @@ export class Menu {
itemElement.classList.add("b3-menu__item--show"); itemElement.classList.add("b3-menu__item--show");
if (!this.element.classList.contains("b3-menu--fullscreen")) { if (!this.element.classList.contains("b3-menu--fullscreen")) {
this.showSubMenu(subMenuElement); this.showSubMenu(subMenuElement);
} else {
this.element.scrollTop = 0
} }
}); });
} }

34
app/src/mobile/util/MobileBackFoward.ts
View file

@ -98,6 +98,16 @@ export const pushBack = () => {
}; };
export const goForward = () => { export const goForward = () => {
if (window.siyuan.menus.menu.element.classList.contains("b3-menu--fullscreen") &&
!window.siyuan.menus.menu.element.classList.contains("fn__none")) {
window.siyuan.menus.menu.element.dispatchEvent(new CustomEvent("click", {detail: "back"}));
return;
} else if (document.getElementById("model").style.top === "0px" ||
document.getElementById("menu").style.right === "0px" ||
document.getElementById("sidebar").style.left === "0px") {
closePanel();
return;
}
if (window.JSAndroid && forwardStack.length < 2) { if (window.JSAndroid && forwardStack.length < 2) {
window.JSAndroid.returnDesktop(); window.JSAndroid.returnDesktop();
return; return;
@ -110,17 +120,19 @@ export const goForward = () => {
}; };
export const goBack = () => { export const goBack = () => {
if (window.JSAndroid) { if (window.siyuan.menus.menu.element.classList.contains("b3-menu--fullscreen") &&
if (window.siyuan.menus.menu.element.classList.contains("b3-menu--fullscreen") && !window.siyuan.menus.menu.element.classList.contains("fn__none")) { !window.siyuan.menus.menu.element.classList.contains("fn__none")) {
window.siyuan.menus.menu.element.dispatchEvent(new CustomEvent("click", {detail: "back"})); window.siyuan.menus.menu.element.dispatchEvent(new CustomEvent("click", {detail: "back"}));
return; return;
} else if (document.getElementById("model").style.top === "0px") { } else if (document.getElementById("model").style.top === "0px" ||
closePanel(); document.getElementById("menu").style.right === "0px" ||
return; document.getElementById("sidebar").style.left === "0px") {
} else if (window.siyuan.backStack.length < 1) { closePanel();
window.JSAndroid.returnDesktop(); return;
return; }
} if (window.JSAndroid && window.siyuan.backStack.length < 1) {
window.JSAndroid.returnDesktop();
return;
} }
if (window.siyuan.backStack.length < 1) { if (window.siyuan.backStack.length < 1) {
return; return;

1
app/src/mobile/util/closePanel.ts
View file

@ -2,5 +2,4 @@ export const closePanel = () => {
document.getElementById("menu").style.right = "-100vw"; document.getElementById("menu").style.right = "-100vw";
document.getElementById("sidebar").style.left = "-100vw"; document.getElementById("sidebar").style.left = "-100vw";
document.getElementById("model").style.top = "-200vh"; document.getElementById("model").style.top = "-200vh";
document.querySelector(".scrim").classList.add("fn__none");
}; };

10
app/src/mobile/util/initFramework.ts
View file

@ -23,7 +23,6 @@ export const initFramework = () => {
setInlineStyle(); setInlineStyle();
renderSnippet(); renderSnippet();
initKeyboardToolbar(); initKeyboardToolbar();
const scrimElement = document.querySelector(".scrim");
const sidebarElement = document.getElementById("sidebar"); const sidebarElement = document.getElementById("sidebar");
let outline: MobileOutline; let outline: MobileOutline;
let backlink: MobileBacklinks; let backlink: MobileBacklinks;
@ -37,6 +36,10 @@ export const initFramework = () => {
return; return;
} }
const type = svgElement.getAttribute("data-type"); const type = svgElement.getAttribute("data-type");
if (!type) {
closePanel();
return;
}
sidebarElement.querySelectorAll(".toolbar--border svg").forEach(item => { sidebarElement.querySelectorAll(".toolbar--border svg").forEach(item => {
const itemType = item.getAttribute("data-type"); const itemType = item.getAttribute("data-type");
if (itemType === type) { if (itemType === type) {
@ -78,7 +81,6 @@ export const initFramework = () => {
hideKeyboardToolbar(); hideKeyboardToolbar();
activeBlur(); activeBlur();
sidebarElement.style.left = "0"; sidebarElement.style.left = "0";
document.querySelector(".scrim").classList.remove("fn__none");
const type = sidebarElement.querySelector(".toolbar--border .toolbar__icon--active").getAttribute("data-type"); const type = sidebarElement.querySelector(".toolbar--border .toolbar__icon--active").getAttribute("data-type");
if (type === "sidebar-outline-tab") { if (type === "sidebar-outline-tab") {
outline.update(); outline.update();
@ -123,10 +125,6 @@ export const initFramework = () => {
}, Constants.TIMEOUT_INPUT); }, Constants.TIMEOUT_INPUT);
}, Constants.TIMEOUT_INPUT); }, Constants.TIMEOUT_INPUT);
} }
scrimElement.addEventListener(getEventName(), () => {
closePanel();
});
document.getElementById("modelClose").addEventListener(getEventName(), () => { document.getElementById("modelClose").addEventListener(getEventName(), () => {
closePanel(); closePanel();
}); });

122
app/src/mobile/util/menu.ts
View file

@ -62,7 +62,7 @@ const showAccountInfo = (modelElement: HTMLElement, modelMainElement: Element) =
fetchPost("/api/setting/logoutCloudUser", {}, () => { fetchPost("/api/setting/logoutCloudUser", {}, () => {
window.siyuan.user = null; window.siyuan.user = null;
closePanel(); closePanel();
document.getElementById("menuAccount").innerHTML = `<svg class="b3-list-item__graphic"><use xlink:href="#iconAccount"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.login}</span>`; document.getElementById("menuAccount").innerHTML = `<svg class="b3-menu__icon"><use xlink:href="#iconAccount"></use></svg><span class="b3-menu__label">${window.siyuan.languages.login}</span>`;
processSync(); processSync();
}); });
}); });
@ -71,7 +71,7 @@ const showAccountInfo = (modelElement: HTMLElement, modelMainElement: Element) =
fetchPost("/api/account/deactivate", {}, () => { fetchPost("/api/account/deactivate", {}, () => {
window.siyuan.user = null; window.siyuan.user = null;
closePanel(); closePanel();
document.getElementById("menuAccount").innerHTML = `<svg class="b3-list-item__graphic"><use xlink:href="#iconAccount"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.login}</span>`; document.getElementById("menuAccount").innerHTML = `<svg class="b3-menu__icon"><use xlink:href="#iconAccount"></use></svg><span class="b3-menu__label">${window.siyuan.languages.login}</span>`;
processSync(); processSync();
}); });
}); });
@ -91,9 +91,9 @@ const showAccountInfo = (modelElement: HTMLElement, modelMainElement: Element) =
showAccountInfo(modelElement, modelMainElement); showAccountInfo(modelElement, modelMainElement);
const menuAccountElement = document.getElementById("menuAccount"); const menuAccountElement = document.getElementById("menuAccount");
if (window.siyuan.user) { if (window.siyuan.user) {
menuAccountElement.innerHTML = `<img class="b3-list-item__graphic" src="${window.siyuan.user.userAvatarURL}"/><span class="b3-list-item__text">${window.siyuan.user.userName}</span>`; menuAccountElement.innerHTML = `<img class="b3-menu__icon" src="${window.siyuan.user.userAvatarURL}"/><span class="b3-menu__label">${window.siyuan.user.userName}</span>`;
} else { } else {
menuAccountElement.innerHTML = `<svg class="b3-list-item__graphic"><use xlink:href="#iconAccount"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.login}</span>`; menuAccountElement.innerHTML = `<svg class="b3-menu__icon"><use xlink:href="#iconAccount"></use></svg><span class="b3-menu__label">${window.siyuan.languages.login}</span>`;
} }
processSync(); processSync();
}); });
@ -117,70 +117,85 @@ const genWorkspace = (workspaceDirElement: Element) => {
export const popMenu = () => { export const popMenu = () => {
activeBlur(); activeBlur();
hideKeyboardToolbar(); hideKeyboardToolbar();
const modelElement = document.getElementById("model");
const modelMainElement = document.getElementById("modelMain");
const scrimElement = document.querySelector(".scrim");
const menuElement = document.getElementById("menu"); const menuElement = document.getElementById("menu");
if (menuElement.innerHTML !== "") { if (menuElement.innerHTML !== "") {
menuElement.style.right = "0"; menuElement.style.right = "0";
scrimElement.classList.remove("fn__none");
return; return;
} }
let accountHTML = ""; let accountHTML = "";
if (window.siyuan.user && !window.siyuan.config.readonly) { if (window.siyuan.user && !window.siyuan.config.readonly) {
accountHTML = `<div class="b3-list-item b3-list-item--big" id="menuAccount"> accountHTML = `<div class="b3-menu__item" id="menuAccount">
<img class="b3-list-item__graphic" src="${window.siyuan.user.userAvatarURL}"/> <img class="b3-menu__icon" src="${window.siyuan.user.userAvatarURL}"/>
<span class="b3-list-item__text">${window.siyuan.user.userName}</span> <span class="b3-menu__label">${window.siyuan.user.userName}</span>
</div>`; </div>`;
} else if (!window.siyuan.config.readonly) { } else if (!window.siyuan.config.readonly) {
accountHTML = `<div class="b3-list-item b3-list-item--big" id="menuAccount"> accountHTML = `<div class="b3-menu__item" id="menuAccount">
<svg class="b3-list-item__graphic"><use xlink:href="#iconAccount"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.login}</span> <svg class="b3-menu__icon"><use xlink:href="#iconAccount"></use></svg><span class="b3-menu__label">${window.siyuan.languages.login}</span>
</div>`; </div>`;
} }
menuElement.innerHTML = `<div id="menuSearch" class="b3-list-item b3-list-item--big"> menuElement.innerHTML = `<div class="b3-menu__title">
<svg class="b3-list-item__graphic"><use xlink:href="#iconSearch"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.search}</span> <svg class="b3-menu__icon"><use xlink:href="#iconLeft"></use></svg>
</div> <span class="b3-menu__label">${window.siyuan.languages.back}</span>
<div id="menuNewDaily" class="b3-list-item b3-list-item--big${window.siyuan.config.readonly ? " fn__none" : ""}">
<svg class="b3-list-item__graphic"><use xlink:href="#iconCalendar"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.dailyNote}</span>
</div>
<div id="menuCard" class="b3-list-item b3-list-item--big${window.siyuan.config.readonly ? " fn__none" : ""}">
<svg class="b3-list-item__graphic" style="color: var(--b3-theme-secondary)"><use xlink:href="#iconRiffCard"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.riffCard}</span>
</div>
<div class="b3-list-item b3-list-item--big${window.siyuan.config.readonly ? " fn__none" : ""}" id="menuNewNotebook">
<svg class="b3-list-item__graphic"><use xlink:href="#iconFilesRoot"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.newNotebook}</span>
</div>
<div class="b3-list-item b3-list-item--big${window.siyuan.config.readonly ? " fn__none" : ""}" id="menuSyncNow">
<svg class="b3-list-item__graphic"><use xlink:href="#iconCloudSucc"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.syncNow}</span>
</div>
<div class="b3-list-item b3-list-item--big${window.siyuan.config.readonly ? " fn__none" : ""}" id="menuHistory">
<svg class="b3-list-item__graphic"><use xlink:href="#iconHistory"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.dataHistory}</span>
</div>
<div class="b3-list-item b3-list-item--big${window.siyuan.config.readonly ? " fn__none" : ""}" id="menuAppearance">
<svg class="b3-list-item__graphic"><use xlink:href="#iconTheme"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.appearance}</span>
</div>
<div class="b3-list-item b3-list-item--big${window.siyuan.config.readonly ? " fn__none" : ""}" id="menuLock">
<svg class="b3-list-item__graphic"><use xlink:href="#iconLock"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.lockScreen}</span>
</div> </div>
<div class="b3-menu__separator"></div>
${accountHTML} ${accountHTML}
<div id="menuSync" class="b3-list-item b3-list-item--big${window.siyuan.config.readonly ? " fn__none" : ""}"> <div id="menuSearch" class="b3-menu__item">
<svg class="b3-list-item__graphic"><use xlink:href="#iconCloud"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.cloud}</span> <svg class="b3-menu__icon"><use xlink:href="#iconSearch"></use></svg><span class="b3-menu__label">${window.siyuan.languages.search}</span>
</div> </div>
<div class="b3-list-item b3-list-item--big" id="menuHelp"> <div class="b3-menu__item${window.siyuan.config.readonly ? " fn__none" : ""}" id="menuSyncNow">
<svg class="b3-list-item__graphic"><use xlink:href="#iconHelp"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.help}</span> <svg class="b3-menu__icon"><use xlink:href="#iconCloudSucc"></use></svg><span class="b3-menu__label">${window.siyuan.languages.syncNow}</span>
</div> </div>
<div class="b3-list-item b3-list-item--big" id="menuAbout"> <div class="b3-menu__item${window.siyuan.config.readonly ? " fn__none" : ""}" id="menuNewNotebook">
<svg class="b3-list-item__graphic"><use xlink:href="#iconInfo"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.about}</span> <svg class="b3-menu__icon"><use xlink:href="#iconFilesRoot"></use></svg><span class="b3-menu__label">${window.siyuan.languages.newNotebook}</span>
</div> </div>
<div class="b3-list-item b3-list-item--big${(window.webkit?.messageHandlers || window.JSAndroid) ? "" : " fn__none"}" id="menuSafeQuit"> <div class="b3-menu__separator"></div>
<svg class="b3-list-item__graphic"><use xlink:href="#iconQuit"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.safeQuit}</span> <div id="menuNewDaily" class="b3-menu__item${window.siyuan.config.readonly ? " fn__none" : ""}">
<svg class="b3-menu__icon"><use xlink:href="#iconCalendar"></use></svg><span class="b3-menu__label">${window.siyuan.languages.dailyNote}</span>
</div>
<div id="menuCard" class="b3-menu__item${window.siyuan.config.readonly ? " fn__none" : ""}">
<svg class="b3-menu__icon" style="color: var(--b3-theme-secondary)"><use xlink:href="#iconRiffCard"></use></svg><span class="b3-menu__label">${window.siyuan.languages.riffCard}</span>
</div>
<div class="b3-menu__item${window.siyuan.config.readonly ? " fn__none" : ""}" id="menuLock">
<svg class="b3-menu__icon"><use xlink:href="#iconLock"></use></svg><span class="b3-menu__label">${window.siyuan.languages.lockScreen}</span>
</div>
<div class="b3-menu__item${window.siyuan.config.readonly ? " fn__none" : ""}" id="menuHistory">
<svg class="b3-menu__icon"><use xlink:href="#iconHistory"></use></svg><span class="b3-menu__label">${window.siyuan.languages.dataHistory}</span>
</div>
<div class="b3-menu__separator"></div>
<div class="b3-menu__item${window.siyuan.config.readonly ? " fn__none" : ""}" id="menuAppearance">
<svg class="b3-menu__icon"><use xlink:href="#iconTheme"></use></svg><span class="b3-menu__label">${window.siyuan.languages.appearance}</span>
</div>
<div id="menuSync" class="b3-menu__item${window.siyuan.config.readonly ? " fn__none" : ""}">
<svg class="b3-menu__icon"><use xlink:href="#iconCloud"></use></svg><span class="b3-menu__label">${window.siyuan.languages.cloud}</span>
</div>
<div class="b3-menu__item" id="menuAbout">
<svg class="b3-menu__icon"><use xlink:href="#iconInfo"></use></svg><span class="b3-menu__label">${window.siyuan.languages.about}</span>
</div>
<div class="b3-menu__separator"></div>
<div class="b3-menu__item" id="menuHelp">
<svg class="b3-menu__icon"><use xlink:href="#iconHelp"></use></svg><span class="b3-menu__label">${window.siyuan.languages.help}</span>
</div>
<a class="b3-menu__item" href="${"zh_CN" === window.siyuan.config.lang ? "https://ld246.com/article/1649901726096" : "https://github.com/siyuan-note/siyuan/issues"}" target="_blank">
<svg class="b3-menu__icon"><use xlink:href="#iconHeart"></use></svg>
<span class="b3-menu__label">${window.siyuan.languages.feedback}</span>
</a>
<div class="b3-menu__separator${(window.webkit?.messageHandlers || window.JSAndroid) ? "" : " fn__none"}"></div>
<div class="b3-menu__item${(window.webkit?.messageHandlers || window.JSAndroid) ? "" : " fn__none"}" id="menuSafeQuit">
<svg class="b3-menu__icon"><use xlink:href="#iconQuit"></use></svg><span class="b3-menu__label">${window.siyuan.languages.safeQuit}</span>
</div>`; </div>`;
// 只能用 click，否则无法上下滚动 https://github.com/siyuan-note/siyuan/issues/6628 // 只能用 click，否则无法上下滚动 https://github.com/siyuan-note/siyuan/issues/6628
processSync(); processSync();
const modelElement = document.getElementById("model");
const modelMainElement = document.getElementById("modelMain");
menuElement.addEventListener("click", (event) => { menuElement.addEventListener("click", (event) => {
let target = event.target as HTMLElement; let target = event.target as HTMLElement;
while (target && !target.isEqualNode(menuElement)) { while (target && !target.isEqualNode(menuElement)) {
if (target.id === "menuSearch") { if (target.classList.contains("b3-menu__title")) {
closePanel();
event.preventDefault();
event.stopPropagation();
break;
} else if (target.id === "menuSearch") {
popSearch(modelElement, modelMainElement); popSearch(modelElement, modelMainElement);
event.preventDefault(); event.preventDefault();
event.stopPropagation(); event.stopPropagation();
@ -353,8 +368,8 @@ ${accountHTML}
}, response => { }, response => {
window.siyuan.user = response.data; window.siyuan.user = response.data;
closePanel(); closePanel();
document.getElementById("menuAccount").innerHTML = `<img class="b3-list-item__graphic" src="${window.siyuan.user.userAvatarURL}"/> document.getElementById("menuAccount").innerHTML = `<img class="b3-menu__icon" src="${window.siyuan.user.userAvatarURL}"/>
<span class="b3-list-item__text">${window.siyuan.user.userName}</span>`; <span class="b3-menu__label">${window.siyuan.user.userName}</span>`;
processSync(); processSync();
}); });
}); });
@ -370,8 +385,8 @@ ${accountHTML}
}, response => { }, response => {
window.siyuan.user = response.data; window.siyuan.user = response.data;
closePanel(); closePanel();
document.getElementById("menuAccount").innerHTML = `<img class="b3-list-item__graphic" src="${window.siyuan.user.userAvatarURL}"/> document.getElementById("menuAccount").innerHTML = `<img class="b3-menu__icon" src="${window.siyuan.user.userAvatarURL}"/>
<span class="b3-list-item__text">${window.siyuan.user.userName}</span>`; <span class="b3-menu__label">${window.siyuan.user.userName}</span>`;
processSync(); processSync();
}); });
}); });
@ -382,7 +397,6 @@ ${accountHTML}
} }
}); });
menuElement.style.right = "0"; menuElement.style.right = "0";
scrimElement.classList.remove("fn__none");
}; };
const initAbout = () => { const initAbout = () => {
@ -507,12 +521,6 @@ const initAbout = () => {
<br> <br>
<span class="ft__on-surface">${window.siyuan.languages.slogan}</span> <span class="ft__on-surface">${window.siyuan.languages.slogan}</span>
</div> </div>
<span class="fn__flex-1"></span>
<a class="fn__flex" href="${"zh_CN" === window.siyuan.config.lang ? "https://ld246.com/article/1649901726096" : "https://github.com/siyuan-note/siyuan/issues"}" target="_blank">
<svg class="fn__flex-center svg"><use xlink:href="#iconHeart"></use></svg>
<span class="fn__space"></span>
${window.siyuan.languages.feedback}
</a>
</div> </div>
<div style="color:var(--b3-theme-surface);font-family: cursive;">会泽百家&nbsp;至公天下</div> <div style="color:var(--b3-theme-surface);font-family: cursive;">会泽百家&nbsp;至公天下</div>
${window.siyuan.languages.about1} ${window.siyuan.languages.about1}

2
app/src/mobile/util/touch.ts
View file

@ -34,7 +34,7 @@ export const handleTouchStart = (event: TouchEvent) => {
xDiff = 0; xDiff = 0;
yDiff = 0; yDiff = 0;
clientX = event.touches[0].clientX; clientX = event.touches[0].clientX;
if ((clientX < 48 || clientX > window.innerWidth - 24) && document.querySelector(".scrim").classList.contains("fn__none")) { if ((clientX < 48 || clientX > window.innerWidth - 24)) {
clientY = event.touches[0].clientY; clientY = event.touches[0].clientY;
} else { } else {
clientX = null; clientX = null;

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

@ -208,16 +208,16 @@ export class Gutter {
openAttr(protyle.wysiwyg.element.querySelector(`[data-node-id="${id}"]`), protyle); openAttr(protyle.wysiwyg.element.querySelector(`[data-node-id="${id}"]`), protyle);
} else { } else {
this.renderMenu(protyle, buttonElement); this.renderMenu(protyle, buttonElement);
if (isMobile()) {
window.siyuan.menus.menu.fullscreen();
} else {
window.siyuan.menus.menu.popup({x: event.clientX - 16, y: event.clientY - 16}, true);
}
// https://ld246.com/article/1648433751993 // https://ld246.com/article/1648433751993
if (!protyle.toolbar.range) { if (!protyle.toolbar.range) {
protyle.toolbar.range = getEditorRange(protyle.wysiwyg.element.firstElementChild); protyle.toolbar.range = getEditorRange(protyle.wysiwyg.element.firstElementChild);
} }
focusByRange(protyle.toolbar.range); if (isMobile()) {
window.siyuan.menus.menu.fullscreen();
} else {
window.siyuan.menus.menu.popup({x: event.clientX - 16, y: event.clientY - 16}, true);
focusByRange(protyle.toolbar.range);
}
} }
}); });
this.element.addEventListener("contextmenu", (event: MouseEvent & { target: HTMLInputElement }) => { this.element.addEventListener("contextmenu", (event: MouseEvent & { target: HTMLInputElement }) => {