diff --git a/CHANGELOG.md b/CHANGELOG.md index 546ada2..f791279 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,9 @@ # 更改日志 | CHANGE LOG +## 2023-07-08 + +- 新增列表看板视图 | Add list kanban view. + ## 2023-07-07 - 新增列表表格视图 | Add list table view. diff --git a/workspace/plugins/custom-block/public/i18n/en_US.json b/workspace/plugins/custom-block/public/i18n/en_US.json index 9df84b4..b46b8ed 100644 --- a/workspace/plugins/custom-block/public/i18n/en_US.json +++ b/workspace/plugins/custom-block/public/i18n/en_US.json @@ -4,6 +4,9 @@ "custom-block-fullscreen": { "label": "Full-screen Display" }, + "custom-block-list-view-board": { + "label": "List - Kanban View" + }, "custom-block-list-view-default": { "label": "List - Default View" }, diff --git a/workspace/plugins/custom-block/public/i18n/zh_CHT.json b/workspace/plugins/custom-block/public/i18n/zh_CHT.json index 29a60be..6b32b66 100644 --- a/workspace/plugins/custom-block/public/i18n/zh_CHT.json +++ b/workspace/plugins/custom-block/public/i18n/zh_CHT.json @@ -4,11 +4,14 @@ "custom-block-fullscreen": { "label": "全屏顯示" }, + "custom-block-list-view-board": { + "label": "列表-看板視圖" + }, "custom-block-list-view-default": { "label": "列表-默認視圖" }, "custom-block-list-view-map": { - "label": "列表-腦圖視圖" + "label": "列表-導圖視圖" }, "custom-block-list-view-table": { "label": "列表-表格視圖" diff --git a/workspace/plugins/custom-block/public/i18n/zh_CN.json b/workspace/plugins/custom-block/public/i18n/zh_CN.json index ce3c2fd..cb05918 100644 --- a/workspace/plugins/custom-block/public/i18n/zh_CN.json +++ b/workspace/plugins/custom-block/public/i18n/zh_CN.json @@ -4,11 +4,14 @@ "custom-block-fullscreen": { "label": "全屏显示" }, + "custom-block-list-view-board": { + "label": "列表-看板视图" + }, "custom-block-list-view-default": { "label": "列表-默认视图" }, "custom-block-list-view-map": { - "label": "列表-脑图视图" + "label": "列表-导图视图" }, "custom-block-list-view-table": { "label": "列表-表格视图" diff --git a/workspace/plugins/custom-block/src/configs/default.ts b/workspace/plugins/custom-block/src/configs/default.ts index c9d6cfd..8c56264 100644 --- a/workspace/plugins/custom-block/src/configs/default.ts +++ b/workspace/plugins/custom-block/src/configs/default.ts @@ -414,5 +414,28 @@ export const DEFAULT_CONFIG: IConfig = { }, ], }, + { // 列表-看板视图 + id: "custom-block-list-view-board", + enable: true, + mode: MenuItemMode.button, + multi: true, + icon: "iconSplitLR", + accelerator: "list-view: board", + token: "list-view-board", + type: { + default: { enable: false }, + [sdk.siyuan.NodeType.NodeDocument]: { enable: true }, + [sdk.siyuan.NodeType.NodeList]: { enable: true }, + }, + tasks: [ + { + type: TaskType.update, + params: { + name: "custom-block-list-view", + value: "board", + }, + }, + ], + }, ], }; diff --git a/workspace/plugins/custom-block/src/styles/custom-block-list-view-board.less b/workspace/plugins/custom-block/src/styles/custom-block-list-view-board.less new file mode 100644 index 0000000..d762dda --- /dev/null +++ b/workspace/plugins/custom-block/src/styles/custom-block-list-view-board.less @@ -0,0 +1,98 @@ +// Copyright (C) 2023 Zuoqiu Yingyi +// +// This program is free software: you can redistribute it and/or modify +// it under the terms of the GNU Affero General Public License as +// published by the Free Software Foundation, either version 3 of the +// License, or (at your option) any later version. +// +// This program is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU Affero General Public License for more details. +// +// You should have received a copy of the GNU Affero General Public License +// along with this program. If not, see . + +/** + * 列表转看板 + * REF [notion-theme/list2board.css](https://github.com/royc01/notion-theme/blob/main/style/list2board.css) + */ + +// 循环 +// REF [Less 循环 - 知乎](https://zhuanlan.zhihu.com/p/192364861) +.loop(@base, @i) when (@i > 0) { + .loop(@base, (@i - 1)); // 递归调用自身 + .board-background-color(e("@{base}n + @{i}"), @i); +} + +// 字看板标题背景颜色 +.board-background-color(@nth, @index) { + &:nth-child(@{nth}) { + >.protyle-action { + // display: none; + visibility: hidden; + } + + >[data-node-id]:not(.list) { + margin-left: 0 !important; + border-radius: var(--custom-block-border-radius); + background-color: var(e(%("--b3-font-background%d", @index))); + } + } +} + +:root { + &[plugin-custom-block~=list-view-board] { + + .b3-dialog__content, + .protyle-content { + + [custom-block-list-view=board] { + + // 为列表块设置块属性 + &, + // 为文档块设置块属性 + >[data-node-index] { + &[data-node-id].list { + /* 看板块样式 */ + display: flex; + overflow-x: auto; + + >[data-node-id].li { + /* 子看板 */ + min-width: var(--custom-block-list-board-min-width); + margin-left: 0.25em; + margin-right: 0.25em; + + &[fold="1"] { + >[data-node-id]:not(.list) { + outline: 2px dashed; + } + } + + .loop(12, 12); + + &::before { + /* 子看板列表辅助线 */ + content: unset; + } + + >[data-node-id].list { + /* 子看板内容 */ + margin-left: 0 !important; + padding-left: 0 !important; + + >[data-node-id].li { + /* 子看板项 */ + margin-top: 0.5em; + border-radius: var(--custom-block-border-radius); + background-color: var(--b3-font-background5); + } + } + } + } + } + } + } + } +} diff --git a/workspace/plugins/custom-block/src/styles/custom-block-list-view-map.less b/workspace/plugins/custom-block/src/styles/custom-block-list-view-map.less index fce9c5e..e4bdb4c 100644 --- a/workspace/plugins/custom-block/src/styles/custom-block-list-view-map.less +++ b/workspace/plugins/custom-block/src/styles/custom-block-list-view-map.less @@ -13,6 +13,11 @@ // You should have received a copy of the GNU Affero General Public License // along with this program. If not, see . +/** + * 列表转导图 + * REF [royc01/notion-theme](https://github.com/royc01/notion-theme/blob/c5e535a8f40a97c1d42384a7715ced88261dd59f/theme.css#L1444-L1577) + */ + // 高度 @height: calc(50% - var(--custom-block-list-guides-line-width) / 2); diff --git a/workspace/plugins/custom-block/src/styles/custom-block-list-view-table.less b/workspace/plugins/custom-block/src/styles/custom-block-list-view-table.less index 702441f..22f2ca5 100644 --- a/workspace/plugins/custom-block/src/styles/custom-block-list-view-table.less +++ b/workspace/plugins/custom-block/src/styles/custom-block-list-view-table.less @@ -79,7 +79,7 @@ margin-right: 0.5em; align-items: center; display: flex; - min-width: 128px; + min-width: var(--custom-block-list-view-table-min-width); text-align: justify; flex-shrink: 0; } diff --git a/workspace/plugins/custom-block/src/styles/define.less b/workspace/plugins/custom-block/src/styles/define.less index 7790129..54c7f5a 100644 --- a/workspace/plugins/custom-block/src/styles/define.less +++ b/workspace/plugins/custom-block/src/styles/define.less @@ -27,7 +27,13 @@ --custom-block-list-guides-line-width: 2px; /* 圆角直径 */ - --custom-block-border-radius: 8px; + --custom-block-border-radius: 4px; + + /* 列表看板视图 - 看板项最小宽度 */ + --custom-block-list-board-min-width: 24%; + + /* 列表表格视图 - 表格项最小宽度 */ + --custom-block-list-view-table-min-width: 8em; } /* 弹幕滚动动画 */ diff --git a/workspace/plugins/custom-block/src/styles/index.less b/workspace/plugins/custom-block/src/styles/index.less index d0c139c..e8dd822 100644 --- a/workspace/plugins/custom-block/src/styles/index.less +++ b/workspace/plugins/custom-block/src/styles/index.less @@ -15,6 +15,7 @@ @import (once) url(./define.less); +@import (once) url(./custom-block-list-view-board.less); @import (once) url(./custom-block-list-view-map.less); @import (once) url(./custom-block-list-view-table.less); @import (once) url(./custom-block-render-content.less);