Vanessa 2024-01-20 00:13:38 +08:00
parent c1a77223c8
commit 84323004e0
12 changed files with 24 additions and 12 deletions

View file

@ -50,6 +50,14 @@
padding: 4px 8px;
font-size: 100%;
border-bottom: 0;
& > .block__icon {
cursor: grab;
&:hover {
background-color: transparent;
}
}
}
.b3-text-field--text {

View file

@ -70,6 +70,10 @@
cursor: pointer;
}
&__grab {
cursor: grab;
}
&__none {
display: none !important;
}

View file

@ -1936,7 +1936,7 @@ export class Gutter {
const rowElement = hasClosestByClassName(target, "av__row");
if (rowElement && !rowElement.classList.contains("av__row--header")) {
element = rowElement;
html = `<button data-type="NodeAttributeViewRowMenu" data-node-id="${dataNodeId}" data-row-id="${rowElement.dataset.id}" class="ariaLabel" data-position="right" aria-label="${window.siyuan.languages.rowTip}"><svg><use xlink:href="#iconDrag"></use></svg><span ${protyle.disabled ? "" : 'draggable="true"'}></span></button>`;
html = `<button data-type="NodeAttributeViewRowMenu" data-node-id="${dataNodeId}" data-row-id="${rowElement.dataset.id}" class="ariaLabel" data-position="right" aria-label="${window.siyuan.languages.rowTip}"><svg><use xlink:href="#iconDrag"></use></svg><span ${protyle.disabled ? "" : 'draggable="true" class="fn__grab"'}></span></button>`;
if (!protyle.disabled) {
html = `<button data-type="NodeAttributeViewRow" data-node-id="${dataNodeId}" data-row-id="${rowElement.dataset.id}" class="ariaLabel" data-position="right" aria-label="${isMac() ? window.siyuan.languages.addBelowAbove : window.siyuan.languages.addBelowAbove.replace("⌥", "Alt+")}"><svg><use xlink:href="#iconAdd"></use></svg></button>${html}`;
}

View file

@ -67,7 +67,7 @@ export const getAssetHTML = (cellElements: HTMLElement[]) => {
}
html += `<button class="b3-menu__item" draggable="true" data-name="${item.name}" data-type="${item.type}" data-content="${item.content}">
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
<svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg>
${contentHTML}
<svg class="b3-menu__action" data-type="editAssetItem"><use xlink:href="#iconEdit"></use></svg>
</button>`;

View file

@ -161,7 +161,7 @@ export const renderAVAttribute = (element: HTMLElement, id: string, protyle: IPr
</div>`;
table.keyValues?.forEach(item => {
html += `<div class="block__icons av__row" data-id="${id}">
<div class="block__icon"><svg><use xlink:href="#iconDrag"></use></svg></div>
<div class="block__icon" draggable="true"><svg><use xlink:href="#iconDrag"></use></svg></div>
<div class="block__logo ariaLabel" aria-label="${escapeAttr(item.key.name)}"">
${item.key.icon ? unicode2Emoji(item.key.icon, "block__logoicon", true) : `<svg class="block__logoicon"><use xlink:href="#${getColIconByType(item.key.type)}"></use></svg>`}
<span>${item.key.name}</span>

View file

@ -119,7 +119,7 @@ export const getEditHTML = (options: {
</button>`;
colData.options.forEach(item => {
html += `<button class="b3-menu__item${html ? "" : " b3-menu__item--current"}" draggable="true" data-name="${item.name}" data-color="${item.color}">
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
<svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg>
<div class="fn__flex-1">
<span class="b3-chip" style="background-color:var(--b3-font-background${item.color});color:var(--b3-font-color${item.color})">
<span class="fn__ellipsis">${item.name}</span>

View file

@ -508,7 +508,7 @@ export const getFiltersHTML = (data: IAVTable) => {
data.filters.forEach((item: IAVFilter) => {
html += `<button class="b3-menu__item" draggable="true" data-id="${item.column}">
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
<svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg>
<div class="fn__flex-1">${genFilterItem(item)}</div>
<svg class="b3-menu__action" data-type="removeFilter"><use xlink:href="#iconTrashcan"></use></svg>
</button>`;

View file

@ -1080,7 +1080,7 @@ const getPropertiesHTML = (data: IAVTable) => {
data.columns.forEach((item: IAVColumn) => {
if (item.hidden) {
hideHTML += `<button class="b3-menu__item" draggable="true" data-id="${item.id}">
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
<svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg>
<div class="fn__flex-1">
<span class="b3-chip">
${item.icon ? unicode2Emoji(item.icon, "icon", true) : `<svg class="icon"><use xlink:href="#${getColIconByType(item.type)}"></use></svg>`}
@ -1092,7 +1092,7 @@ const getPropertiesHTML = (data: IAVTable) => {
</button>`;
} else {
showHTML += `<button class="b3-menu__item" draggable="true" data-id="${item.id}">
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
<svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg>
<div class="fn__flex-1">
<span class="b3-chip">
${item.icon ? unicode2Emoji(item.icon, "icon", true) : `<svg class="icon"><use xlink:href="#${getColIconByType(item.type)}"></use></svg>`}

View file

@ -195,7 +195,7 @@ export const toggleUpdateRelationBtn = (menuItemsElement: HTMLElement, avId: str
const genSelectItemHTML = (type: "selected" | "empty" | "unselect", id?: string, isDetached?: boolean, text?: string) => {
if (type === "selected") {
return `<button data-id="${id}" data-type="setRelationCell" class="b3-menu__item" draggable="true">
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
<svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg>
<span class="b3-menu__label${isDetached ? "" : " popover__block"}" ${isDetached ? "" : 'style="color:var(--b3-protyle-inline-blockref-color)"'} data-id="${id}">${text}</span>
<svg class="b3-menu__action"><use xlink:href="#iconMin"></use></svg>
</button>`;

View file

@ -18,7 +18,7 @@ const filterSelectHTML = (key: string, options: { name: string, color: string }[
(key.toLowerCase().indexOf(item.name.toLowerCase()) > -1 ||
item.name.toLowerCase().indexOf(key.toLowerCase()) > -1)) {
html += `<button data-type="addColOptionOrCell" class="b3-menu__item${html ? "" : " b3-menu__item--current"}" draggable="true" data-name="${item.name}" data-color="${item.color}">
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
<svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg>
<div class="fn__flex-1">
<span class="b3-chip" style="background-color:var(--b3-font-background${item.color});color:var(--b3-font-color${item.color})">
<span class="fn__ellipsis">${item.name}</span>

View file

@ -94,7 +94,7 @@ export const getSortsHTML = (columns: IAVColumn[], sorts: IAVSort[]) => {
};
sorts.forEach((item: IAVSort) => {
html += `<button draggable="true" class="b3-menu__item" data-id="${item.column}">
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
<svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg>
<select class="b3-select" style="margin: 4px 0">
${genSortItem(item.column)}
</select>

View file

@ -157,8 +157,8 @@ export const getSwitcherHTML = (views: IAVView[], viewId: string) => {
let html = "";
views.forEach((item) => {
html += `<button draggable="true" class="b3-menu__item" data-id="${item.id}">
<svg class="b3-menu__icon"><use xlink:href="#iconDrag"></use></svg>
<div class="fn__flex-1">
<svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg>
<div class="fn__flex-1">
<span class="b3-chip${item.id === viewId ? " b3-chip--primary" : ""}">
${item.icon ? unicode2Emoji(item.icon, "icon", true) : '<svg class="icon"><use xlink:href="#iconTable"></use></svg>'}
<span class="fn__ellipsis">${item.name}</span>