VSCode主题下背景色设置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

:root {
    --b3-font-background1: #423a3a !important;
    --b3-font-background2: #4b3722 !important;
    --b3-font-background3: #203854c2 !important;
    --b3-font-background4: #2c5438a3 !important;
    --b3-font-background5: #4c525778 !important;
    --b3-font-background6: #1b3f758a !important;
    --b3-font-background7: #664a1c73 !important;
    --b3-font-background8: #5b1d1770 !important;
    --b3-font-background9: #541b3594 !important;
    --b3-font-background10: #6b2f6b70 !important;
    --b3-font-background11: #2f4c264f!important;
    --b3-font-background12: #72390f54 !important;
    --b3-font-background13: #3c3c3cd9 !important;
}

适用Savor的自定义文字颜色

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
:root{
    --b3-font-color1: #000;
    --b3-font-color2: rgba(105, 64, 165) !important;
    --b3-font-color3: rgb(100, 71, 58);
    --b3-font-color4: rgb(217, 115, 13);
    --b3-font-color5: #f5822e;
    --b3-font-color6: rgb(223, 171, 1);
    --b3-font-color7: #65b84d;
    --b3-font-color8: rgb(15, 123, 108);
    --b3-font-color9: #2972f4 !important;
    --b3-font-color10: rgb(105, 64, 165);
    --b3-font-color11: rgb(173, 26, 114);
    --b3-font-color12: rgb(224, 62, 62);
    --b3-font-color13: #e81123;
    
    --b3-font-background1: #fbbfbc !important;
    --b3-font-background2: #fed4a4 !important;
    --b3-font-background3: #ffe9a1 !important;
    --b3-font-background4: #b7edb1 !important;
    --b3-font-background5: #d1ecf1 !important;
    --b3-font-background6: #bacefd !important;
    --b3-font-background7: #cdb2fa !important;
    --b3-font-background8: #e1e1e1 !important;
    --b3-font-background9: #fae1de !important;
    --b3-font-background10: rgb(221, 235, 241);
    --b3-font-background11: rgb(234, 228, 242);
    --b3-font-background12: rgb(244, 223, 235);
    --b3-font-background13: rgb(251, 228, 228);

    /* 卡片背景 */
    --b3-card-error-color: rgb(97, 26, 21);
    --b3-card-error-background: rgb(238, 213, 210) !important;
    --b3-card-warning-color: rgb(102, 60, 0);
    --b3-card-warning-background: rgb(243, 225, 200) !important;
    --b3-card-info-color: rgb(13, 60, 97);
    --b3-card-info-background: rgb(204, 223, 237) !important;
    --b3-card-success-color: rgb(30, 70, 32);
    --b3-card-success-background: rgb(217, 239, 217) !important;

    /*数据库*/
    --S-font-color13: rgb(93, 23, 21);
    --S-font-color12: rgb(76, 35, 55);
    --S-font-color11: rgb(65, 36, 84);
    --S-font-color10: rgb(24, 51, 71);
    --S-font-color9: rgb(24, 51, 71);
    --S-font-color8: rgb(28, 56, 41);
    --S-font-color7: rgb(64, 44, 27);
    --S-font-color6: rgb(73, 41, 14);
    --S-font-color5: rgb(73, 41, 14);
    --S-font-color4: rgb(50, 48, 44);
    --S-font-color3: rgb(50, 48, 44);
    --S-font-color2: rgb(50, 48, 44);
    --S-font-color1: rgb(50, 48, 44);

    .custom-attr__avvalue .b3-chip[style*="color1)"],.av__cell .b3-chip[style*="color1)"],.av__panel .b3-chip[style*="color1)"],[data-name="av-col-option"] .color__square[style*="color1)"],.b3-menu__label .b3-chip[data-color="1"]{
        background-color:#FFC3D3!important;
        color:var(--S-font-color13)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color2)"],.av__cell .b3-chip[style*="color2)"],.av__panel .b3-chip[style*="color2)"],[data-name="av-col-option"] .color__square[style*="color2)"],.b3-menu__label .b3-chip[data-color="2"]{
        background-color:#FFD18D!important;
        color:var(--S-font-color12)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color3)"],.av__cell .b3-chip[style*="color3)"],.av__panel .b3-chip[style*="color3)"],[data-name="av-col-option"] .color__square[style*="color3)"],.b3-menu__label .b3-chip[data-color="3"]{
        background-color:#FDE57A!important;
        color:var(--S-font-color11)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color4)"],.av__cell .b3-chip[style*="color4)"],.av__panel .b3-chip[style*="color4)"],[data-name="av-col-option"] .color__square[style*="color4)"],.b3-menu__label .b3-chip[data-color="4"]{
        background-color:#A7FDB4!important;
        color:var(--S-font-color10)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color5)"],.av__cell .b3-chip[style*="color5)"],.av__panel .b3-chip[style*="color5)"],[data-name="av-col-option"] .color__square[style*="color5)"],.b3-menu__label .b3-chip[data-color="5"]{
        background-color:#A3F4FF!important;
        color:var(--S-font-color9)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color6)"],.av__cell .b3-chip[style*="color6)"],.av__panel .b3-chip[style*="color6)"],[data-name="av-col-option"] .color__square[style*="color6)"],.b3-menu__label .b3-chip[data-color="6"]{
        background-color:#BDE2FF!important;
        color:var(--S-font-color8)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color7)"],.av__cell .b3-chip[style*="color7)"],.av__panel .b3-chip[style*="color7)"],[data-name="av-col-option"] .color__square[style*="color7)"],.b3-menu__label .b3-chip[data-color="7"]{
        background-color:var(--b3-font-background7)!important;
        color:var(--S-font-color7)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color8)"],.av__cell .b3-chip[style*="color8)"],.av__panel .b3-chip[style*="color8)"],[data-name="av-col-option"] .color__square[style*="color8)"],.b3-menu__label .b3-chip[data-color="8"]{
        background-color:var(--b3-font-background6)!important;
        color:var(--S-font-color6)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color9)"],.av__cell .b3-chip[style*="color9)"],.av__panel .b3-chip[style*="color9)"],[data-name="av-col-option"] .color__square[style*="color9)"],.b3-menu__label .b3-chip[data-color="9"]{
        background-color:var(--b3-font-background5)!important;
        color:var(--S-font-color5)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color10)"],.av__cell .b3-chip[style*="color10)"],.av__panel .b3-chip[style*="color10)"],[data-name="av-col-option"] .color__square[style*="color10)"],.b3-menu__label .b3-chip[data-color="10"]{
        background-color:var(--b3-font-background4)!important;
        color:var(--S-font-color4)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color11)"],.av__cell .b3-chip[style*="color11)"],.av__panel .b3-chip[style*="color11)"],[data-name="av-col-option"] .color__square[style*="color11)"],.b3-menu__label .b3-chip[data-color="11"]{
        background-color:var(--b3-font-background3)!important;
        color:var(--S-font-color3)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color12)"],.av__cell .b3-chip[style*="color12)"],.av__panel .b3-chip[style*="color12)"],[data-name="av-col-option"] .color__square[style*="color12)"],.b3-menu__label .b3-chip[data-color="12"]{
        background-color:var(--b3-font-background2)!important;
        color:var(--S-font-color2)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color13)"],.av__cell .b3-chip[style*="color13)"],.av__panel .b3-chip[style*="color13)"],[data-name="av-col-option"] .color__square[style*="color13)"],.b3-menu__label .b3-chip[data-color="13"]{
        background-color:transparent!important;
        color:var(--S-font-color1)!important;
    }
}

