0ct0pu5/siyuan
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

💄 fix https://github.com/siyuan-note/siyuan/issues/6256

Browse source
This commit is contained in:
Vanessa 2022-10-18 22:58:46 +08:00
parent ae98a6dba5
commit 985e88a0af
8 changed files with 37 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
app/appearance/themes/daylight/theme.css
View file

@ -40,6 +40,7 @@
/* 列表 */
--b3-list-hover: #e9eaea;
--b3-list-icon-hover: rgba(33, 34, 36, .1);
/* 菜单 */
--b3-menu-background: #f8f9fa;

1
app/appearance/themes/midnight/theme.css
View file

@ -40,6 +40,7 @@
/* 列表 */
--b3-list-hover: #3f4041;
--b3-list-icon-hover: rgba(201, 209, 217, .1);
/* 菜单 */
--b3-menu-background: #27282a;

18
app/src/assets/scss/_list.scss
View file

@ -46,11 +46,15 @@
border-left: 1px solid var(--b3-theme-background-light);
left: -21px;
}
.b3-list-item__text {
padding-left: 4px;
}
}
&-item {
line-height: 28px;
padding: 1px 8px;
padding: 1px 4px;
display: flex;
cursor: pointer;
align-items: center;
@ -103,13 +107,13 @@
display: flex;
align-items: center;
height: 22px;
padding-right: 6px;
padding: 0 4px;
color: var(--b3-theme-on-surface);
transition: var(--b3-transition);
&--hl:hover {
color: var(--b3-theme-on-background);
background-color: var(--b3-theme-background-light);
background-color: var(--b3-list-icon-hover);
border-radius: 2px;
}
}
@ -130,12 +134,12 @@
line-height: 22px;
height: 22px;
transition: var(--b3-transition);
padding: 0 3px;
padding: 0 4px;
flex-shrink: 0;
&:hover {
color: var(--b3-theme-on-background);
background-color: var(--b3-theme-background-light);
background-color: var(--b3-list-icon-hover);
border-radius: 2px;
}
}
@ -231,7 +235,7 @@
&:hover {
color: var(--b3-theme-on-background);
background-color: var(--b3-theme-background-light);
background-color: var(--b3-list-icon-hover);
border-radius: 2px;
}
}
@ -241,7 +245,7 @@
&:hover {
color: var(--b3-theme-on-background);
background-color: var(--b3-theme-background-light);
background-color: var(--b3-list-icon-hover);
}
}
}

14
app/src/config/keymap.ts
View file

@ -64,49 +64,49 @@ export const keymap = {
<div class="fn__hr"></div>
<div class="b3-list b3-list--border b3-list--background">
<div class="b3-list-item toggle">
<span class="b3-list-item__toggle"><svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg></span>
<span class="b3-list-item__toggle b3-list-item__toggle--hl"><svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg></span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.general}</span>
</div>
<div class="fn__none">${keymap._genItem(window.siyuan.config.keymap.general, "general")}</div>
</div>
<div class="b3-list b3-list--border b3-list--background">
<div class="b3-list-item toggle">
<span class="b3-list-item__toggle">
<span class="b3-list-item__toggle b3-list-item__toggle--hl">
<svg class="b3-list-item__arrow b3-list-item__arrow--open"><use xlink:href="#iconRight"></use></svg>
</span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.editor}</span>
</div>
<div>
<label class="b3-list-item toggle">
<span class="b3-list-item__toggle">
<span class="b3-list-item__toggle b3-list-item__toggle--hl">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.general}</span>
</label>
<div class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.general, "editor" + Constants.ZWSP + "general")}</div>
<label class="b3-list-item toggle">
<span class="b3-list-item__toggle">
<span class="b3-list-item__toggle b3-list-item__toggle--hl">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.insert}</span>
</label>
<div class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.insert, "editor" + Constants.ZWSP + "insert")}</div>
<label class="b3-list-item toggle">
<span class="b3-list-item__toggle">
<span class="b3-list-item__toggle b3-list-item__toggle--hl">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.headings}</span>
</label>
<div class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.heading, "editor" + Constants.ZWSP + "heading")}</div>
<label class="b3-list-item toggle">
<span class="b3-list-item__toggle">
<span class="b3-list-item__toggle b3-list-item__toggle--hl">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.list1}</span>
</label>
<div class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.list, "editor" + Constants.ZWSP + "list")}</div>
<label class="b3-list-item toggle">
<span class="b3-list-item__toggle">
<span class="b3-list-item__toggle b3-list-item__toggle--hl">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.table}</span>

4
app/src/layout/dock/Files.ts
View file

