Vanessa 2025-03-07 11:37:20 +08:00
parent e237bcde85
commit 0d4b60bf32
2 changed files with 9 additions and 16 deletions

View file

@ -1292,7 +1292,7 @@ export const imgMenu = (protyle: IProtyle, range: Range, assetElement: HTMLEleme
id: "widthDrag", id: "widthDrag",
iconHTML: "", iconHTML: "",
type: "readonly", type: "readonly",
label: `<div style="margin: 4px 0;" aria-label="${imgElement.parentElement.style.width ? imgElement.parentElement.style.width.replace("vw", "%").replace("calc(", "").replace(" - 8px)", "") : window.siyuan.languages.default}" class="b3-tooltips b3-tooltips__n${isMobile() ? "" : " fn__size200"}"><input style="box-sizing: border-box" value="${(imgElement.parentElement.style.width.indexOf("%") > -1 || imgElement.parentElement.style.width.endsWith("vw")) ? parseInt(imgElement.parentElement.style.width.replace("calc(", "")) : 0}" class="b3-slider fn__block" max="100" min="1" step="1" type="range"></div>`, label: `<div style="margin: 4px 0;" aria-label="${imgElement.parentElement.style.width ? imgElement.parentElement.style.width.replace("vw", "%").replace("calc(", "").replace(" - 8px)", "") : window.siyuan.languages.default}" class="b3-tooltips b3-tooltips__n"><input style="box-sizing: border-box" value="${(imgElement.parentElement.style.width.indexOf("%") > -1 || imgElement.parentElement.style.width.endsWith("vw")) ? parseInt(imgElement.parentElement.style.width.replace("calc(", "")) : 0}" class="b3-slider fn__block" max="100" min="1" step="1" type="range"></div>`,
bind(element) { bind(element) {
rangeElement = element.querySelector("input"); rangeElement = element.querySelector("input");
rangeElement.addEventListener("input", () => { rangeElement.addEventListener("input", () => {
@ -1357,7 +1357,7 @@ export const imgMenu = (protyle: IProtyle, range: Range, assetElement: HTMLEleme
id: "heightDrag", id: "heightDrag",
iconHTML: "", iconHTML: "",
type: "readonly", type: "readonly",
label: `<div style="margin: 4px 0;" aria-label="${imgElement.style.height ? imgElement.style.height.replace("vh", "%") : window.siyuan.languages.default}" class="b3-tooltips b3-tooltips__n${isMobile() ? "" : " fn__size200"}"><input style="box-sizing: border-box" value="${imgElement.style.height.endsWith("vh") ? parseInt(imgElement.style.height) : 0}" class="b3-slider fn__block" max="100" min="1" step="1" type="range"></div>`, label: `<div style="margin: 4px 0;" aria-label="${imgElement.style.height ? imgElement.style.height.replace("vh", "%") : window.siyuan.languages.default}" class="b3-tooltips b3-tooltips__n"><input style="box-sizing: border-box" value="${imgElement.style.height.endsWith("vh") ? parseInt(imgElement.style.height) : 0}" class="b3-slider fn__block" max="100" min="1" step="1" type="range"></div>`,
bind(element) { bind(element) {
rangeHeightElement = element.querySelector("input"); rangeHeightElement = element.querySelector("input");
rangeHeightElement.addEventListener("input", () => { rangeHeightElement.addEventListener("input", () => {

View file

@ -1475,8 +1475,9 @@ export class Gutter {
icon: "iconCode", icon: "iconCode",
submenu: [{ submenu: [{
id: "height", id: "height",
label: `${window.siyuan.languages.height}<span class="fn__space"></span> iconHTML: "",
<input style="margin: 4px 0;width: 84px" type="number" step="1" min="148" class="b3-text-field" value="${height ? parseInt(height) : "420"}">`, type: "readonly",
label: `<div class="fn__flex"><input class="b3-text-field fn__flex-1" value="${height ? parseInt(height) : "420"}" step="1" min="148" style="margin: 4px 8px 4px 0" placeholder="${window.siyuan.languages.height}"><span class="fn__flex-center">px</span></div>`,
bind: (element) => { bind: (element) => {
element.querySelector("input").addEventListener("change", (event) => { element.querySelector("input").addEventListener("change", (event) => {
const newHeight = ((event.target as HTMLInputElement).value || "420") + "px"; const newHeight = ((event.target as HTMLInputElement).value || "420") + "px";
@ -2093,9 +2094,7 @@ export class Gutter {
id: "widthInput", id: "widthInput",
iconHTML: "", iconHTML: "",
type: "readonly", type: "readonly",
label: `<div class="fn__flex-center"> label: `<div class="fn__flex"><input class="b3-text-field fn__flex-1" value="${firstElement.style.width.endsWith("px") ? parseInt(firstElement.style.width) : ""}" type="number" style="margin: 4px 8px 4px 0" placeholder="${window.siyuan.languages.width}"><span class="fn__flex-center">px</span></div>`,
<input class="b3-text-field" value="${firstElement.style.width.endsWith("px") ? parseInt(firstElement.style.width) : ""}" type="number" style="margin: 4px" placeholder="${window.siyuan.languages.width}"> px
</div>`,
bind: (element) => { bind: (element) => {
const inputElement = element.querySelector("input"); const inputElement = element.querySelector("input");
inputElement.addEventListener("input", () => { inputElement.addEventListener("input", () => {
@ -2134,9 +2133,7 @@ export class Gutter {
id: "widthDrag", id: "widthDrag",
iconHTML: "", iconHTML: "",
type: "readonly", type: "readonly",
label: `<div style="margin: 4px 0;" aria-label="${firstElement.style.width.endsWith("px") ? firstElement.style.width : (firstElement.style.width || window.siyuan.languages.default)}" class="b3-tooltips b3-tooltips__n${isMobile() ? "" : " fn__size200"}"> label: `<div style="margin: 4px 0;" aria-label="${firstElement.style.width.endsWith("px") ? firstElement.style.width : (firstElement.style.width || window.siyuan.languages.default)}" class="b3-tooltips b3-tooltips__n"><input style="box-sizing: border-box" value="${width}" class="b3-slider fn__block" max="100" min="1" step="1" type="range"></div>`,
<input style="box-sizing: border-box" value="${width}" class="b3-slider fn__block" max="100" min="1" step="1" type="range">
</div>`,
bind: (element) => { bind: (element) => {
rangeElement = element.querySelector("input"); rangeElement = element.querySelector("input");
rangeElement.addEventListener("input", () => { rangeElement.addEventListener("input", () => {
@ -2183,9 +2180,7 @@ export class Gutter {
id: "heightInput", id: "heightInput",
iconHTML: "", iconHTML: "",
type: "readonly", type: "readonly",
label: `<div class="fn__flex-center"> label: `<div class="fn__flex"><input class="b3-text-field fn__flex-1" value="${firstElement.style.height.endsWith("px") ? parseInt(firstElement.style.height) : ""}" type="number" style="margin: 4px 8px 4px 0" placeholder="${window.siyuan.languages.height}"><span class="fn__flex-center">px</span></div>`,
<input class="b3-text-field" value="${firstElement.style.height.endsWith("px") ? parseInt(firstElement.style.height) : ""}" type="number" style="margin: 4px" placeholder="${window.siyuan.languages.height}"> px
</div>`,
bind: (element) => { bind: (element) => {
const inputElement = element.querySelector("input"); const inputElement = element.querySelector("input");
inputElement.addEventListener("input", () => { inputElement.addEventListener("input", () => {
@ -2222,9 +2217,7 @@ export class Gutter {
submenu: styles.concat([{ submenu: styles.concat([{
iconHTML: "", iconHTML: "",
type: "readonly", type: "readonly",
label: `<div style="margin: 4px 0;" aria-label="${firstElement.style.height.endsWith("px") ? firstElement.style.height : (firstElement.style.height || window.siyuan.languages.default)}" class="b3-tooltips b3-tooltips__n${isMobile() ? "" : " fn__size200"}"> label: `<div style="margin: 4px 0;" aria-label="${firstElement.style.height.endsWith("px") ? firstElement.style.height : (firstElement.style.height || window.siyuan.languages.default)}" class="b3-tooltips b3-tooltips__n"><input style="box-sizing: border-box" value="${height}" class="b3-slider fn__block" max="100" min="1" step="1" type="range"></div>`,
<input style="box-sizing: border-box" value="${height}" class="b3-slider fn__block" max="100" min="1" step="1" type="range">
</div>`,
bind: (element) => { bind: (element) => {
rangeElement = element.querySelector("input"); rangeElement = element.querySelector("input");
rangeElement.addEventListener("input", () => { rangeElement.addEventListener("input", () => {