/* 文字颜色修改 */
[style*="color:var(--b3-font-color2)"], [style*="color: var(--b3-font-color2)"] {
    border-bottom: 3px dashed;
}

/* 黄色邮票 */
[style*="color:var(--b3-font-color3)"], [style*="color: var(--b3-font-color3)"] {
    border-radius: 3px;
    padding: 0em 0.3em;
    border-color: inherit;
    border-width: 2px;
    border-style: dashed;
    background-color: rgb(255, 235, 205);
    color: rgb(0, 0, 0);   
}
适用于Savor主题Sugar配色 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
:root{
	--b3-font-color1: #000;
    --b3-font-color2: rgba(105, 64, 165) !important;
    --b3-font-color3: rgb(100, 71, 58);
	--b3-font-color4: rgb(217, 115, 13);
    --b3-font-color5: #f5822e;
	--b3-font-color6: rgb(223, 171, 1);
    --b3-font-color7: #65b84d;
	--b3-font-color8: rgb(15, 123, 108);
    --b3-font-color9: #0023ff !important;
    --b3-font-color10: rgb(105, 64, 165);
    --b3-font-color11: rgb(173, 26, 114);
    --b3-font-color12: rgb(224, 62, 62);
    --b3-font-color13: #e81123;
    
	--b3-font-background1: #fbbfbc !important;
    --b3-font-background2: #fed4a4 !important;
    --b3-font-background3: #ffe9a1 !important;
    --b3-font-background4: #b7edb1 !important;
	--b3-font-background5: #d1ecf1 !important;
    --b3-font-background6: #bacefd !important;
    --b3-font-background7: #cdb2fa !important;
	--b3-font-background8: #e1e1e1 !important;
    --b3-font-background9: #fae1de !important;
    --b3-font-background10: rgb(221, 235, 241);
    --b3-font-background11: rgb(234, 228, 242);
    --b3-font-background12: rgb(244, 223, 235);
    --b3-font-background13: rgb(251, 228, 228);

    /* 卡片背景 */
    --b3-card-error-color: rgb(97, 26, 21);
    --b3-card-error-background: rgb(238, 213, 210) !important;
    --b3-card-warning-color: rgb(102, 60, 0);
    --b3-card-warning-background: rgb(243, 225, 200) !important;
    --b3-card-info-color: rgb(13, 60, 97);
    --b3-card-info-background: rgb(204, 223, 237) !important;
    --b3-card-success-color: rgb(30, 70, 32);
    --b3-card-success-background: rgb(217, 239, 217) !important;

    /*数据库*/
	--S-font-color13: rgb(93, 23, 21);
	--S-font-color12: rgb(76, 35, 55);
	--S-font-color11: rgb(65, 36, 84);
	--S-font-color10: rgb(24, 51, 71);
	--S-font-color9: rgb(24, 51, 71);
	--S-font-color8: rgb(28, 56, 41);
	--S-font-color7: rgb(64, 44, 27);
	--S-font-color6: rgb(73, 41, 14);
	--S-font-color5: rgb(73, 41, 14);
	--S-font-color4: rgb(50, 48, 44);
	--S-font-color3: rgb(50, 48, 44);
	--S-font-color2: rgb(50, 48, 44);
	--S-font-color1: rgb(50, 48, 44);

    .custom-attr__avvalue .b3-chip[style*="color1)"],.av__cell .b3-chip[style*="color1)"],.av__panel .b3-chip[style*="color1)"],[data-name="av-col-option"] .color__square[style*="color1)"],.b3-menu__label .b3-chip[data-color="1"]{
        background-color:#FFC3D3!important;
        color:var(--S-font-color13)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color2)"],.av__cell .b3-chip[style*="color2)"],.av__panel .b3-chip[style*="color2)"],[data-name="av-col-option"] .color__square[style*="color2)"],.b3-menu__label .b3-chip[data-color="2"]{
        background-color:#FFD18D!important;
        color:var(--S-font-color12)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color3)"],.av__cell .b3-chip[style*="color3)"],.av__panel .b3-chip[style*="color3)"],[data-name="av-col-option"] .color__square[style*="color3)"],.b3-menu__label .b3-chip[data-color="3"]{
        background-color:#FDE57A!important;
        color:var(--S-font-color11)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color4)"],.av__cell .b3-chip[style*="color4)"],.av__panel .b3-chip[style*="color4)"],[data-name="av-col-option"] .color__square[style*="color4)"],.b3-menu__label .b3-chip[data-color="4"]{
        background-color:#A7FDB4!important;
        color:var(--S-font-color10)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color5)"],.av__cell .b3-chip[style*="color5)"],.av__panel .b3-chip[style*="color5)"],[data-name="av-col-option"] .color__square[style*="color5)"],.b3-menu__label .b3-chip[data-color="5"]{
        background-color:#A3F4FF!important;
        color:var(--S-font-color9)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color6)"],.av__cell .b3-chip[style*="color6)"],.av__panel .b3-chip[style*="color6)"],[data-name="av-col-option"] .color__square[style*="color6)"],.b3-menu__label .b3-chip[data-color="6"]{
        background-color:#BDE2FF!important;
        color:var(--S-font-color8)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color7)"],.av__cell .b3-chip[style*="color7)"],.av__panel .b3-chip[style*="color7)"],[data-name="av-col-option"] .color__square[style*="color7)"],.b3-menu__label .b3-chip[data-color="7"]{
        background-color:var(--b3-font-background7)!important;
        color:var(--S-font-color7)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color8)"],.av__cell .b3-chip[style*="color8)"],.av__panel .b3-chip[style*="color8)"],[data-name="av-col-option"] .color__square[style*="color8)"],.b3-menu__label .b3-chip[data-color="8"]{
        background-color:var(--b3-font-background6)!important;
        color:var(--S-font-color6)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color9)"],.av__cell .b3-chip[style*="color9)"],.av__panel .b3-chip[style*="color9)"],[data-name="av-col-option"] .color__square[style*="color9)"],.b3-menu__label .b3-chip[data-color="9"]{
        background-color:var(--b3-font-background5)!important;
        color:var(--S-font-color5)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color10)"],.av__cell .b3-chip[style*="color10)"],.av__panel .b3-chip[style*="color10)"],[data-name="av-col-option"] .color__square[style*="color10)"],.b3-menu__label .b3-chip[data-color="10"]{
        background-color:var(--b3-font-background4)!important;
        color:var(--S-font-color4)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color11)"],.av__cell .b3-chip[style*="color11)"],.av__panel .b3-chip[style*="color11)"],[data-name="av-col-option"] .color__square[style*="color11)"],.b3-menu__label .b3-chip[data-color="11"]{
        background-color:var(--b3-font-background3)!important;
        color:var(--S-font-color3)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color12)"],.av__cell .b3-chip[style*="color12)"],.av__panel .b3-chip[style*="color12)"],[data-name="av-col-option"] .color__square[style*="color12)"],.b3-menu__label .b3-chip[data-color="12"]{
        background-color:var(--b3-font-background2)!important;
        color:var(--S-font-color2)!important;
    }
    .custom-attr__avvalue .b3-chip[style*="color13)"],.av__cell .b3-chip[style*="color13)"],.av__panel .b3-chip[style*="color13)"],[data-name="av-col-option"] .color__square[style*="color13)"],.b3-menu__label .b3-chip[data-color="13"]{
        background-color:transparent!important;
        color:var(--S-font-color1)!important;
    }
}

