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

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

Browse source
This commit is contained in:
Vanessa 2024-10-27 16:49:05 +08:00
parent e014b02478
commit ee92809ef0
6 changed files with 24 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -518,7 +518,7 @@
opacity: 1; opacity: 1;
} }
&__item[data-type="nobg"] .b3-menu__label { &__item[data-type="nobg"] {
cursor: auto; cursor: auto;
} }

5
app/src/assets/scss/component/_list.scss
View file

@ -111,12 +111,9 @@
&__icon { &__icon {
svg, img { svg, img {
float: left;
margin: 3px 0;
height: 16px; height: 16px;
width: 16px; width: 16px;
color: var(--b3-theme-on-surface); color: var(--b3-theme-on-surface);
border-radius: var(--b3-border-radius);
} }
text-align: center; text-align: center;
@ -129,6 +126,8 @@
padding: 0 4px; padding: 0 4px;
flex-shrink: 0; flex-shrink: 0;
border-radius: var(--b3-border-radius); border-radius: var(--b3-border-radius);
display: flex;
align-items: center;
&:hover { &:hover {
color: var(--b3-theme-on-background); color: var(--b3-theme-on-background);

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

@ -290,6 +290,20 @@
} }
} }
&__avemoji {
@extend .b3-list-item__icon;
align-self: center;
margin-left: -4px;
font-size: 14px;
cursor: pointer;
svg, img {
height: 14px;
width: 14px;
color: var(--b3-theme-on-surface);
}
}
&__checked { &__checked {
width: 22px; width: 22px;
height: 22px; height: 22px;

8
app/src/protyle/render/av/col.ts
View file

@ -87,7 +87,7 @@ export const getEditHTML = (options: {
</button> </button>
<button class="b3-menu__separator"></button> <button class="b3-menu__separator"></button>
<button class="b3-menu__item" data-type="nobg"> <button class="b3-menu__item" data-type="nobg">
<span class="b3-menu__icon" data-col-type="${colData.type}" data-icon="${colData.icon}" data-type="update-icon">${colData.icon ? unicode2Emoji(colData.icon) : `<svg style="width: 14px;height: 14px"><use xlink:href="#${getColIconByType(colData.type)}"></use></svg>`}</span> <span class="b3-menu__avemoji" data-col-type="${colData.type}" data-icon="${colData.icon}" data-type="update-icon">${colData.icon ? unicode2Emoji(colData.icon) : `<svg style="width: 14px;height: 14px"><use xlink:href="#${getColIconByType(colData.type)}"></use></svg>`}</span>
<input data-type="name" class="b3-text-field fn__block" type="text" value="${colData.name}" style="margin: 4px 0"> <input data-type="name" class="b3-text-field fn__block" type="text" value="${colData.name}" style="margin: 4px 0">
</button> </button>
<button class="b3-menu__item" data-type="goUpdateColType" ${colData.type === "block" ? "disabled" : ""}> <button class="b3-menu__item" data-type="goUpdateColType" ${colData.type === "block" ? "disabled" : ""}>
@ -598,17 +598,17 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen
focusBlock(blockElement); focusBlock(blockElement);
}); });
menu.addItem({ menu.addItem({
iconHTML: `<span class="b3-menu__icon">${cellElement.dataset.icon ? unicode2Emoji(cellElement.dataset.icon) : `<svg style="height: 14px;width: 14px;"><use xlink:href="#${getColIconByType(type)}"></use></svg>`}</span>`, iconHTML: `<span class="b3-menu__avemoji">${cellElement.dataset.icon ? unicode2Emoji(cellElement.dataset.icon) : `<svg style="height: 14px;width: 14px;"><use xlink:href="#${getColIconByType(type)}"></use></svg>`}</span>`,
type: "readonly", type: "readonly",
label: `<input style="margin: 4px 0" class="b3-text-field fn__block fn__size200" type="text" value="${oldValue}">`, label: `<input style="margin: 4px 0" class="b3-text-field fn__block fn__size200" type="text" value="${oldValue}">`,
bind(element) { bind(element) {
const iconElement = element.querySelector(".b3-menu__icon") as HTMLElement; const iconElement = element.querySelector(".b3-menu__avemoji") as HTMLElement;
iconElement.setAttribute("data-icon", cellElement.dataset.icon); iconElement.setAttribute("data-icon", cellElement.dataset.icon);
iconElement.addEventListener("click", (event) => { iconElement.addEventListener("click", (event) => {
const rect = iconElement.getBoundingClientRect(); const rect = iconElement.getBoundingClientRect();
openEmojiPanel("", "av", { openEmojiPanel("", "av", {
x: rect.left, x: rect.left,
y: rect.bottom, y: rect.bottom + 4,
h: rect.height, h: rect.height,
w: rect.width w: rect.width
}, (unicode) => { }, (unicode) => {

4
app/src/protyle/render/av/openMenuPanel.ts
View file

@ -707,7 +707,7 @@ export const openMenuPanel = (options: {
const rect = target.getBoundingClientRect(); const rect = target.getBoundingClientRect();
openEmojiPanel("", "av", { openEmojiPanel("", "av", {
x: rect.left, x: rect.left,
y: rect.bottom, y: rect.bottom + 4,
h: rect.height, h: rect.height,
w: rect.width w: rect.width
}, (unicode) => { }, (unicode) => {
@ -772,7 +772,7 @@ export const openMenuPanel = (options: {
const rect = target.getBoundingClientRect(); const rect = target.getBoundingClientRect();
openEmojiPanel("", "av", { openEmojiPanel("", "av", {
x: rect.left, x: rect.left,
y: rect.bottom, y: rect.bottom + 4,
h: rect.height, h: rect.height,
w: rect.width w: rect.width
}, (unicode) => { }, (unicode) => {

2
app/src/protyle/render/av/view.ts
View file

@ -163,7 +163,7 @@ export const getViewHTML = (data: IAV) => {
</button> </button>
<button class="b3-menu__separator"></button> <button class="b3-menu__separator"></button>
<button class="b3-menu__item" data-type="nobg"> <button class="b3-menu__item" data-type="nobg">
<span class="b3-menu__icon" data-icon="${view.icon}" data-type="update-view-icon">${view.icon ? unicode2Emoji(view.icon) : '<svg style="height: 14px;width: 14px"><use xlink:href="#iconTable"></use></svg>'}</span> <span class="b3-menu__avemoji" data-icon="${view.icon}" data-type="update-view-icon">${view.icon ? unicode2Emoji(view.icon) : '<svg style="height: 14px;width: 14px"><use xlink:href="#iconTable"></use></svg>'}</span>
<input data-type="name" class="b3-text-field fn__block" type="text" value="${view.name}" data-value="${view.name}" style="margin: 4px 0"> <input data-type="name" class="b3-text-field fn__block" type="text" value="${view.name}" data-value="${view.name}" style="margin: 4px 0">
</button> </button>
<button class="b3-menu__separator"></button> <button class="b3-menu__separator"></button>