docs: update readme & test post

README.md

@@ -32,6 +32,7 @@ TeXt 是针对博客的一款简洁的主题，它虽然简洁但并不简单。
 - Color Theme
 - 数学公式（[MathJax](https://www.mathjax.org/)）
 - 流程图， 序列图，甘特图（[mermaid](https://mermaidjs.github.io/)）
+- 柱状图，折线图，饼图，雷达图（[chartjs](http://www.chartjs.org/)）
 - RSS（[jekyll-feed](https://github.com/jekyll/jekyll-feed)）
 - 多语言支持（English | 简体中文 | 繁體中文）
 
@@ -111,7 +112,7 @@ bundle exec jekyll serve -H 0.0.0.0
 
 ### Color Theme
 
-颜色主题位于文件夹 ./\_sass/colors 中，修改 ./\_sass/settings/colors.scss 的 `@import` 路径即可修改主题，默认主题为 default。
+颜色主题位于文件夹 ./\_sass/colors 中，修改 ./\_config.yml 中的 text_color_theme 项为以下值即可更换颜色主题，默认主题为 default。
 
 | `default` | `dark` | `forest` |
 | --- |  --- | --- |
@@ -171,10 +172,11 @@ bundle exec jekyll serve -H 0.0.0.0
 | ---           | ---           | --- |
 | key           |               | 评论系统和阅读量统计使用的文章标识符，如果未设置则评论和统计无效。可用字符集：`字母`、`数字` 及 `- _ : .` |
 | lang          | en/zh/zh-Hans/zh-Hant | 该文章的语言，其优先级高于  ./\_config.yml 中设置的值 |
-| picture_frame | shadow        | 该文章的图片框样式，如果为 `shadow` 则图片带有阴影边框 |
 | modify_date   |               | 该文章的修改时间，不影响首页文章排序（`date` 代表发表时间，会影响文章排序） |
 | comment       | true/false    | 该文章是否能够评论，默认为 true（当然你也可以通过不设置 key 来实现，但是这样的话统计也失效了） |
 | mathjax       | true/false    | 该文章是否需要使用 MathJax 公式，默认为 false（此时只会在该文章页面中解析 MathJax 公式。当然你也可以配置 _config.yml 中的 `mathjax` 项为 true，让网站全局支持 MathJax 公式） |
+| mermaid       | true/false    | 该文章是否需要使用 Mermaid 绘制流程图 |
+| chart         | true/false    | 该文章是否需要使用 Chart 绘制图标 |
 
 ### 其他资源
 

_sass/colors/_default.scss

@@ -20,7 +20,7 @@ $background-color: #fff;
 $text-color-d:     #111;
 $text-color:       #333;
 $text-color-l:     #9c9c9c;
-$text-background-color:mix(#000, $background-color, 5%);
+$text-background-color: rgba(#000, .05);
 
 // border and shadow colors
 $border-color:     mix(#000, $background-color, 20%);

test/_posts/2017-05-05-chart.md

@@ -62,6 +62,9 @@ chart: true
 
 Simple HTML5 Charts using the canvas element [chartjs.org](http://www.chartjs.org/).
 
+You need set `chart: true` in the _config.yml or the markdown's front matter to enable it.
+{:.warning}
+
 ## Line Chart
 
 ```chart

test/_posts/2017-06-06-mermaid.md

@@ -24,6 +24,9 @@ Ever wanted to simplify documentation and avoid heavy tools like Visio when expl
 
 This is why mermaid was born, a simple markdown-like script language for generating charts from text via javascript.
 
+You need set `mermaid: true` in the _config.yml or the markdown's front matter to enable it.
+{:.warning}
+
 ## Flowchart
 
 ```mermaid

test/_posts/2017-07-07-mathjax.md

@@ -17,3 +17,6 @@ $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}$$
     When $$a \ne 0$$, there are two solutions to $$ax^2 + bx + c = 0$$ and they are
 
     $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}$$
+
+You need set `mathjax: true` in the _config.yml or the markdown's front matter to enable it.
+{:.warning}