/* 文字颜色修改 */
[style*="color:var(--b3-font-color2)"], [style*="color: var(--b3-font-color2)"] {
    border-bottom: 3px dashed;
}

/* 黄色邮票 */
[style*="color:var(--b3-font-color3)"], [style*="color: var(--b3-font-color3)"] {
    border-radius: 3px;
    padding: 0em 0.3em;
    border-color: inherit;
    border-width: 2px;
    border-style: dashed;
    background-color: rgb(255, 235, 205);
    color: rgb(0, 0, 0);   
}

/* 引用快外观 */
.protyle-wysiwyg [data-node-id] {
    border-radius: 10px;
}

文字加粗颜色

1
2
3
4
.b3-typography strong, .b3-typography span[data-type~=strong], .protyle-wysiwyg strong, .protyle-wysiwyg span[data-type~=strong] {
    font-weight: 500;
    color: #73a6ff;
}

引用块美化

1
2
3
4
5
6
.b3-typography blockquote, .b3-typography .bq, .protyle-wysiwyg blockquote, .protyle-wysiwyg .bq {
    padding: 4px;
    border-left: 0.25em solid #0b960e !important;
    background-color: var(--b3-list-hover);
    margin: 4px 0;
}

底部栏颜色

1
2
3
4
5
6
7
8
9
10
.status {
    background-color: #3C3C3C;
}

