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

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

Browse source
This commit is contained in:
Vanessa 2025-11-22 21:55:03 +08:00
parent c0a3635809
commit 2d1f12ec33
4 changed files with 26 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

9
app/src/assets/scss/component/_typography.scss
View file

@ -408,10 +408,13 @@
[data-subtype="NodeIFrame"], [data-subtype="NodeIFrame"],
[data-subtype="widget"] { [data-subtype="widget"] {
.iframe-content {
width: 100%;
height: 256px; height: 256px;
max-width: 100%; width: 100%;
.iframe-content {
position: relative;
height: 100%;
width: 100%;
} }
iframe { iframe {

5
app/src/assets/scss/protyle/_wysiwyg.scss
View file

@ -513,11 +513,6 @@
-webkit-user-modify: read-only; -webkit-user-modify: read-only;
} }
.iframe-content {
display: inline-block;
position: relative;
}
&--drag { &--drag {
.iframe-content::after { .iframe-content::after {
content: ""; content: "";

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

@ -2102,6 +2102,8 @@ export class Gutter {
this.genClick(nodeElements, protyle, (e: HTMLElement) => { this.genClick(nodeElements, protyle, (e: HTMLElement) => {
if (e.classList.contains("av")) { if (e.classList.contains("av")) {
e.style.justifyContent = ""; e.style.justifyContent = "";
} else if (["NodeIFrame", "widget"].includes(e.getAttribute("data-subtype"))) {
e.style.margin = "";
} else { } else {
e.style.textAlign = "left"; e.style.textAlign = "left";
} }
@ -2116,6 +2118,8 @@ export class Gutter {
this.genClick(nodeElements, protyle, (e: HTMLElement) => { this.genClick(nodeElements, protyle, (e: HTMLElement) => {
if (e.classList.contains("av")) { if (e.classList.contains("av")) {
e.style.justifyContent = "center"; e.style.justifyContent = "center";
} else if (["NodeIFrame", "widget"].includes(e.getAttribute("data-subtype"))) {
e.style.margin = "0 auto";
} else { } else {
e.style.textAlign = "center"; e.style.textAlign = "center";
} }
@ -2130,6 +2134,8 @@ export class Gutter {
this.genClick(nodeElements, protyle, (e: HTMLElement) => { this.genClick(nodeElements, protyle, (e: HTMLElement) => {
if (e.classList.contains("av")) { if (e.classList.contains("av")) {
e.style.justifyContent = "flex-end"; e.style.justifyContent = "flex-end";
} else if (["NodeIFrame", "widget"].includes(e.getAttribute("data-subtype"))) {
e.style.margin = "0 0 0 auto";
} else { } else {
e.style.textAlign = "right"; e.style.textAlign = "right";
} }
@ -2180,6 +2186,8 @@ export class Gutter {
this.genClick(nodeElements, protyle, (e: HTMLElement) => { this.genClick(nodeElements, protyle, (e: HTMLElement) => {
if (e.classList.contains("av")) { if (e.classList.contains("av")) {
e.style.justifyContent = ""; e.style.justifyContent = "";
} else if (["NodeIFrame", "widget"].includes(e.getAttribute("data-subtype"))) {
e.style.margin = "";
} else { } else {
e.style.textAlign = ""; e.style.textAlign = "";
e.style.direction = ""; e.style.direction = "";

16
app/src/protyle/wysiwyg/index.ts
View file

@ -923,11 +923,16 @@ export class WYSIWYG {
return; return;
} }
let isCenter = true; let isCenter = true;
if (["NodeIFrame", "NodeWidget", "NodeVideo"].includes(nodeElement.getAttribute("data-type"))) { if ("NodeVideo" === nodeElement.dataset.type) {
nodeElement.classList.add("iframe--drag"); nodeElement.classList.add("iframe--drag");
if (["left", "right", ""].includes(nodeElement.style.textAlign)) { if (["left", "right", ""].includes(nodeElement.style.textAlign)) {
isCenter = false; isCenter = false;
} }
} else if (["NodeIFrame", "NodeWidget"].includes(nodeElement.dataset.type)) {
nodeElement.classList.add("iframe--drag");
if (!nodeElement.style.margin) {
isCenter = false;
}
} else if (target.parentElement.parentElement.getAttribute("data-type") === "img") { } else if (target.parentElement.parentElement.getAttribute("data-type") === "img") {
target.parentElement.parentElement.classList.add("img--drag"); target.parentElement.parentElement.classList.add("img--drag");
} }
@ -943,6 +948,11 @@ export class WYSIWYG {
if (dragElement.tagName === "IMG") { if (dragElement.tagName === "IMG") {
img3115(imgElement); img3115(imgElement);
} }
// 3.4.1 以前历史数据兼容
if (dragElement.tagName === "IFRAME") {
dragElement.style.height = "";
dragElement.style.width = "";
}
documentSelf.onmousemove = (moveEvent: MouseEvent) => { documentSelf.onmousemove = (moveEvent: MouseEvent) => {
if (dragElement.tagName === "IMG") { if (dragElement.tagName === "IMG") {
dragElement.style.height = ""; dragElement.style.height = "";
@ -952,7 +962,7 @@ export class WYSIWYG {
if (dragElement.tagName === "IMG") { if (dragElement.tagName === "IMG") {
dragElement.parentElement.style.width = Math.max(17, dragWidth + (moveEvent.clientX - x) * multiple) + "px"; dragElement.parentElement.style.width = Math.max(17, dragWidth + (moveEvent.clientX - x) * multiple) + "px";
} else if (dragElement.tagName === "IFRAME") { } else if (dragElement.tagName === "IFRAME") {
dragElement.parentElement.style.width = Math.max(17, dragWidth + (moveEvent.clientX - x) * multiple) + "px"; nodeElement.style.width = Math.max(17, dragWidth + (moveEvent.clientX - x) * multiple) + "px";
} else { } else {
dragElement.style.width = Math.max(17, dragWidth + (moveEvent.clientX - x) * multiple) + "px"; dragElement.style.width = Math.max(17, dragWidth + (moveEvent.clientX - x) * multiple) + "px";
} }
@ -960,7 +970,7 @@ export class WYSIWYG {
if (dragElement.tagName !== "IMG") { if (dragElement.tagName !== "IMG") {
if (moveEvent.clientY > y - dragHeight + 8 && moveEvent.clientY < mostBottom) { if (moveEvent.clientY > y - dragHeight + 8 && moveEvent.clientY < mostBottom) {
if (dragElement.tagName === "IFRAME") { if (dragElement.tagName === "IFRAME") {
dragElement.parentElement.style.height = (dragHeight + (moveEvent.clientY - y)) + "px"; nodeElement.style.height = (dragHeight + (moveEvent.clientY - y)) + "px";
} else { } else {
dragElement.style.height = (dragHeight + (moveEvent.clientY - y)) + "px"; dragElement.style.height = (dragHeight + (moveEvent.clientY - y)) + "px";
} }