我用 google-code-prettify 來做 blog 文章中的代碼上色 ,google-code-prettify 本身有附上幾個 Color Scheme , 然而除了預設的之外,都是以暗色背景為主。
昨天心血來潮將 Solarized 這個 Color Scheme 移植到 google-code-prettify 下,同樣也是 dark/light 雙版本。關於 Solarized 的介紹可以參考這篇文章 。
下載 / Download
Solarized Light
Solarized Dark
代碼 / Code
Solarized Light
正常排版版本 (download ):
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
.pln { color : #657b83 }
@media screen {
.str { color : #2aa198 }
.kwd { color : #859900 }
.com { color : #93a1a1 }
.typ { color : #b58900 }
.lit { color : #2aa198 }
.pun , .opn , .clo { color : #657b83 }
.tag { color : #268bd2 }
.atn { color : #93a1a1 }
.atv { color : #2aa198 }
.dec , .var { color : #268bd2 }
.fun { color : red }
}
@media print , projection {
.str { color : #060 }
.kwd { color : #006 ; font-weight : bold }
.com { color : #600 ; font-style : italic }
.typ { color : #404 ; font-weight : bold }
.lit { color : #044 }
.pun { color : #440 }
.tag { color : #006 ; font-weight : bold }
.atn { color : #404 }
.atv { color : #060 }
}
pre .prettyprint { padding : 5px ; border : 1px solid #888 ; background : #fdf6e3 }
ol .linenums { margin-top : 0 ; margin-bottom : 0 }
li .L0 , li .L1 , li .L2 , li .L3 , li .L5 , li .L6 , li .L7 , li .L8 { list-style-type : none }
li .L1 , li .L3 , li .L5 , li .L7 , li .L9 { background : #eee }
最小化版本 (download ):
1
.pln { color : #657b83 } @media screen { .str { color : #2aa198 } .kwd { color : #859900 } .com { color : #93a1a1 } .typ { color : #b58900 } .lit { color : #2aa198 } .pun , .opn , .clo { color : #657b83 } .tag { color : #268bd2 } .atn { color : #93a1a1 } .atv { color : #2aa198 } .dec , .var { color : #268bd2 } .fun { color : red }} @media print , projection { .str { color : #060 } .kwd { color : #006 ; font-weight : bold } .com { color : #600 ; font-style : italic } .typ { color : #404 ; font-weight : bold } .lit { color : #044 } .pun { color : #440 } .tag { color : #006 ; font-weight : bold } .atn { color : #404 } .atv { color : #060 }} pre .prettyprint { padding : 5px ; border : 1px solid #888 ; background : #fdf6e3 } ol .linenums { margin-top : 0 ; margin-bottom : 0 } li .L0 , li .L1 , li .L2 , li .L3 , li .L5 , li .L6 , li .L7 , li .L8 { list-style-type : none } li .L1 , li .L3 , li .L5 , li .L7 , li .L9 { background : #eee }
Solarized Dark
正常排版版本 (download ):
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
.pln { color : #839496 }
@media screen {
.str { color : #2aa198 }
.kwd { color : #859900 }
.com { color : #586175 }
.typ { color : #b58900 }
.lit { color : #2aa198 }
.pun , .opn , .clo { color : #839496 }
.tag { color : #268bd2 }
.atn { color : #586175 }
.atv { color : #2aa198 }
.dec , .var { color : #268bd2 }
.fun { color : red }
}
@media print , projection {
.str { color : #060 }
.kwd { color : #006 ; font-weight : bold }
.com { color : #600 ; font-style : italic }
.typ { color : #404 ; font-weight : bold }
.lit { color : #044 }
.pun { color : #440 }
.tag { color : #006 ; font-weight : bold }
.atn { color : #404 }
.atv { color : #060 }
}
pre .prettyprint { padding : 5px ; border : 1px solid #888 ; background : #002b36 }
ol .linenums { margin-top : 0 ; margin-bottom : 0 }
li .L0 , li .L1 , li .L2 , li .L3 , li .L5 , li .L6 , li .L7 , li .L8 { list-style-type : none }
li .L1 , li .L3 , li .L5 , li .L7 , li .L9 { background : #111 }
最小化版本 (download ):
1
.pln { color : #839496 } @media screen { .str { color : #2aa198 } .kwd { color : #859900 } .com { color : #586175 } .typ { color : #b58900 } .lit { color : #2aa198 } .pun , .opn , .clo { color : #839496 } .tag { color : #268bd2 } .atn { color : #586175 } .atv { color : #2aa198 } .dec , .var { color : #268bd2 } .fun { color : red }} @media print , projection { .str { color : #060 } .kwd { color : #006 ; font-weight : bold } .com { color : #600 ; font-style : italic } .typ { color : #404 ; font-weight : bold } .lit { color : #044 } .pun { color : #440 } .tag { color : #006 ; font-weight : bold } .atn { color : #404 } .atv { color : #060 }} pre .prettyprint { padding : 5px ; border : 1px solid #888 ; background : #002b36 } ol .linenums { margin-top : 0 ; margin-bottom : 0 } li .L0 , li .L1 , li .L2 , li .L3 , li .L5 , li .L6 , li .L7 , li .L8 { list-style-type : none } li .L1 , li .L3 , li .L5 , li .L7 , li .L9 { background : #111 }
範例 / Example (in dark version)
import java.util.Map;
import java.util.TreeSet;
public class GetEnv {
/**
* let's test generics
* @param args the command line arguments
*/
public static void main(String[] args) {
// get a map of environment variables
Map<String, String> env = System.getenv();
// build a sorted set out of the keys and iterate
for(String k: new TreeSet<String>(env.keySet())) {
System.out.printf("%s = %s\n", k, env.get(k));
}
}
}
網路上有找到這篇也有 solarized color for google-pretty-code , 不過只有暗色背景的版本。