惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

雷峰网
雷峰网
T
The Blog of Author Tim Ferriss
WordPress大学
WordPress大学
V
V2EX
Jina AI
Jina AI
S
Schneier on Security
Cyberwarzone
Cyberwarzone
cs.CV updates on arXiv.org
cs.CV updates on arXiv.org
PCI Perspectives
PCI Perspectives
美团技术团队
小众软件
小众软件
L
LangChain Blog
N
Netflix TechBlog - Medium
大猫的无限游戏
大猫的无限游戏
T
Threatpost
T
Tor Project blog
K
Kaspersky official blog
Microsoft Security Blog
Microsoft Security Blog
Security Archives - TechRepublic
Security Archives - TechRepublic
Security Latest
Security Latest
H
Heimdal Security Blog
N
News and Events Feed by Topic
T
Threat Research - Cisco Blogs
J
Java Code Geeks
H
Hackread – Cybersecurity News, Data Breaches, AI and More
T
Tailwind CSS Blog
C
CXSECURITY Database RSS Feed - CXSecurity.com
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
M
MIT News - Artificial intelligence
Apple Machine Learning Research
Apple Machine Learning Research
N
News | PayPal Newsroom
I
Intezer
博客园 - 聂微东
U
Unit 42
Cisco Talos Blog
Cisco Talos Blog
量子位
T
The Exploit Database - CXSecurity.com
Last Week in AI
Last Week in AI
博客园_首页
月光博客
月光博客
Webroot Blog
Webroot Blog
I
InfoQ
The Cloudflare Blog
Attack and Defense Labs
Attack and Defense Labs
人人都是产品经理
人人都是产品经理
Project Zero
Project Zero
Hacker News: Ask HN
Hacker News: Ask HN
IT之家
IT之家
Google DeepMind News
Google DeepMind News
C
Cisco Blogs

Xiaobin's Notes

Mac本地快速部署DeepSeek Electron的原理 如何让大语言模型输出JSON格式 webstorm 的 cpu 占用高 ECMAScript 历代版本 新一代包管理器 PNPM React useEffect() Hook Vue 2.x 使用高德地图JS API 2.0加载起点终点路径轨迹 家庭用电插座 MacOS 14.4 引发Java 应用崩溃 重定向广告 Pyenv工具 ElasticSearch集群原理 ElasticSearch集群节点 Elasticsearch Mapping 参数 Elasticsearch元数据 Elasticsearch的数据类型 Go语言的向后兼容和toolchain规则 Go 1.21 新增特性
修改Joplin主题样式
xbl · 2024-07-21 · via Xiaobin's Notes
  • Joplin主题
    • macos theme plugin
  • Markdown渲染样式
    • 问题及解决方法

Joplin主题

直接在设置中的“插件”选项中搜索 “macos theme”安装,然后重启后打开macos theme 这个插件,打开该插件对应的设置页面,将样式调成_light_模式,同时Joplin本身的外观设置也需要保持_亮色_模式。再次重启Joplin,发现全局主题已经改变。此外,该插件主题也同时支持暗色主题和自定义主题颜色。

Markdown渲染样式

将源码复制至Joplin配置中的_userstyle.css_中即可,该配置文件可以从_工具_——>_选项_——>_外观_——>_显示高级选项_——>_适用于已渲染Markdown的自定义样式表_中找到。Mac 下路径为

~/.config/joplin-desktop/userstyle.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
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
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165

pre, code {
font-size: 14px;
font-family: Roboto, 'Courier New', Consolas, Inconsolata, Courier, monospace;
margin: auto 5px;
}

code {
white-space: pre-wrap;
border-radius: 2px;
display: inline;
}

pre {
font-size: 15px;
line-height: 1.4em;
display: block; !important;
}

pre code {
white-space: pre;
overflow: auto;
border-radius: 3px;
padding: 1px 1px;
display: block !important;
}

strong, b{
color: #BF360C;
}

em, i {
color: #009688;
}

hr {
border: 1px solid #BF360C;
margin: 1.5em auto;
}

p {
margin: 1.5em 5px !important;
}

table, pre, dl, blockquote, q, ul, ol {
margin: 10px 5px;
}

ul, ol {
padding-left: 15px;
}

li {
margin: 10px;
}

li p {
margin: 10px 0 !important;
}

ul ul, ul ol, ol ul, ol ol {
margin: 0;
padding-left: 10px;
}

ul {
list-style-type: circle;
}

dl {
padding: 0;
}

dl dt {
font-size: 1em;
font-weight: bold;
font-style: italic;
}

dl dd {
margin: 0 0 10px;
padding: 0 10px;
}

