This commit is contained in:
Vanessa 2022-09-02 17:58:52 +08:00
parent f171be138d
commit adc4998973
3 changed files with 50 additions and 34 deletions

View file

@ -18,6 +18,31 @@
list-style: none; list-style: none;
} }
&--border {
ul {
margin-left: 34px;
position: relative;
}
& > ul ul:before {
content: "";
height: 100%;
top: 0;
position: absolute;
border-left: 1px solid var(--b3-theme-background-light);
left: -55px;
}
& > ul li:before {
content: "";
height: 100%;
top: 0;
position: absolute;
border-left: 1px solid var(--b3-theme-background-light);
left: -21px;
}
}
&-item { &-item {
line-height: 28px; line-height: 28px;
padding: 1px 8px; padding: 1px 8px;

View file

@ -261,15 +261,6 @@ progressLoading: 400
} }
.config { .config {
&-keymap__item-name:before{
content:"";
height: 100%;
top: 0;
position: absolute;
border-left: 1px solid var(--b3-theme-background-light);
left: -21px;
}
&-query { &-query {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;

View file

@ -7,12 +7,12 @@ import {exportLayout} from "../layout/util";
export const keymap = { export const keymap = {
element: undefined as Element, element: undefined as Element,
_genItem(keymap: Record<string, IKeymapItem>, left: number, keys: string) { _genItem(keymap: Record<string, IKeymapItem>, keys: string) {
let html = ""; let html = "";
Object.keys(keymap).forEach(key => { Object.keys(keymap).forEach(key => {
if (window.siyuan.languages[key]) { if (window.siyuan.languages[key]) {
html += `<li class="b3-list-item b3-list-item--hide-action" style="margin-left: ${left+10}px"> html += `<li class="b3-list-item b3-list-item--hide-action">
<span class="b3-list-item__text config-keymap__item-name">${window.siyuan.languages[key]}</span> <span class="b3-list-item__text">${window.siyuan.languages[key]}</span>
<span class="fn__space fn__flex-1"></span> <span class="fn__space fn__flex-1"></span>
<input data-key="${keys + Constants.ZWSP + key}" data-value="${keymap[key].custom}" data-default="${keymap[key].default}" class="b3-text-field" value="${updateHotkeyTip(keymap[key].custom)}"> <input data-key="${keys + Constants.ZWSP + key}" data-value="${keymap[key].custom}" data-default="${keymap[key].default}" class="b3-text-field" value="${updateHotkeyTip(keymap[key].custom)}">
<span class="fn__space"></span> <span class="fn__space"></span>
@ -52,56 +52,56 @@ export const keymap = {
<input id="keymapInput" class="b3-form__icon-input b3-text-field fn__block" placeholder="${window.siyuan.languages.search}"> <input id="keymapInput" class="b3-form__icon-input b3-text-field fn__block" placeholder="${window.siyuan.languages.search}">
</label> </label>
<div class="fn__hr"></div> <div class="fn__hr"></div>
<ul class="b3-list b3-list--background"> <ul class="b3-list b3-list--border b3-list--background">
<li class="b3-list-item toggle" style="padding-left: 0"> <li class="b3-list-item toggle">
<span class="b3-list-item__toggle" style="padding-left: 8px"><svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg></span> <span class="b3-list-item__toggle"><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> <span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.general}</span>
</li> </li>
<ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.general, 24, "general")}</ul> <ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.general, "general")}</ul>
</ul> </ul>
<ul class="b3-list b3-list--background"> <ul class="b3-list b3-list--border b3-list--background">
<li class="b3-list-item toggle" style="padding-left: 0"> <li class="b3-list-item toggle">
<span class="b3-list-item__toggle" style="padding-left: 8px"> <span class="b3-list-item__toggle">
<svg class="b3-list-item__arrow b3-list-item__arrow--open"><use xlink:href="#iconRight"></use></svg> <svg class="b3-list-item__arrow b3-list-item__arrow--open"><use xlink:href="#iconRight"></use></svg>
</span> </span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.editor}</span> <span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.editor}</span>
</li> </li>
<ul> <ul>
<li class="b3-list-item toggle" style="padding-left: 0"> <li class="b3-list-item toggle">
<span class="b3-list-item__toggle" style="padding-left: 24px"> <span class="b3-list-item__toggle">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg> <svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span> </span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.general}</span> <span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.general}</span>
</li> </li>
<ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.general, 40, "editor" + Constants.ZWSP + "general")}</ul> <ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.general, "editor" + Constants.ZWSP + "general")}</ul>
<li class="b3-list-item toggle" style="padding-left: 0"> <li class="b3-list-item toggle">
<span class="b3-list-item__toggle" style="padding-left: 24px"> <span class="b3-list-item__toggle">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg> <svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span> </span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.insert}</span> <span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.insert}</span>
</li> </li>
<ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.insert, 40, "editor" + Constants.ZWSP + "insert")}</ul> <ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.insert, "editor" + Constants.ZWSP + "insert")}</ul>
<li class="b3-list-item toggle" style="padding-left: 0"> <li class="b3-list-item toggle">
<span class="b3-list-item__toggle" style="padding-left: 24px"> <span class="b3-list-item__toggle">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg> <svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span> </span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.headings}</span> <span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.headings}</span>
</li> </li>
<ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.heading, 40, "editor" + Constants.ZWSP + "heading")}</ul> <ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.heading, "editor" + Constants.ZWSP + "heading")}</ul>
<li class="b3-list-item toggle" style="padding-left: 0"> <li class="b3-list-item toggle">
<span class="b3-list-item__toggle" style="padding-left: 24px"> <span class="b3-list-item__toggle">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg> <svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span> </span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.list1}</span> <span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.list1}</span>
</li> </li>
<ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.list, 40, "editor" + Constants.ZWSP + "list")}</ul> <ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.list, "editor" + Constants.ZWSP + "list")}</ul>
<li class="b3-list-item toggle" style="padding-left: 0"> <li class="b3-list-item toggle">
<span class="b3-list-item__toggle" style="padding-left: 24px"> <span class="b3-list-item__toggle">
<svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg> <svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span> </span>
<span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.table}</span> <span class="b3-list-item__text ft__on-surface">${window.siyuan.languages.table}</span>
</li> </li>
<ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.table, 40, "editor" + Constants.ZWSP + "table")}</ul> <ul class="fn__none">${keymap._genItem(window.siyuan.config.keymap.editor.table, "editor" + Constants.ZWSP + "table")}</ul>
</ul> </ul>
</ul> </ul>
</div>`; </div>`;