.status * {
    color: #Dadada;
    font-size: 14px;
    font-weight: 600;
    font-family: 'Cascadia Mono', 'Cascadia Code', 'Microsoft YaHei UI';
}

网址链接

1
2
3
4
.protyle-wysiwyg [data-node-id] span[data-type~=a] {
    color: #7badff;
    border-bottom: 1px solid var(--b3-border-color);
}

题头图

1
2
3
.protyle-background__img {
opacity:1 !important;
}

引用快字体颜色

1
2
3
4
5
6
7
.b3-typography blockquote, .b3-typography .bq, .protyle-wysiwyg blockquote, .protyle-wysiwyg .bq {
    padding: 4px;
    color: #DADADA !important;
    border-left: 0.25em solid #0b960e !important;
    background-color: var(--b3-list-hover);
    margin: 4px 0;
}

修改图片亮度

1
2
3
4
5
6
7
8
9
10
11
.b3-typography .img, .protyle-wysiwyg .img {
    display: inline-block;
    text-align: center;
    vertical-align: top;
    margin: 0 auto;
    max-width: 100%;
    user-select: none;
    word-break: keep-all;
    white-space: nowrap;
    filter: brightness(0.75);
}

大纲字体大小

1
2
3
.fn__flex-column.layout__dockr .file-tree {
  font-size: 13px !important;
}

