github/siyuan
4
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-05-12 23:21:23 +08:00
Code Issues Packages Projects Releases Wiki Activity

🎨 https://github.com/siyuan-note/siyuan/issues/7363

Browse Source
This commit is contained in:
Vanessa 2023-02-15 15:25:25 +08:00
parent 2cac581630
commit f2de7bf6e6
7 changed files with 24 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/src/assets/scss/_block.scss
View File

@ -125,10 +125,6 @@
flex-direction: column; flex-direction: column;
border-bottom: 1px solid var(--b3-theme-surface-lighter); border-bottom: 1px solid var(--b3-theme-surface-lighter);
.protyle-wysiwyg {
transition: none;
}
&:last-child { &:last-child {
border-bottom: 0; border-bottom: 0;
} }

16
app/src/assets/scss/_protyle.scss
View File

@ -261,6 +261,20 @@
.protyle-content { .protyle-content {
overflow: auto; overflow: auto;
flex: 1; flex: 1;
&--transition {
.protyle-wysiwyg {
transition: padding .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0ms;
}
.protyle-title {
transition: margin .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0ms;
}
.protyle-background__iconw {
transition: left .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0ms;
}
}
} }
.protyle-background { .protyle-background {
@ -401,7 +415,6 @@
display: flex; display: flex;
position: absolute; position: absolute;
height: 80px; height: 80px;
transition: left .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0ms;
.protyle-icons { .protyle-icons {
position: initial; position: initial;
@ -414,7 +427,6 @@
margin: 34px 16px 0 24px; margin: 34px 16px 0 24px;
position: relative; position: relative;
font-size: 16px; font-size: 16px;
transition: margin .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0ms;
&:hover .protyle-title__icon { &:hover .protyle-title__icon {
opacity: 1; opacity: 1;

2
app/src/assets/scss/_wysiwyg.scss
View File

@ -1,7 +1,7 @@
.protyle-wysiwyg { .protyle-wysiwyg {
padding: 34px 16px 16px 24px; padding: 34px 16px 16px 24px;
cursor: text; cursor: text;
transition: padding .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0ms;
box-sizing: border-box; box-sizing: border-box;
.protyle-breadcrumb__bar { .protyle-breadcrumb__bar {

12
app/src/layout/index.ts
View File

@ -81,10 +81,14 @@ export class Layout {
item.element.classList.add("fn__flex-1"); item.element.classList.add("fn__flex-1");
if (this.direction === "lr") { if (this.direction === "lr") {
// 向右分屏，左侧文档抖动，移除动画和边距 // 向右分屏，左侧文档抖动，移除动画和边距
item.element.querySelectorAll(".protyle-wysiwyg").forEach((element: HTMLElement) => { item.element.querySelectorAll(".protyle-content").forEach((element: HTMLElement) => {
element.style.transition = "none"; if (!element.parentElement.classList.contains("fn__none")) {
element.style.paddingRight = "16px"; element.classList.remove("protyle-content--transition");
element.style.paddingLeft = "24px"; const wysiwygElement = element.querySelector(".protyle-wysiwyg") as HTMLElement;
wysiwygElement.style.paddingRight = "16px";
wysiwygElement.style.paddingLeft = "24px";
element.classList.add("protyle-content--transition");
}
}); });
} }
item.element.after(child.element); item.element.after(child.element);

2
app/src/layout/util.ts
View File

@ -625,9 +625,7 @@ export const addResize = (obj: Layout | Wnd) => {
const documentSelf = document; const documentSelf = document;
const nextElement = resizeElement.nextElementSibling as HTMLElement; const nextElement = resizeElement.nextElementSibling as HTMLElement;
const previousElement = resizeElement.previousElementSibling as HTMLElement; const previousElement = resizeElement.previousElementSibling as HTMLElement;
nextElement.style.transition = "";
nextElement.style.overflow = "auto"; // 拖动时 layout__resize 会出现 https://github.com/siyuan-note/siyuan/issues/6221 nextElement.style.overflow = "auto"; // 拖动时 layout__resize 会出现 https://github.com/siyuan-note/siyuan/issues/6221
previousElement.style.transition = "";
previousElement.style.overflow = "auto"; previousElement.style.overflow = "auto";
setSize(nextElement, direction); setSize(nextElement, direction);
setSize(previousElement, direction); setSize(previousElement, direction);

1
app/src/protyle/index.ts
View File

@ -217,6 +217,7 @@ export class Protyle {
} }
}); });
} }
this.protyle.contentElement.classList.add("protyle-content--transition")
} }
private init() { private init() {

1
app/src/protyle/ui/initUI.ts
View File

@ -124,7 +124,6 @@ export const setPadding = (protyle: IProtyle) => {
} else { } else {
protyle.wysiwyg.element.style.padding = `16px ${min16}px ${bottomHeight} ${min24}px`; protyle.wysiwyg.element.style.padding = `16px ${min16}px ${bottomHeight} ${min24}px`;
} }
protyle.wysiwyg.element.style.transition = ""; // addWnd 时防止向右分屏，左侧文档抖动，移除动画
if (window.siyuan.config.editor.codeSyntaxHighlightLineNum) { if (window.siyuan.config.editor.codeSyntaxHighlightLineNum) {
setTimeout(() => { // https://github.com/siyuan-note/siyuan/issues/5612 setTimeout(() => { // https://github.com/siyuan-note/siyuan/issues/5612
protyle.wysiwyg.element.querySelectorAll('.code-block [contenteditable="true"]').forEach((block: HTMLElement) => { protyle.wysiwyg.element.querySelectorAll('.code-block [contenteditable="true"]').forEach((block: HTMLElement) => {