diff --git a/_config.yml b/_config.yml
index 7fa967e..efcba82 100755
--- a/_config.yml
+++ b/_config.yml
@@ -171,6 +171,9 @@ plugins:
style:
darkmode: auto # set 'auto' to enable, set 'false' to disable
+ theme:
+ light: '#f8f8f8'
+ dark: '#20252B'
animated_avatar:
animate: auto # auto, always
background: https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.2/avatar/round/rainbow64@3x.webp
diff --git a/layout/_partial/head.ejs b/layout/_partial/head.ejs
index cf1066f..98509ec 100755
--- a/layout/_partial/head.ejs
+++ b/layout/_partial/head.ejs
@@ -58,7 +58,7 @@ function og_args() {
-
+
<%- generate_title() %>
<% if (theme.open_graph && theme.open_graph.enable) { %>
diff --git a/source/css/_common/highlight.styl b/source/css/_common/highlight.styl
index 9af7a17..c5c20d7 100644
--- a/source/css/_common/highlight.styl
+++ b/source/css/_common/highlight.styl
@@ -49,12 +49,12 @@ article.md .highlight
padding: 0 1em
border-width: 0
margin-left: 0
- position: sticky
+ // position: sticky // 如果希望行标固定请打开此行;但是如果想在较窄屏幕上拥有较好的阅读体验,建议让行标跟随滚动。
left: 0
z-index: 1
background: var(--block)
pre .line
- color: var(--text-p2)
+ color: var(--text-p4)
.code
pre
display: block
@@ -136,7 +136,7 @@ article.md .highlight
-$hl-keyword = #9c27b0
+$hl-keyword = #8959a8
$hl-blue = #1E80F0
$hl-cyan = #17AFCA
$hl-green = #3FA33F
@@ -168,13 +168,14 @@ pre
// 注释
.comment
- color: var(--text-p3)
+ color: var(--text-p4)
+ font-style: italic
.keyword, .meta-keyword, .javascript .function
color: $hl-keyword
.type, .built_in, .tag .name
- color: $color-md-light-blue
+ color: $color-md-blue
.variable, .regexp, .ruby .constant, .xml .tag .title, .xml .pi, .xml .doctype, .html .doctype, .css .id, .css .class, .css .pseudo
color: $hl-amber
@@ -214,14 +215,8 @@ pre
.line
.meta
color: $hl-keyword
- .meta-string,.string
- color: $hl-orange
.class
color: $hl-text
- .title
- color: $hl-blue
- .comment
- color: $hl-green
.highlight.json
.line
diff --git a/source/css/_custom.styl b/source/css/_custom.styl
index 704c5ef..3b4db20 100644
--- a/source/css/_custom.styl
+++ b/source/css/_custom.styl
@@ -6,22 +6,23 @@ $color-link = #2196f3
$color-button = #1BCDFC
$color-hover = #ff5722
$color-inner = #fff
-$color-inlinecode = #ff7043
$color-cat = #FF7844
$color-cat-hover = darken($color-cat, 20)
// 浅色
-$light-site-bg = #f8f8f8
+$light-site-bg = convert(hexo-config('style.theme.light'))
$light-block = #f2f2f2
$light-title = #000
-$light-text = #222
+$light-text = #444
+$light-code = #111
$light-card = white
// 深色
-$dark-site-bg = #20252B
+$dark-site-bg = convert(hexo-config('style.theme.dark'))
$dark-block = #2E353D
$dark-title = #fff
-$dark-text = #eee
+$dark-text = #ddd
+$dark-code = #ff7043
$dark-card = #40454B
// 移动端深色背景(OLED调成纯黑可以省电)
diff --git a/source/css/_defines/theme.styl b/source/css/_defines/theme.styl
index 24b4fea..cb55d51 100644
--- a/source/css/_defines/theme.styl
+++ b/source/css/_defines/theme.styl
@@ -7,7 +7,9 @@
--text-p1: $light-text
--text-p2: mix($light-text, $light-site-bg, 80)
--text-p3: mix($light-text, $light-site-bg, 60)
+ --text-p4: mix($light-text, $light-site-bg, 35)
--text-meta: mix($light-text, $light-site-bg, 20)
+ --text-code: $light-code
--card: $light-card
--theme-highlight: darken($color-theme, 5)
--theme-bg: mix($color-theme, $light-card, 10)
@@ -24,7 +26,9 @@ if hexo-config('style.darkmode') == 'auto'
--text-p1: $dark-text
--text-p2: mix($dark-text, $dark-site-bg, 70)
--text-p3: mix($dark-text, $dark-site-bg, 45)
+ --text-p4: mix($dark-text, $dark-site-bg, 35)
--text-meta: mix($dark-text, $dark-site-bg, 30)
+ --text-code: $dark-code
--card: $dark-card
--theme-highlight: $color-theme
--theme-bg: mix($color-theme, $dark-card, 10)
diff --git a/source/css/_layout/md.styl b/source/css/_layout/md.styl
index d2f0fc8..48b5846 100644
--- a/source/css/_layout/md.styl
+++ b/source/css/_layout/md.styl
@@ -68,14 +68,16 @@ article.md p
// code
article.md code
- color: $color-inlinecode
+ -webkit-font-smoothing: auto
+ -moz-osx-font-smoothing: auto
+ color: var(--text-code)
font-family: $ff-code
word-break: break-all
- font-size: inherit
+ font-size: 85%
background: var(--block)
- padding: 2px
+ padding: .2em .4em
border-radius: 2px
- border: 1px solid var(--block-border)
+ // border: 1px solid var(--block-border)
// div
article.md>div