@ -486,7 +486,7 @@ export class Files extends Model {
} else {
return `<ul class="b3-list b3-list--background" data-url="${item.id}" data-sort="${item.sort}">
<li class="b3-list-item b3-list-item--hide-action" draggable="true" data-type="navigation-root" data-path="/">
<span class="b3-list-item__toggle">
<span class="b3-list-item__toggle b3-list-item__toggle--hl">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span>
${emojiHTML}
@ -844,7 +844,7 @@ export class Files extends Model {
data-node-id="${item.id}" data-name="${Lute.EscapeHTMLStr(item.name)}" draggable="true" data-count="${item.subFileCount}"
data-type="navigation-file"
class="b3-list-item b3-list-item--hide-action" data-path="${item.path}">
<span style="padding-left: ${(item.path.split("/").length - 1) * 16}px" class="b3-list-item__toggle b3-list-item__toggle--hl${item.subFileCount === 0 ? " fn__hidden" : ""}">
<span style="padding-left: ${(item.path.split("/").length - 2) * 18 + 22}px" class="b3-list-item__toggle b3-list-item__toggle--hl${item.subFileCount === 0 ? " fn__hidden" : ""}">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span>
<span class="b3-list-item__icon b3-tooltips b3-tooltips__n" aria-label="${window.siyuan.languages.changeIcon}">${unicode2Emoji(item.icon || (item.subFileCount === 0 ? Constants.SIYUAN_IMAGE_FILE : Constants.SIYUAN_IMAGE_FOLDER))}</span>

2
app/src/mobile/util/MobileFiles.ts
View file

@ -722,7 +722,7 @@ export class MobileFiles extends Model {
return `<li data-node-id="${item.id}" data-name="${Lute.EscapeHTMLStr(item.name)}" draggable="true"
data-type="navigation-file"
class="b3-list-item" data-path="${item.path}">
<span style="padding-left: ${(item.path.split("/").length - 1) * 16}px" class="b3-list-item__toggle${item.subFileCount === 0 ? " fn__hidden" : ""}">
<span style="padding-left: ${(item.path.split("/").length - 2) * 18 + 22}px" class="b3-list-item__toggle${item.subFileCount === 0 ? " fn__hidden" : ""}">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span>
<span class="b3-list-item__icon">${unicode2Emoji(item.icon || (item.subFileCount === 0 ? Constants.SIYUAN_IMAGE_FILE : Constants.SIYUAN_IMAGE_FOLDER))}</span>

11
app/src/util/Tree.ts
View file

@ -64,16 +64,17 @@ export class Tree {
} else if (item.type === "tag") {
iconHTML = '<svg class="b3-list-item__graphic"><use xlink:href="#iconTags"></use></svg>';
} else if (item.type === "backlink") {
titleTip= ` title="${item.hPath}"`;
titleTip = ` title="${item.hPath}"`;
iconHTML = `<svg class="b3-list-item__graphic popover__block" data-id="${item.id}"><use xlink:href="#${getIconByType(item.nodeType, item.subType)}"></use></svg>`;
} else if (item.type === "outline") {
titleTip= ` title="${Lute.EscapeHTMLStr(Lute.BlockDOM2Content(item.name))}"`;
titleTip = ` title="${Lute.EscapeHTMLStr(Lute.BlockDOM2Content(item.name))}"`;
iconHTML = `<svg class="b3-list-item__graphic popover__block" data-id="${item.id}"><use xlink:href="#${getIconByType(item.nodeType, item.subType)}"></use></svg>`;
}
let countHTML = "";
if (item.count) {
countHTML = `<span class="counter">${item.count}</span>`;
}
const hasChild = (item.children && item.children.length > 0) || (item.blocks && item.blocks.length > 0)
html += `<li class="b3-list-item"
${(item.nodeType !== "NodeDocument" && item.type === "backlink") ? 'draggable="true"' : ""}
${item.id ? 'data-node-id="' + item.id + '"' : ""}
@ -81,8 +82,8 @@ data-treetype="${item.type}"
data-type="${item.nodeType}"
data-subtype="${item.subType}"
${item.label ? "data-label='" + item.label + "'" : ""}>
<span style="padding-left: ${item.depth * 16}px" class="b3-list-item__toggle">
<svg data-id="${encodeURIComponent(item.name + item.depth)}" class="b3-list-item__arrow ${((item.children && item.children.length > 0) || (item.blocks && item.blocks.length > 0)) ? "b3-list-item__arrow--open" : (item.type === "backlink" ? "" : "fn__hidden")}"><use xlink:href="#iconRight"></use></svg>
<span style="padding-left: ${(item.depth - 1) * 18 + 22}px;margin-right: 2px" class="b3-list-item__toggle${(item.type === "backlink" || hasChild) ? " b3-list-item__toggle--hl" : ""}">
<svg data-id="${encodeURIComponent(item.name + item.depth)}" class="b3-list-item__arrow ${hasChild ? "b3-list-item__arrow--open" : (item.type === "backlink" ? "" : "fn__hidden")}"><use xlink:href="#iconRight"></use></svg>
</span>
${iconHTML}
<span class="b3-list-item__text"${titleTip}>${item.name}</span>
@ -127,7 +128,7 @@ data-type="${item.type}"
data-subtype="${item.subType}"
data-treetype="${type}"
data-def-path="${item.defPath}">
<span style="padding-left: ${item.depth * 16}px" class="b3-list-item__toggle">
<span style="padding-left: ${(item.depth - 1) * 18 + 22}px;margin-right: 2px" class="b3-list-item__toggle${item.children ? " b3-list-item__toggle--hl" : ""}">
<svg data-id="${item.id}" class="b3-list-item__arrow${item.children ? "" : " fn__hidden"}"><use xlink:href="#iconRight"></use></svg>
</span>
${iconHTML}

16
app/src/util/history.ts
View file

@ -58,14 +58,14 @@ const renderDoc = (element: HTMLElement, currentPage: number) => {
}
let logsHTML = "";
response.data.histories.forEach((item: { items: { path: string, title: string }[], hCreated: string }, index: number) => {
logsHTML += `<li class="b3-list-item" data-type="toggle" style="padding-left: 0">
<span style="padding-left: 8px" class="b3-list-item__toggle"><svg class="b3-list-item__arrow${index === 0 ? " b3-list-item__arrow--open" : ""}${item.items.length > 0 ? "" : " fn__hidden"}"><use xlink:href="#iconRight"></use></svg></span>
<span class="b3-list-item__text">${item.hCreated}</span>
logsHTML += `<li class="b3-list-item" data-type="toggle">
<span class="b3-list-item__toggle b3-list-item__toggle--hl"><svg class="b3-list-item__arrow${index === 0 ? " b3-list-item__arrow--open" : ""}${item.items.length > 0 ? "" : " fn__hidden"}"><use xlink:href="#iconRight"></use></svg></span>
<span style="padding-left: 4px" class="b3-list-item__text">${item.hCreated}</span>
</li>`;
if (item.items.length > 0) {
logsHTML += `<ul class="${index === 0 ? "" : "fn__none"}">`;
item.items.forEach((docItem) => {
logsHTML += `<li title="${escapeHtml(docItem.title)}" data-type="${typeElement.value === "1" ? "assets" : "doc"}" data-path="${docItem.path}" class="b3-list-item b3-list-item--hide-action" style="padding-left: 32px">
logsHTML += `<li title="${escapeHtml(docItem.title)}" data-type="${typeElement.value === "1" ? "assets" : "doc"}" data-path="${docItem.path}" class="b3-list-item b3-list-item--hide-action" style="padding-left: 44px">
<span class="b3-list-item__text">${escapeHtml(docItem.title)}</span>
<span class="fn__space"></span>
<span class="b3-list-item__action b3-tooltips b3-tooltips__w" data-type="rollback" aria-label="${window.siyuan.languages.rollback}">
@ -179,14 +179,14 @@ const renderRmNotebook = (element: HTMLElement) => {
}
let logsHTML = "";
response.data.histories.forEach((item: { items: { path: string, title: string }[], hCreated: string }, index: number) => {
logsHTML += `<li class="b3-list-item" style="padding-left: 0" data-type="toggle">
<span style="padding-left: 8px" class="b3-list-item__toggle"><svg class="b3-list-item__arrow${index === 0 ? " b3-list-item__arrow--open" : ""}${item.items.length > 0 ? "" : " fn__hidden"}"><use xlink:href="#iconRight"></use></svg></span>
<span class="b3-list-item__text">${item.hCreated}</span>
logsHTML += `<li class="b3-list-item" data-type="toggle">
<span class="b3-list-item__toggle b3-list-item__toggle"><svg class="b3-list-item__arrow${index === 0 ? " b3-list-item__arrow--open" : ""}${item.items.length > 0 ? "" : " fn__hidden"}"><use xlink:href="#iconRight"></use></svg></span>
<span style="padding-left: 4px" class="b3-list-item__text">${item.hCreated}</span>
</li>`;
if (item.items.length > 0) {
logsHTML += `<ul class="${index === 0 ? "" : "fn__none"}">`;
item.items.forEach((docItem) => {
logsHTML += `<li data-type="notebook" data-path="${docItem.path}" class="b3-list-item" style="padding-left: 32px">
logsHTML += `<li data-type="notebook" data-path="${docItem.path}" class="b3-list-item" style="padding-left: 44px">
<span class="b3-list-item__text">${escapeHtml(docItem.title)}</span>
<span class="fn__space"></span>
<span class="b3-list-item__action" data-type="rollback">