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/8631

Browse source
This commit is contained in:
Vanessa 2023-07-03 10:49:55 +08:00
parent fd64882595
commit e520e0aa18
10 changed files with 56 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

2
app/src/asset/renderAssets.ts
View file

@ -68,7 +68,7 @@ export const genAssetHTML = (type: string, pathString: string, imgName: string,
if (!pathString.startsWith("assets/")) {
netHTML = '<span class="img__net"><svg><use xlink:href="#iconLanguage"></use></svg></span>';
}
html = `<span contenteditable="false" data-type="img" class="img"><span> </span><span><span class="protyle-action protyle-icons"><span class="protyle-icon protyle-icon--only"><svg class="svg"><use xlink:href="#iconMore"></use></svg></span></span><img src="${pathString}" data-src="${pathString}" alt="${imgName}" /><span class="protyle-action__drag"></span>${netHTML}<span class="protyle-action__title"></span></span><span> </span></span>`;
html = `<span contenteditable="false" data-type="img" class="img"><span> </span><span><span class="protyle-action protyle-icons"><span class="protyle-icon protyle-icon--only"><svg><use xlink:href="#iconMore"></use></svg></span></span><img src="${pathString}" data-src="${pathString}" alt="${imgName}" /><span class="protyle-action__drag"></span>${netHTML}<span class="protyle-action__title"></span></span><span> </span></span>`;
} else if (Constants.SIYUAN_ASSETS_VIDEO.includes(type)) {
html = `<div data-node-id="${Lute.NewNodeID()}" data-type="NodeVideo" class="iframe" updated="${dayjs().format("YYYYMMDDHHmmss")}"><div class="iframe-content">${Constants.ZWSP}<video controls="controls" src="${pathString}" data-src="${pathString}"></video><span class="protyle-action__drag" contenteditable="false"></span></div><div class="protyle-attr" contenteditable="false">${Constants.ZWSP}</div></div>`;
} else {

3
app/src/assets/scss/business/_av.scss
View file

@ -167,7 +167,8 @@
}
}
&.protyle-wysiwyg--select {
&.protyle-wysiwyg--select,
&.protyle-wysiwyg--hl {
.layout-tab-bar,
.av__row--header,
.av__row--footer {

1
app/src/assets/scss/business/_card.scss
View file

@ -4,6 +4,7 @@
box-sizing: border-box;
max-height: 100%;
background-color: var(--b3-theme-surface);
border-radius: var(--b3-border-radius-b);
}
&__empty {

24
app/src/assets/scss/business/_config.scss
View file

@ -1,15 +1,33 @@
.config {
&__tab-wrap {
overflow: hidden;
box-sizing: border-box;
background-color: var(--b3-theme-background);
border-radius: 0 var(--b3-border-radius-b) var(--b3-border-radius-b) 0;
width: 100%;
height: 100%;
padding: 16px 0;
}
&__tab-container {
overflow: auto;
box-sizing: border-box;
flex: 1;
background-color: var(--b3-theme-background);
border-radius: 0 var(--b3-border-radius-b) var(--b3-border-radius-b) 0;
height: 100%;
.b3-label {
padding: 16px 0;
margin: 0 24px;
}
&--full {
margin-top: -16px;
height: calc(100% + 32px);
}
&--top {
margin-top: -16px;
height: calc(100% + 16px);
}
}
&__panel {

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

@ -479,13 +479,14 @@
&-icon {
font-size: 85%;
line-height: 22px;
line-height: 24px;
cursor: pointer;
padding: 0 4px;
padding: 5px;
transition: var(--b3-transition);
background-color: var(--b3-theme-on-surface);
height: 22px;
height: 24px;
color: var(--b3-theme-surface);
box-sizing: border-box;
&--only {
border-radius: var(--b3-border-radius);
@ -517,7 +518,8 @@
}
& > svg {
height: 22px;
height: 14px;
float: left;
width: 14px;
fill: currentColor;
}

2
app/src/assets/scss/protyle/_protyle.scss
View file

@ -258,7 +258,7 @@
}
&:not(.fn__none) + .protyle-icons {
margin-top: 57px;
margin-top: 56px;
}
}

2
app/src/card/viewCards.ts
View file

@ -39,7 +39,7 @@ export const viewCards = (app: App, deckID: string, title: string, deckType: "Tr
<ul class="fn__flex-1 b3-list b3-list--background" style="user-select: none">
${renderViewItem(response.data.blocks, title, deckType)}
</ul>
<div id="cardPreview" class="fn__flex-1 fn__none"></div>
<div id="cardPreview" style="border-bottom-right-radius:var(--b3-border-radius-b);" class="fn__flex-1 fn__none"></div>
<div class="fn__flex-1 card__empty">${window.siyuan.languages.emptyContent}</div>
</div>
</div>`,

10
app/src/config/index.ts
View file

@ -110,19 +110,21 @@ export const openSetting = (app: App) => {
<li data-name="repos" class="b3-list-item"><svg class="b3-list-item__graphic"><use xlink:href="#iconCloud"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.cloud}</span></li>
<li data-name="about" class="b3-list-item"><svg class="b3-list-item__graphic"><use xlink:href="#iconInfo"></use></svg><span class="b3-list-item__text">${window.siyuan.languages.about}</span></li>
</ul>
<div class="config__tab-wrap">
<div class="config__tab-container" data-name="editor">${editor.genHTML()}</div>
<div class="config__tab-container fn__none" data-name="filetree"></div>
<div class="config__tab-container fn__none" data-name="card"></div>
<div class="config__tab-container fn__none" data-name="AI"></div>
<div class="config__tab-container fn__none" data-name="image"></div>
<div class="config__tab-container config__tab-container--top fn__none" data-name="AI"></div>
<div class="config__tab-container config__tab-container--top fn__none" data-name="image"></div>
<div class="config__tab-container fn__none" data-name="export"></div>
<div class="config__tab-container fn__none" data-name="appearance"></div>
<div class="config__tab-container fn__none" data-name="bazaar"></div>
<div class="config__tab-container config__tab-container--top fn__none" data-name="bazaar"></div>
<div class="config__tab-container fn__none" data-name="search"></div>
<div class="config__tab-container fn__none" style="overflow: scroll" data-name="keymap"></div>
<div class="config__tab-container fn__none" data-name="account"></div>
<div class="config__tab-container config__tab-container--full fn__none" data-name="account"></div>
<div class="config__tab-container fn__none" data-name="repos"></div>
<div class="config__tab-container fn__none" data-name="about"></div>
</div>
</div>`,
width: "90vw",
height: "90vh",

9
app/src/protyle/ui/initUI.ts
View file

@ -141,12 +141,11 @@ export const setPadding = (protyle: IProtyle) => {
min24 = 96;
}
}
if (protyle.options.render.background && protyle.options.render.title) {
if (protyle.options.render.background) {
protyle.background.element.lastElementChild.setAttribute("style", `left:${min16}px`);
protyle.title.element.style.margin = `16px ${min16}px 0 ${min24}px`;
} else if (protyle.options.render.background && !protyle.options.render.title) {
protyle.background.element.lastElementChild.setAttribute("style", `left:${min16}px`);
} else if (!protyle.options.render.background && protyle.options.render.title) {
protyle.background.element.querySelector(".protyle-background__img .protyle-icons").setAttribute("style", `right:${min16}px`);
}
if (protyle.options.render.title) {
protyle.title.element.style.margin = `16px ${min16}px 0 ${min24}px`;
}
let bottomHeight = "16px";

8
app/src/protyle/wysiwyg/transaction.ts
View file

@ -452,13 +452,13 @@ export const onTransaction = (protyle: IProtyle, operation: IOperation, focus: b
if (refElement) {
nodeAttrHTML += refElement.outerHTML;
}
if (data.new["custom-riff-decks"]) {
if (data.new["custom-riff-decks"] && data.new["custom-riff-decks"] !== data.old["custom-riff-decks"]) {
protyle.title.element.style.animation = "addCard 450ms linear";
protyle.title.element.setAttribute("custom-riff-decks", data.new["custom-riff-decks"]);
setTimeout(() => {
protyle.title.element.style.animation = "";
}, 450);
} else {
} else if (!data.new["custom-riff-decks"]) {
protyle.title.element.removeAttribute("custom-riff-decks");
}
protyle.title.element.querySelector(".protyle-attr").innerHTML = nodeAttrHTML;
@ -487,12 +487,12 @@ export const onTransaction = (protyle: IProtyle, operation: IOperation, focus: b
Object.keys(data.old).forEach(key => {
item.removeAttribute(key);
});
if (data.new.style && data.new["custom-riff-decks"]) {
if (data.new.style && data.new["custom-riff-decks"] && data.new["custom-riff-decks"] !== data.old["custom-riff-decks"]) {
data.new.style += ";animation:addCard 450ms linear";
}
Object.keys(data.new).forEach(key => {
item.setAttribute(key, data.new[key]);
if (key === "custom-riff-decks") {
if (key === "custom-riff-decks" && data.new["custom-riff-decks"] !== data.old["custom-riff-decks"]) {
item.style.animation = "addCard 450ms linear";
setTimeout(() => {
item.style.animation = "";