Skip to content

Commit

Permalink
feat: highlight color scheme 高亮样式自定义
Browse files Browse the repository at this point in the history
  • Loading branch information
MOxFIVE committed Jan 5, 2016
1 parent f248028 commit 25462ea
Show file tree
Hide file tree
Showing 4 changed files with 127 additions and 22 deletions.
15 changes: 14 additions & 1 deletion _config.yml
Expand Up @@ -113,4 +113,17 @@ google_site:

#Keep TOC title on the same line.
#目录中标题不换行
#toc_nowrap: true
#toc_nowrap: true

# >>> Style Customisation 样式自定义 <<<

highlight_style:
#on: true
inline_code: 1 # Value: 0 - 9 可用
code_block: 1 # Value: 0 - 4
# Set inline_code to style highlight text
# Chose a highlight theme for code block
# 通过 inline_code 切换内置文本高亮样式
# 通过 code_block 切换内置代码高亮配色主题

# >>> <<<
80 changes: 80 additions & 0 deletions source/css/_partial/customise/code-block.styl
@@ -0,0 +1,80 @@
// https://github.com/chriskempson/tomorrow-theme

// Tomorrow
highlight-background = rgba(249, 249, 249, .5)
highlight-current-line = #efefef
highlight-selection = #d6d6d6
highlight-foreground = #4d4d4c
highlight-comment = #8e908c
highlight-red = #c82829
highlight-orange = #f5871f
highlight-yellow = #eab700
highlight-green = #718c00
highlight-aqua = #3e999f
highlight-blue = #4271ae
highlight-purple = #8959a8

highlight_style = hexo-config("highlight_style.on")
code_block = hexo-config("highlight_style.code_block")

if highlight_style

// Tomorrow Night Eighties
if code_block
highlight-background = rgba(51, 51, 51, .85)
highlight-current-line = #393939
highlight-selection = #515151
highlight-foreground = #cccccc
highlight-comment = #999999
highlight-red = #f2777a
highlight-orange = #f99157
highlight-yellow = #ffcc66
highlight-green = #99cc99
highlight-aqua = #66cccc
highlight-blue = #6699cc
highlight-purple = #cc99cc

// Tomorrow Night
if code_block == "2"
highlight-background = rgba(32, 34, 37, .85)
highlight-current-line = #282a2e
highlight-selection = #373b41
highlight-foreground = #c5c8c6
highlight-comment = #969896
highlight-red = #cc6666
highlight-orange = #de935f
highlight-yellow = #f0c674
highlight-green = #b5bd68
highlight-aqua = #8abeb7
highlight-blue = #81a2be
highlight-purple = #b294bb

// Tomorrow Night Blue
if code_block == "3"
highlight-background = rgba(0, 40, 91, .8)
highlight-current-line = #00346e
highlight-selection = #003f8e
highlight-foreground = #ffffff
highlight-comment = #7285b7
highlight-red = #ff9da4
highlight-orange = #ffc58f
highlight-yellow = #ffeead
highlight-green = #d1f1a9
highlight-aqua = #99ffff
highlight-blue = #bbdaff
highlight-purple = #ebbbff

// Tomorrow Night Bright
if code_block == "4"
highlight-background = rgba(0, 0, 0, .67)
highlight-current-line = #2a2a2a
highlight-selection = #424242
highlight-foreground = #eaeaea
highlight-comment = #969896
highlight-red = #d54e53
highlight-orange = #e78c45
highlight-yellow = #e7c547
highlight-green = #b9ca4a
highlight-aqua = #70c0b1
highlight-blue = #7aa6da
highlight-purple = #c397d8
30 changes: 30 additions & 0 deletions source/css/_partial/customise/inline-code.styl
@@ -0,0 +1,30 @@
.article-entry code
color gray
background rgba(248, 237, 223, .5)
padding .05em .3em
border-radius 3px
if highlight_style
var inline_code = hexo-config("highlight_style.inline_code")
color white
if !inline_code
color gray
if inline_code
background rgba(153, 204, 153, .7)
if inline_code == "2"
color #f48385
background rgba(199,38,79,0.07)
if inline_code == "3"
color gray
background rgba(255, 250, 165, .7)
if inline_code == "4"
background rgba(136, 172, 219, .65)
if inline_code == "5"
background rgba(239, 117, 34, .42)
if inline_code == "6"
background rgba(217, 83, 79, .45)
if inline_code == "7"
background rgba(129, 138, 145, .35)
if inline_code == "8"
background rgba(91, 192, 222, .6)
if inline_code == "9"
background rgba(250, 250, 250, .6)
24 changes: 3 additions & 21 deletions source/css/_partial/highlight.styl
@@ -1,17 +1,4 @@
// https://github.com/chriskempson/tomorrow-theme
// https://github.com/iissnan/hexo-theme-next/blob/master/source/css/_common/_vendor/highlight/theme.styl
highlight-background = rgba(249, 249, 249, .5)
highlight-current-line = #efefef
highlight-selection = #d6d6d6
highlight-foreground = #4d4d4c
highlight-comment = #8e908c
highlight-red = #c82829
highlight-orange = #f5871f
highlight-yellow = #eab700
highlight-green = #718c00
highlight-aqua = #3e999f
highlight-blue = #4271ae
highlight-purple = #8959a8
@require "customise/code-block"

$code-block
background: highlight-background
Expand All @@ -32,13 +19,6 @@ $line-numbers
pre, code
font-family: font-mono, font-chs
font-size: 1em

code
color: gray
background: rgba(248, 237, 223, .5)
padding: 0 0.3em
border-radius: 7px

pre
@extend $code-block
code
Expand Down Expand Up @@ -115,6 +95,8 @@ $line-numbers
&:hover
text-decoration: underline

@require "customise/inline-code.styl"

pre
.comment
.title
Expand Down

0 comments on commit 25462ea

Please sign in to comment.