blockquote, q {
border-left: 2px solid #009688;
padding: 0 10px;
color: #777;
quotes: none;
margin-left: 1em;
}

blockquote::before, blockquote::after, q::before, q::after {
content: none;
}

h1, h2, h3, h4, h5, h6 {
margin: 20px 0 10px;
padding: 0;
font-style: bold !important;
color: #009688 !important;
text-align: center !important;
margin: 1.5em 5px !important;
padding: 0.5em 1em !important;
}

h1 {
font-size: 24px !important;
}

h2 {
font-size: 20px !important;
}

h3 {
font-size: 18px;
}

h4 {
font-size: 16px;
}


table {
padding: 0;
border-collapse: collapse;
border-spacing: 0;
font-size: 1em;
font: inherit;
border: 0;
margin: 0 auto;
}

tbody {
margin: 0;
padding: 0;
border: 0;
}

table tr {
border: 0;
border-top: 1px solid #CCC;
background-color: white;
margin: 0;
padding: 0;
}

table tr:nth-child(2n) {
background-color: #F8F8F8;
}

table tr th, table tr td {
font-size: 16px;
border: 1px solid #CCC;
margin: 0;
padding: 5px 10px;
}

table tr th {
font-weight: bold;
color: #eee;
border: 1px solid #009688;
background-color: #009688;
}

复制完成后保存,重启Joplin即可。

问题及解决方法

当使用_macos theme_的插件主题之后,插件中的主题样式会覆盖部分的_自定义CSS样式_,可以通过在_自定义CSS样式_后添上!important强制使用自定义的样式。
对上文中的 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
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
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168


pre, code {
font-size: 14px !important;
font-family: Roboto, 'Courier New', Consolas, Inconsolata, Courier, monospace !important;
margin: auto 5px !important;
}

code {
white-space: pre-wrap !important;
border-radius: 2px !important;
display: inline !important;
}

pre {
font-size: 15px !important;
line-height: 1.4em !important;
display: block; !important;
}

pre code {
white-space: pre !important;
overflow: auto !important;
border-radius: 3px !important;
padding: 1px 1px !important;
display: block !important;
}

strong, b{
color: #BF360C !important;
}

em, i {
color: #009688 !important;
}

hr {
border: 1px solid #BF360C !important;
margin: 1.5em auto !important;
}

p {
margin: 1.5em 5px !important;
}

table, pre, dl, blockquote, q, ul, ol {
margin: 10px 5px !important;
}

ul, ol {
padding-left: 15px !important;
}

li {
margin: 10px !important;
}

li p {
margin: 10px 0 !important;
}

ul ul, ul ol, ol ul, ol ol {
margin: 0 !important;
padding-left: 10px !important;
}

ul {
list-style-type: circle !important;
}

dl {
padding: 0 !important;
}

dl dt {
font-size: 1em !important;
font-weight: bold !important;
font-style: italic !important;
}

dl dd {
margin: 0 0 10px !important;
padding: 0 10px !important;
}

blockquote, q {
border-left: 2px solid #009688 !important;
padding: 0 10px !important;
color: #777 !important;
quotes: none !important;
margin-left: 1em !important;
}

blockquote::before, blockquote::after, q::before, q::after {
content: none !important;
}

h1, h2, h3, h4, h5, h6 {
margin: 20px 0 10px !important;
padding: 0 !important;
font-style: bold !important;
color: #009688 !important;
text-align: center !important;
margin: 1.5em 5px !important;
padding: 0.5em 1em !important;
}

h1 {
font-size: 24px !important;
border-bottom: 1px solid #ddd !important;
}

h2 {
font-size: 20px !important;
border-bottom: 1px solid #eee !important;
}

h3 {
font-size: 18px !important;
}

h4 {
font-size: 16px !important;
}


table {
padding: 0 !important;
border-collapse: collapse !important;
border-spacing: 0 !important;
font-size: 1em !important;
font: inherit !important;
border: 0 !important;
margin: 0 auto !important;
}

tbody {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
}

table tr {
border: 0 !important;
border-top: 1px solid #CCC !important;
background-color: white !important;
margin: 0 !important;
padding: 0 !important;
}

table tr:nth-child(2n) {
background-color: #F8F8F8 !important;
}

table tr th, table tr td {
font-size: 16px !important;
border: 1px solid #CCC !important;
margin: 0 !important;
padding: 5px 10px !important;
}

table tr th {
font-weight: bold !important;
color: #eee !important;
border: 1px solid #009688 !important;
background-color: #009688 !important;
}

更改后发现自定义的CSS样式不再会被插件主题样式覆盖。