代码块字体样式

1
2
3
4
5
6
7
.b3-typography .hljs, .protyle-wysiwyg .hljs {
    font-family: Consolas !important;
}

.hljs-comment {
    font-size: 13px;
}

钉住的同时显示 icon 和标题 CSS 片段

1
2
3
4
5
6
/* 钉住的同时显示 icon 和标题 CSS片段 */
.layout-tab-bar .item.item--pin .item__text {
    width: auto;
    max-width: none;
    display: flex !important;
}

类似 logseq 的层次子弹线 CSS 片段

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
/* 类似 logseq 的层次子弹线 CSS片段 */
/* REF https://github.com/svchord/Rem-Craft */
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>.protyle-action{
    color:rgb(70, 110, 220);;
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>.protyle-action svg{
    margin:0;
    width:16px;
    height:16px;
    padding:0px 0px
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>.list:has(.block-focus)>.li::after{
    content:"";
    display:block;
    position:absolute;
    pointer-events:none;
    width:34px;
    left:-18px;
    top:-20px;
    border-style:solid;
    border-color:rgb(70, 110, 220);;
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>.list:has(.block-focus)>.li:not(:has(.block-focus))::after{
    bottom:-2px;
    border-width:0 0 0 2px
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>.list:has(.block-focus)>.li:has(.block-focus)::after{
    height:38px;
    border-radius:0 0 0 8px;
    border-width:0 0 2px 2px
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>.list:has(.block-focus)>.li:has(.block-focus)~.li:not(:has(.block-focus))::after{
    border-color:rgba(0,0,0,0)
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>.list:has(.block-focus)>.li[data-subtype=o]::after{
    width:24px
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>.list:has(.block-focus)>.li[data-subtype=t]::after{
    width:28px
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>[data-node-id]::after{
    content:"";
    display:block;
    position:absolute;
    pointer-events:none;
    width:34px;
    left:-18px;
    top:-20px;
    border-style:solid;
    border-color:rgb(70, 110, 220);
    top:20px;
    height:calc(100% + 4px);
    border-width:0 0 0 2px
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>[data-node-id]:has(+.list)::after{
    height:auto;
    bottom:0
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>[data-node-id][data-type=NodeHeading]::after{
    top:0;
    height:185%
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)>[data-node-id].list:has(.block-focus)::after,.protyle-wysiwyg [data-node-id].li:has(.block-focus)>[data-node-id].list:has(.block-focus)~[data-node-id]::after,.protyle-wysiwyg [data-node-id].li:has(.block-focus)>[data-node-id].bq:has(.block-focus)::after,.protyle-wysiwyg [data-node-id].li:has(.block-focus)>[data-node-id].bq:has(.block-focus)~[data-node-id]::after,.protyle-wysiwyg [data-node-id].li:has(.block-focus)>[data-node-id].sb:has(.block-focus)::after,.protyle-wysiwyg [data-node-id].li:has(.block-focus)>[data-node-id].sb:has(.block-focus)~[data-node-id]::after{
    border-color:rgba(0,0,0,0)
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)[fold="1"]>[data-node-id]::after,.protyle-wysiwyg [data-node-id].li:has(.block-focus):has(>.block-focus)>[data-node-id]::after{
    border-color:rgba(0,0,0,0)
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)[data-subtype=o]:has(.block-focus)>.list:has(.block-focus)>.li::after{
    top:-10px
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)[data-subtype=o]:has(.block-focus)>.list:has(.block-focus)>.li:has(.block-focus)::after{
    height:28px
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)[data-subtype=t]:has(.block-focus)>.protyle-action{
    color:rgb(70, 110, 220);;
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)[data-subtype=t]:has(.block-focus)>.protyle-action svg{
    margin:0;
    width:14px;
    height:14px;
    padding:0px 0px
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)[data-subtype=t]:has(.block-focus)>.list:has(.block-focus)>.li::after{
    top:-14px
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)[data-subtype=t]:has(.block-focus)>.list:has(.block-focus)>.li:has(.block-focus)::after{
    height:32px
}
.protyle-wysiwyg [data-node-id].li:has(.block-focus)[data-subtype=t]:has(.block-focus).protyle-task--done>.list:has(.block-focus)>.li::after{
    border-color:rgba(139, 139, 139)
}

类似 logseq 的层次子弹线 JS 片段

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
/* 类似 logseq 的层次子弹线 JS片段 */
/**
 * 获得指定块位于的编辑区
 * @params {HTMLElement}
 * @return {HTMLElement} 光标所在块位于的编辑区
 * @return {null} 光标不在块内
 */
function getTargetEditor(block) {
    while (block != null && !block.classList.contains('protyle-wysiwyg')) block = block.parentElement;
    return block;
}

/**
 * 获得焦点所在的块
 * @return {HTMLElement} 光标所在块
 * @return {null} 光标不在块内
 */
function getFocusedBlock() {
    if (document.activeElement.classList.contains('protyle-wysiwyg')) {
        let block = window.getSelection()?.focusNode?.parentElement; // 当前光标
        while (block != null && block.dataset.nodeId == null) block = block.parentElement;
        return block;
    }
}

function focusHandler() {
    /* 获取当前编辑区 */
    let block = getFocusedBlock(); // 当前光标所在块
    /* 当前块已经设置焦点 */
    if (block?.classList.contains(`block-focus`)) return;

    /* 当前块未设置焦点 */
    const editor = getTargetEditor(block); // 当前光标所在块位于的编辑区
    if (editor) {
        editor.querySelectorAll(`.block-focus`).forEach((element) => element.classList.remove(`block-focus`));
        block.classList.add(`block-focus`);
        // setSelector(block);
    }
}

function bulletMain() {
    // 跟踪当前所在块
    window.addEventListener('mouseup', focusHandler, true);
    window.addEventListener('keyup', focusHandler, true);
}

(async () => {
    bulletMain();
    console.log('加载子弹线成功')
})();

去除图片后的多余空行 CSS 片段

1
2
3
4
/* 去除图片后的多余空行 CSS片段 */
.b3-typography .img:not([style]), .protyle-wysiwyg .img:not([style]) {
   display:inline-block;
}

代码块字体设置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
.b3-list-item {
    line-height: 35px !important;
    min-height: 28px;
    padding: 0 4px;
    display: flex;
    cursor: pointer;
    align-items: center;
    position: relative;
    background-color: rgba(0,0,0,0);
    text-align: left;
    border: 0;
    color: var(--b3-theme-on-background);
    margin: 1px 8px;
}

.b3-typography blockquote, .b3-typography .bq, .protyle-wysiwyg blockquote, .protyle-wysiwyg .bq {
    padding: 4px;
    color: black;
    border-left: 0.25em solid #ffffff;
    background-color: var(--b3-list-hover);
    margin: 4px 0;
}

虚线备注

1
2
3
4
5
/* 虚线备注 CSS片段 https://github.com/TCOTC/siyuan-css-dashed-line-memo */
.b3-typography span[data-type~=inline-memo], .protyle-wysiwyg span[data-type~=inline-memo] {
    background-color: transparent;
    border-bottom: 2px dashed var(--b3-theme-primary) !important;
}

隐藏大纲前面的块标记 H

1
2
3
.sy__outline .b3-list-item__graphic {
    display: none;
}

行间距

1
2
3
.protyle-wysiwyg>.p {
 	line-height: 2.3;  /*段落块的行间距，段间距的话前面该改成margin*/
 }

文档树块间距

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
.b3-list-item {
    line-height: 35px !important;
    min-height: 28px;
    padding: 0 4px;
    display: flex;
    cursor: pointer;
    align-items: center;
    position: relative;
    background-color: rgba(0,0,0,0);
    text-align: left;
    border: 0;
    color: var(--b3-theme-on-background);
    margin: 1px 8px;
}

.b3-typography blockquote, .b3-typography .bq, .protyle-wysiwyg blockquote, .protyle-wysiwyg .bq {
    padding: 4px;
    color: black;
    border-left: 0.25em solid #ffffff;
    background-color: var(--b3-list-hover);
    margin: 4px 0;
}

标题居中

1
2
3
.protyle-title__input {
    text-align: center;
}

plugin-custom-fonts-style

1
2
3
4
5
6
7
8
9
10
11
/* Twemoji Mozilla: https://github.com/mozilla/twemoji-colr */
@font-face {
    font-family: "Twemoji Mozilla";
    font-style: normal;
    src: url("plugins/custom-fonts/static/fonts/Twemoji.Mozilla/Twemoji.Mozilla-0.7.0.ttf");
}


:root {
    --b3-font-family-emoji: "Twemoji Mozilla", "Segoe UI Emoji", "Segoe UI Symbol", "Segoe UI", "Apple Color Emoji", "Noto Color Emoji", "Android Emoji";
}