You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@weex.apache.org by ha...@apache.org on 2017/10/10 13:58:21 UTC

[15/15] incubator-weex git commit: * [doc] update styles of the website

* [doc] update styles of the website


Project: http://git-wip-us.apache.org/repos/asf/incubator-weex/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-weex/commit/287b4453
Tree: http://git-wip-us.apache.org/repos/asf/incubator-weex/tree/287b4453
Diff: http://git-wip-us.apache.org/repos/asf/incubator-weex/diff/287b4453

Branch: refs/heads/website
Commit: 287b445357dfa934276abc60732851f3573b2b74
Parents: 428b0ea
Author: Hanks <zh...@gmail.com>
Authored: Tue Oct 10 20:51:47 2017 +0800
Committer: Hanks <zh...@gmail.com>
Committed: Tue Oct 10 21:57:27 2017 +0800

----------------------------------------------------------------------
 doc/_config.yml                                 |   9 +-
 doc/_config_cn.yml                              |   9 +-
 doc/themes/weex/layout/_partial/article.ejs     |   4 +-
 doc/themes/weex/layout/_partial/footer.ejs      |  36 +---
 doc/themes/weex/layout/_partial/head.ejs        |  39 ----
 doc/themes/weex/layout/_partial/header.ejs      |  22 +-
 .../weex/layout/_partial/post/summary.ejs       |  28 +--
 doc/themes/weex/layout/index.ejs                |   3 -
 doc/themes/weex/layout/layout.ejs               |  43 +++-
 doc/themes/weex/layout/page.ejs                 |   3 +-
 doc/themes/weex/source/css/blog.scss            |   6 +-
 doc/themes/weex/source/css/common.scss          |  40 ++--
 doc/themes/weex/source/css/media-queries.scss   |  25 ++-
 .../weex/source/css/partial/article-title.scss  |  28 ---
 doc/themes/weex/source/css/partial/article.scss |  61 ++++--
 doc/themes/weex/source/css/partial/footer.scss  |  89 +++-----
 doc/themes/weex/source/css/partial/header.scss  |  45 ++--
 .../weex/source/css/partial/highlight-old.scss  | 147 +++++++++++++
 .../weex/source/css/partial/highlight.scss      | 209 +++++++++++--------
 doc/themes/weex/source/css/partial/summary.scss |  35 ++--
 doc/themes/weex/source/css/post.scss            |  32 ++-
 doc/themes/weex/source/css/style.scss           |   3 +-
 doc/themes/weex/source/css/variable.scss        |   8 +-
 doc/themes/weex/source/js/highlight.pack.js     |   2 -
 24 files changed, 520 insertions(+), 406 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/_config.yml
----------------------------------------------------------------------
diff --git a/doc/_config.yml b/doc/_config.yml
index ff70324..9dced8b 100644
--- a/doc/_config.yml
+++ b/doc/_config.yml
@@ -7,7 +7,7 @@ title: Weex
 subtitle:
 description: A framework for building Mobile cross-platform UIs. Different from a "web app", "HTML5 app", or "hybrid app", you can use Weex to build a real mobile app. The code that you write is relatively simple, because you can build native applications just using HTML, CSS, Javascript. But underneath, the core of the application is Objective-C or Java. At the same time, Weex will provide a lot of native components or modules for developers to use.
 author: Jinjiang
-language: 
+language:
   - en
   - cn
 
@@ -18,7 +18,7 @@ jsonContent:
   keywords: false # language name option
   dateFormat: undefined # format string
   root: true
-  lang: 
+  lang:
     - default
     - cn
   ignore:
@@ -88,11 +88,6 @@ render_drafts: false
 post_asset_folder: false
 relative_link: false
 future: true
-highlight:
-  enable: true
-  line_number: false
-  auto_detect: false
-  tab_replace: 2
 
 # Category & Tag
 default_category: uncategorized

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/_config_cn.yml
----------------------------------------------------------------------
diff --git a/doc/_config_cn.yml b/doc/_config_cn.yml
index 93eff7d..2634b9a 100644
--- a/doc/_config_cn.yml
+++ b/doc/_config_cn.yml
@@ -7,7 +7,7 @@ title: Weex
 subtitle:
 description: A framework for building Mobile cross-platform UIs. Different from a "web app", "HTML5 app", or "hybrid app", you can use Weex to build a real mobile app. The code that you write is relatively simple, because you can build native applications just using HTML, CSS, Javascript. But underneath, the core of the application is Objective-C or Java. At the same time, Weex will provide a lot of native components or modules for developers to use.
 author: Jinjiang
-language: 
+language:
   - en
   - cn
 
@@ -18,7 +18,7 @@ jsonContent:
   keywords: false # language name option
   dateFormat: undefined # format string
   root: true
-  lang: 
+  lang:
     - default
     - cn
   ignore:
@@ -86,11 +86,6 @@ render_drafts: false
 post_asset_folder: false
 relative_link: false
 future: true
-highlight:
-  enable: true
-  line_number: false
-  auto_detect: false
-  tab_replace: 2
 
 # Category & Tag
 default_category: uncategorized

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/layout/_partial/article.ejs
----------------------------------------------------------------------
diff --git a/doc/themes/weex/layout/_partial/article.ejs b/doc/themes/weex/layout/_partial/article.ejs
index e7052b7..c506af3 100644
--- a/doc/themes/weex/layout/_partial/article.ejs
+++ b/doc/themes/weex/layout/_partial/article.ejs
@@ -8,6 +8,4 @@
   <% if (page_type === 'article') { %>
      <%- partial('_partial/post/nav') %>
   <% } %>
-  <%- partial('footer') %>
-  <%- partial('after-footer') %>
-</article>
\ No newline at end of file
+</article>

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/layout/_partial/footer.ejs
----------------------------------------------------------------------
diff --git a/doc/themes/weex/layout/_partial/footer.ejs b/doc/themes/weex/layout/_partial/footer.ejs
index 0cbe7b2..aaa76ee 100644
--- a/doc/themes/weex/layout/_partial/footer.ejs
+++ b/doc/themes/weex/layout/_partial/footer.ejs
@@ -1,30 +1,14 @@
 <footer id="footer">
-  <div class="row clearfix">
-    <div class="dropdown select-lang">
-      <a href="javascript:;" class="dropdown-toggle">
-        Language
-        <span class="caret"></span>
-      </a>
-      <ul class="dropdown-menu pick-lang">
-        <li>
-          <a href="<%= pick_lang('en') %>" data-lang="en">English</a>
-        </li>
-        <li>
-          <a href="<%= pick_lang('cn') %>" data-lang="zh-cn">中文</a>
-        </li>
-      </ul>
+  <div class="footer-inner">
+    <div class="disclaimer">
+      <p><img src="//gw.alicdn.com/tfs/TB1pTBZQFXXXXX9XXXXXXXXXXXX-794-280.png" width="120px" alt="Apache Incubator"></p>
+      <p>
+        <span class="title">Disclaimer:</span>
+        <span>Apache Weex is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</span>
     </div>
-  </div>
-  <div class="disclaimer">
-    <div><img src="//gw.alicdn.com/tfs/TB1pTBZQFXXXXX9XXXXXXXXXXXX-794-280.png" width="200px" alt="Apache Incubator"></div>
-    <div><span class="title">Disclaimer:</span> Apache Weex is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</div>
-    <br/>
-  </div>
-  <hr>
-  <div class="row">
-    <p> <img src="//gw.alicdn.com/tfs/TB1bg8SQFXXXXcHXXXXXXXXXXXX-85-170.png" height="50px" alt="Apache"><span>Copyright(c) 2017 The Apache Software Foundation. Licensed under the </span> <a href="http://www.apache.org/licenses/LICENSE-2.0">Apache License, Version 2.0</a></p>
-  </div>
-  <div class="row clearfix">
-    <div></div>
+    <p class="copyright">
+      <img src="//gw.alicdn.com/tfs/TB1bg8SQFXXXXcHXXXXXXXXXXXX-85-170.png" height="20px" alt="Apache"><span>Copyright(c) 2017 The Apache Software Foundation. Licensed under the </span>
+      <a target="_blank" href="http://www.apache.org/licenses/LICENSE-2.0">Apache License, Version 2.0</a>
+    </p>
   </div>
 </footer>

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/layout/_partial/head.ejs
----------------------------------------------------------------------
diff --git a/doc/themes/weex/layout/_partial/head.ejs b/doc/themes/weex/layout/_partial/head.ejs
deleted file mode 100644
index ccb76f8..0000000
--- a/doc/themes/weex/layout/_partial/head.ejs
+++ /dev/null
@@ -1,39 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="utf-8">
-  <%
-  var title = page.title;
-
-  if (is_archive()){
-    title = __('archive_a');
-
-    if (is_month()){
-      title += ': ' + page.year + '/' + page.month;
-    } else if (is_year()){
-      title += ': ' + page.year;
-    }
-  } else if (is_category()){
-    title = __('category') + ': ' + page.category;
-  } else if (is_tag()){
-    title = __('tag') + ': ' + page.tag;
-  }
-  %>
-  <title><% if (title){ %><%= title %> | <% } %><%= config.title %></title>
-  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
-  <%- open_graph({twitter_id: theme.twitter, google_plus: theme.google_plus, fb_admins: theme.fb_admins, fb_app_id: theme.fb_app_id}) %>
-  <% if (theme.rss){ %>
-    <link rel="alternate" href="<%- theme.rss %>" title="<%= config.title %>" type="application/atom+xml">
-  <% } %>
-  <% if (theme.favicon){ %>
-    <link rel="icon" href="//gw.alicdn.com/tps/TB1XNqxPXXXXXcSXVXXXXXXXXXX-64-63.png">
-  <% } %>
-  <% if (config.highlight.enable){ %>
-    <link href="//fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet" type="text/css">
-  <% } %>
-  <% if (config.docsearch.enable){ %>
-    <%- css('css/docsearch.min') %>
-  <% } %>
-  <%- css('css/style') %>
-  <%- css('css/swiper.min') %>
-</head>

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/layout/_partial/header.ejs
----------------------------------------------------------------------
diff --git a/doc/themes/weex/layout/_partial/header.ejs b/doc/themes/weex/layout/_partial/header.ejs
index a6d57e0..922dfc1 100644
--- a/doc/themes/weex/layout/_partial/header.ejs
+++ b/doc/themes/weex/layout/_partial/header.ejs
@@ -5,9 +5,15 @@
     </a>
     <div class="main-nav">
       <ul class="links">
-        <li><a href="<%= url_for_lang('guide') %>"><%= _p('menu.guide') %></a></li>
-        <li><a href="<%= url_for_lang('references') %>"><%= _p('menu.references') %></a></li>
-        <li><a href="<%= url_for_lang('guide/contributing.html') %>"><%= _p('menu.invovled') %></a></li>
+        <li class="<%= page.path.match(/\/?guide\/?/i) ? 'current': '' %>">
+          <a href="<%= url_for_lang('guide') %>"><%= _p('menu.guide') %></a>
+        </li>
+        <li class="<%= page.path.match(/\/?references\/?/i) ? 'current': '' %>">
+          <a href="<%= url_for_lang('references') %>"><%= _p('menu.references') %></a>
+        </li>
+        <li>
+          <a href="<%= url_for_lang('guide/contributing.html') %>"><%= _p('menu.invovled') %></a>
+        </li>
         <li class="dropdown">
             <a href="javascript:;"><%= _p('menu.tools') %></a>
             <ul class="dropdown-menu subnav">
@@ -39,10 +45,9 @@
             </li>
           </ul>
         </li>
-        <li><a href="/blog"><%= _p('menu.blog') %></a></li>
-      </ul>
-      <ul class="info">
-        <li><a href="https://github.com/apache/incubator-weex/" target="_blank"><span class="btn-github iconfont icon-github"></span></a></li>
+        <li class="<%= page.path.match(/\/?blog\/?/i) ? 'current': '' %>">
+          <a href="/blog"><%= _p('menu.blog') %></a>
+        </li>
       </ul>
       <ul class="tools">
         <li>
@@ -66,6 +71,9 @@
         </li>
         <!--<li></li>-->
       </ul>
+      <ul>
+        <li><a href="https://github.com/apache/incubator-weex/" target="_blank"><span class="btn-github iconfont icon-github"></span></a></li>
+      </ul>
     </div>
   </div>
   <div id="mobile-nav">

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/layout/_partial/post/summary.ejs
----------------------------------------------------------------------
diff --git a/doc/themes/weex/layout/_partial/post/summary.ejs b/doc/themes/weex/layout/_partial/post/summary.ejs
index abf1bc7..670762c 100644
--- a/doc/themes/weex/layout/_partial/post/summary.ejs
+++ b/doc/themes/weex/layout/_partial/post/summary.ejs
@@ -1,23 +1,7 @@
 <% var result = page.path.match(/(v-)(\d+(\.\d+))/) %>
 <% var version = result ? +result[2] : 2.1 %>
 
-<div class="doc-nav-version">
-  <select class="versionBtn" stype="<%- url_for_lang(page.type) %>">
-  <% if (version == 2.1) { %>
-    <option value="2v" selected>v2.x</option>
-    <option value="1v">v1.x</option>
-  <% } else { %>
-    <option value="2v">v2.x</option>
-    <option value="1v" selected>v1.x</option>
-  <% } %>
- </select>
-</div>
 <div class="summary">
-  <h2 class="part-title">
-    <% if (type) { %>
-      <%= _p('menu.' + type) %>
-    <% } %>
-  </h2>
   <ul class="doc-summary">
     <% var pagesArr = site.pages.find({type: type, lang: page.lang, version: version}).sort('order') %>
     <% var pages = [] %>
@@ -29,7 +13,7 @@
         <% pages[i] = [];pages[i].push(item) %>
       <% } %>
     <% }) %>
-   
+
     <% pages.forEach(function (item, index) { %>
       <li>
         <h3 class="chapter-title"><a href="<%= url_for(item[0].path) %>" class="sidebar-link <%- is_current(item[0].path, 'strict') ? 'current' : '' %> <%- item[0].is_new ? 'new' : '' %>"><%- item[0].title %></a></h3>
@@ -44,12 +28,12 @@
         <% } %>
       </li>
     <% }) %>
-    
+
   </ul>
 </div>
-<div class="hostbyaliyun">
-  <a href="https://render.alipay.com/p/s/taobaonpm_click/weex_banner_click">
+<div class="sponsor">
+  <a class="sponsor-poster" target="_blank" href="https://render.alipay.com/p/s/taobaonpm_click/weex_banner_click">
     <img src="https://render.alipay.com/p/s/taobaonpm_click/weex_banner" alt="" width="180px">
   </a>
-  <div style="color: #7f8c8d;font-size: 12px;">阿里云赞助</div>
-</div>
\ No newline at end of file
+  <div class="sponsor-title">本站点由阿里云赞助支持</div>
+</div>

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/layout/index.ejs
----------------------------------------------------------------------
diff --git a/doc/themes/weex/layout/index.ejs b/doc/themes/weex/layout/index.ejs
index b713fd4..0069e7c 100644
--- a/doc/themes/weex/layout/index.ejs
+++ b/doc/themes/weex/layout/index.ejs
@@ -250,8 +250,6 @@
   </div>
 </div>
 <a href="javascript:;" id="back2top" class="back2top"><span class="iconfont icon-arrow-small"></span></a>
-<%- partial('_partial/footer') %>
-<%- partial('_partial/after-footer') %>
 
 <%- js('js/swiper.min') %>
 <%- js('js/velocity.js') %>
@@ -266,4 +264,3 @@ var swiper = new Swiper('.swiper-container', {
   autoplayDisableOnInteraction: false
 });
 </script>
-    
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/layout/layout.ejs
----------------------------------------------------------------------
diff --git a/doc/themes/weex/layout/layout.ejs b/doc/themes/weex/layout/layout.ejs
index ba6dee3..b9bae58 100644
--- a/doc/themes/weex/layout/layout.ejs
+++ b/doc/themes/weex/layout/layout.ejs
@@ -1,4 +1,39 @@
-<%- partial('_partial/head') %>
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <%
+  var title = page.title;
+
+  if (is_archive()){
+    title = __('archive_a');
+
+    if (is_month()){
+      title += ': ' + page.year + '/' + page.month;
+    } else if (is_year()){
+      title += ': ' + page.year;
+    }
+  } else if (is_category()){
+    title = __('category') + ': ' + page.category;
+  } else if (is_tag()){
+    title = __('tag') + ': ' + page.tag;
+  }
+  %>
+  <title><% if (title){ %><%= title %> | <% } %><%= config.title %></title>
+  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+  <%- open_graph({twitter_id: theme.twitter, google_plus: theme.google_plus, fb_admins: theme.fb_admins, fb_app_id: theme.fb_app_id}) %>
+  <% if (theme.rss){ %>
+    <link rel="alternate" href="<%- theme.rss %>" title="<%= config.title %>" type="application/atom+xml">
+  <% } %>
+  <% if (theme.favicon){ %>
+    <link rel="icon" href="//gw.alicdn.com/tps/TB1XNqxPXXXXXcSXVXXXXXXXXXX-64-63.png">
+  <% } %>
+  <% if (config.docsearch.enable){ %>
+    <%- css('css/docsearch.min') %>
+  <% } %>
+  <%- css('css/style') %>
+  <%- css('css/swiper.min') %>
+</head>
 <body id="<%- page.type ? page.type : page.path.slice(0, -5) %>" class="lang-<%- page.lang %>">
   <% page_type = page.type ? page.type : page.path.slice(0, -5) %>
   <script>
@@ -8,10 +43,12 @@
   <%- partial('_partial/header') %>
   <%- partial('_partial/sidebar', {post: page, page_type: page_type}) %>
   <%- body %>
-  
+  <%- partial('_partial/footer') %>
+  <%- partial('_partial/after-footer') %>
+
   <%- js('js/reqwest.js') %>
   <%- js('js/common.js') %>
-  <% if (config.docsearch.enable){ %>    
+  <% if (config.docsearch.enable){ %>
     <% index_name = page.path.indexOf('cn/') === 0 ? config.docsearch.index_name_cn : config.docsearch.index_name_en %>
     <% api_key = page.path.indexOf('cn/') === 0 ? config.docsearch.api_key_cn : config.docsearch.api_key_en %>
     <%- js('js/docsearch.min.js') %>

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/layout/page.ejs
----------------------------------------------------------------------
diff --git a/doc/themes/weex/layout/page.ejs b/doc/themes/weex/layout/page.ejs
index abaa7b5..c1cae73 100644
--- a/doc/themes/weex/layout/page.ejs
+++ b/doc/themes/weex/layout/page.ejs
@@ -1,7 +1,6 @@
 <div class="article-wrapper page-layout">
   <div class="doc-nav">
-    
     <%- partial('_partial/post/summary', {post: page, index: false, type: page.type ? page.type : ''}) %>
   </div>
   <%- partial('_partial/article', {post: page, index: false}) %>
-</div>
\ No newline at end of file
+</div>

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/blog.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/blog.scss b/doc/themes/weex/source/css/blog.scss
index 4f5fb55..270001c 100644
--- a/doc/themes/weex/source/css/blog.scss
+++ b/doc/themes/weex/source/css/blog.scss
@@ -4,9 +4,9 @@
   position: relative;
   width: 100%;
   margin: 120px auto 90px;
-  max-width: 900px;
+  max-width: 850px;
   min-height: 100%;
-  
+
   .article-excerpt {
     &.article {
       margin: 0;
@@ -36,4 +36,4 @@
       color: #777;
     }
   }
-}
\ No newline at end of file
+}

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/common.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/common.scss b/doc/themes/weex/source/css/common.scss
index d03be9f..78045b4 100644
--- a/doc/themes/weex/source/css/common.scss
+++ b/doc/themes/weex/source/css/common.scss
@@ -19,10 +19,10 @@ html, body {
 body {
   background: $bg-white;
   // font-family: Exo,'-apple-system','Open Sans',HelveticaNeue-Light,'Helvetica Neue Light','Helvetica Neue','Hiragino Sans GB','Microsoft YaHei',Helvetica,Arial,sans-serif;
-  font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   // font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft Yahei', 'WenQuanYi Micro Hei',sans-serif;
   // font-size:62.5%;max-height:100%;
-  font-size: 14px;
+  font-size: 16px;
   line-height: 120%;
   color: $text-light-black;
   -webkit-tap-highlight-color: transparent;
@@ -77,31 +77,19 @@ img {
 
 p {
   font-weight: normal;
-  margin: 0 0 1em;
-}
-h1,h2,h3,h4,h5,h6{
-  font-weight: bold;
-  margin: 0 0 1em;
-}
-h1 {
-  font-size: 2em;
+  margin: 0 0 1.2em;
 }
 
-h2 {
-  font-size: 1.75em;
-}
-
-h3 {
-  font-size: 1.5em;
-}
-
-h4 {
-  font-size: 1.25em;
+h1, h2, h3, h4, h5, h6 {
+  font-weight: 600;
+  margin: 0 0 1em;
 }
 
-h5 {
-  font-size: 1.1em;
-}
+h1 { font-size: 2em; }
+h2 { font-size: 1.75em; }
+h3 { font-size: 1.5em; }
+h4 { font-size: 1.25em; }
+h5 { font-size: 1.1em; }
 
 blockquote {
   margin: 0;
@@ -186,7 +174,7 @@ blockquote {
       line-height: 1.42857143;
       color: $text-light-black;
       white-space: nowrap;
-      
+
       &:hover {
         color: $text-light-black;
         text-decoration: none;
@@ -197,7 +185,7 @@ blockquote {
 
   &:hover .dropdown-menu {
     display: block;
-  } 
+  }
 }
 
 
@@ -253,4 +241,4 @@ table th {
   background: $text-blue;
   color: #fff;
   border-radius: 20px;
-}
\ No newline at end of file
+}

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/media-queries.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/media-queries.scss b/doc/themes/weex/source/css/media-queries.scss
index 317223c..5c723ca 100644
--- a/doc/themes/weex/source/css/media-queries.scss
+++ b/doc/themes/weex/source/css/media-queries.scss
@@ -30,9 +30,18 @@
   }
 
   #footer {
-    padding: 0 20px;
-    .select-lang {
-      display: block;
+    padding: 20px;
+    .disclaimer {
+      display: none;
+    }
+    .copyright {
+      margin: 0;
+    }
+  }
+  .article {
+    margin-top: 20px;
+    .article-entry {
+      margin-bottom: 40px;
     }
   }
 
@@ -52,7 +61,7 @@
       flex: 0 0 240px;
     }
     .sketch-content {
-      /*flex-direction: column; 
+      /*flex-direction: column;
       align-items: center;*/
     }
   }
@@ -83,7 +92,7 @@
   .article-wrapper .doc-nav {
     display: none;
   }
-  
+
   .article-wrapper .article {
     margin-left: 0;
   }
@@ -100,7 +109,7 @@
       flex: 1;
     }
     .sketch-content {
-      flex-direction: column; 
+      flex-direction: column;
       align-items: center;
     }
   }
@@ -147,7 +156,7 @@
       height: 245.45px;
       top: 50%;
       right: -65px;
-      
+
       .level1, .level2, .level3, .level4 {
         width: 500px;
         height: 245.45px;
@@ -191,4 +200,4 @@
       margin-top: 0;
     }
   }
-}
\ No newline at end of file
+}

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/partial/article-title.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/partial/article-title.scss b/doc/themes/weex/source/css/partial/article-title.scss
deleted file mode 100644
index 45b0786..0000000
--- a/doc/themes/weex/source/css/partial/article-title.scss
+++ /dev/null
@@ -1,28 +0,0 @@
-@import "../variable.scss";
-
-.article-header {
-  position: relative;
-  padding-bottom: 10px;
-  border-bottom: 1px solid $border-light;
-  margin-bottom: 3.5em;
-
-  h1 {
-    font-size: 2em;
-    color: #333;
-    margin: 0;
-
-    .article-title {
-      &:hover {
-        color: $text-blue;
-      }
-    }
-  }
-
-  .article-date {
-    position: absolute;
-    bottom: -25px;
-    left: 0px;
-    font-size: .9em;
-    color: $text-gray;
-  }
-}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/partial/article.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/partial/article.scss b/doc/themes/weex/source/css/partial/article.scss
index 6628f46..9b6505f 100644
--- a/doc/themes/weex/source/css/partial/article.scss
+++ b/doc/themes/weex/source/css/partial/article.scss
@@ -1,12 +1,41 @@
 @import "../variable.scss";
 
+.article-header {
+  position: relative;
+  padding-bottom: 10px;
+  border-bottom: 1px solid $border-light;
+  margin-bottom: 3.5em;
+
+  h1 {
+    font-size: 2.1em;
+    color: $text-black;
+    margin: 0;
+
+    .article-title {
+      &:hover {
+        color: $text-blue;
+      }
+    }
+  }
+
+  .article-date {
+    position: absolute;
+    bottom: -25px;
+    left: 0px;
+    font-size: .9em;
+    color: $text-gray;
+  }
+}
+
 .article {
   max-width: 900px;
-  margin: 0 0 0 300px;
+  margin-left: 50px;
+  margin-top: 40px;
   position: relative;
   line-height: 1.6;
   overflow-y: auto;
-  
+  color: $text-dark;
+
   &.article-type-article {
     margin-left: 0;
   }
@@ -16,23 +45,31 @@
   }
 
   h2 {
-    font-size: 1.75em;
-    margin: 1.7em 0 .5em;
+    font-size: 1.85em;
+    margin: 1em 0 .8em;
   }
 
   h3 {
     font-size: 1.5em;
-    margin: 1.5em 0 .5em;
+    margin: .85em 0 .7em;
   }
 
   h4 {
-    font-size: 1.25em;
-    margin: 1.2em 0 .5em;
+    font-size: 1.2em;
+    margin: .75em 0 .55em;
   }
 
   h5 {
-    font-size: 1.1em;
-    margin: 1.1em 0 .5em;
+    font-size: 1.05em;
+    margin: .6em 0 .4em;
+  }
+
+  ol, ul {
+    padding-left: 2em;
+  }
+
+  li {
+    line-height: 2;
   }
 
   img[alt="mobile_preview"] {
@@ -40,7 +77,7 @@
   }
 
   a {
-    color: #4078c0;
+    color: $logo-color;
     &:hover {
       text-decoration: underline;
     }
@@ -56,7 +93,7 @@
     position: absolute;
     top: 15px;
     right: 20px;
-  }   
+  }
 }
 
 #blog .article {
@@ -69,4 +106,4 @@
 
 #releasenote .article {
   margin-left: 0;
-}
\ No newline at end of file
+}

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/partial/footer.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/partial/footer.scss b/doc/themes/weex/source/css/partial/footer.scss
index 1bc4c69..d56d459 100644
--- a/doc/themes/weex/source/css/partial/footer.scss
+++ b/doc/themes/weex/source/css/partial/footer.scss
@@ -1,74 +1,35 @@
 @import "../variable.scss";
 
+$footer-bg: #F2F2F2;
+$footer-text-color: #888;
+
 #footer {
   width: 100%;
-  padding: 20px 65px;
-  margin: 0;
-  background: $bg-white;
-  border-top: 1px solid #DDDDDD;
-  a{
-   text-decoration: underline 
-  }
-  .ali-logo {
-    width: 83px;
-    height: 41px;
-    float: left;
-
-    img {
-      width: 100%;
+  padding: 10px 50px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: $footer-bg;
+  font-size: 12px;
+  color: $footer-text-color;
+  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
+
+  a { text-decoration: underline; }
+  p { margin: 0; }
+
+  .disclaimer {
+    max-width: 1200px;
+    line-height: 1.5;
+    .title {
+      font-weight: bold;
+      margin-bottom: 10px;
     }
   }
 
-  .select-lang {
-    display: none;
-    width: 105px;
-    height: 25px;
-    line-height: 25px;
-    float: right;
-  }
-
-  .select-lang .dropdown-toggle {
-    color: #00293D;
-    border: 1px solid $border-gray;
-  }
-
-  .select-lang .dropdown-menu {
-    width: 105px;
-    border: 1px solid $border-gray;
-  }
-
-  .row {
-    font-size: 12px;
-    margin: 8px 0;
-  } 
-
-  .row .icon-baichuan {
-    font-size: 14px;
-    color: $text-light-black;
-  } 
-
-  .row .cell {
-    float: left;
-    color: $text-gray;
-    margin: 0 20px 10px 0;
-  }
-
-  .caret {
-    display: inline-block;
-    margin-left: 2px;
-    @include triangle-down($border-gray, 4px);
-  }
-  .disclaimer{
-    max-width: 800px;
-    line-height: 150%
-  }
-  hr{
-    border: 0;
-    border-top: 1px solid #e6e6e6;
-  }
-  .disclaimer .title{
-    font-weight: bold;
-    margin-bottom: 10px;
+  .copyright {
+    margin-top: 15px;
+    a, a:focus { color: #666; }
+    a:active { color: #555; }
   }
 }
 

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/partial/header.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/partial/header.scss b/doc/themes/weex/source/css/partial/header.scss
index a45d8f7..3532192 100644
--- a/doc/themes/weex/source/css/partial/header.scss
+++ b/doc/themes/weex/source/css/partial/header.scss
@@ -1,11 +1,15 @@
 @import "../variable.scss";
 
+$header-height: 50px;
+$header-bg: #F2F2F2;
+$menu-active-bg: #EEE;
+
 #header {
   width: 100%;
-  height: 72px; 
+  height: $header-height;
   padding: 0 40px;
   position: fixed;
-  background-color: rgba(255, 255, 255, .95);
+  background-color: $header-bg;
   box-shadow: 0 0 1px rgba(0,0,0,0.25);
   top: 0;
   left: 0;
@@ -22,13 +26,13 @@
     display: block;
 
     img {
-      width: 110px;
-      height: 60px;
+      width: 78px;
+      height: 38px;
     }
   }
 
   .navbar {
-    height: 72px;
+    height: $header-height;
     display: flex;
     justify-content: space-between;
     align-items: center;
@@ -37,7 +41,7 @@
 
   #mobile-nav {
     display: none;
-    height: 72px;
+    height: $header-height;
     align-items: center;
 
     #logo {
@@ -47,7 +51,7 @@
     .btn-menu {
       position: absolute;
       left: 20px;
-      top: 25px;
+      top: 20px;
     }
   }
 
@@ -58,28 +62,33 @@
     & > ul {
       display: flex;
       justify-content: space-between;
-      height: 72px;
-      line-height: 72px;
+      height: $header-height;
+      line-height: $header-height;
     }
 
     li > a {
-      font-size: 1.3em;
+      display: block;
+      height: 100%;
+      font-size: 1.2em;
       color: $text-light-black;
+      padding: 0 16px;
     }
   }
 
   .links {
     & > li > a:hover {
-      border-bottom: .2em solid $text-blue;
+      color: $text-blue;
+      background-color: $menu-active-bg;
     }
 
-    > li + li {
-      margin-left: 30px;
+    & > li.current > a {
+      color: $text-blue;
+      border-bottom: .2em solid $text-blue;
     }
-  }
 
-  .info li {
-    margin-left: 30px;
+    > li {
+      margin: 0 3px;
+    }
   }
 
   .tools {
@@ -88,7 +97,7 @@
       position: relative;
     }
     .search-form {
-      width: 120px;
+      width: 140px;
     }
   }
 
@@ -125,4 +134,4 @@
     margin-left: 2px;
     @include triangle-down($border-gray, 4px);
   }
-}
\ No newline at end of file
+}

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/partial/highlight-old.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/partial/highlight-old.scss b/doc/themes/weex/source/css/partial/highlight-old.scss
new file mode 100644
index 0000000..068a9d5
--- /dev/null
+++ b/doc/themes/weex/source/css/partial/highlight-old.scss
@@ -0,0 +1,147 @@
+code {
+  // color: #c7254e;
+  font-family: "Source Code Pro", Consolas, "Liberation Mono", Menlo, Courier, monospace;
+  background: rgba(27, 31, 35, 0.08);
+  padding: 0 5px;
+  border-radius: 4px;
+  font-size: 0.9em;
+}
+
+pre {
+  font-family: "Source Code Pro", Consolas, "Liberation Mono", Menlo, Courier, monospace;
+  font-size: 14px;
+  padding: 10px 15px;
+  overflow-x: auto;
+  line-height: 22px;
+}
+
+pre code {
+  border: none;
+  background: #353639;
+  display: block;
+  padding: 0;
+  -moz-tab-size: 2;
+  tab-size: 2;
+}
+
+.highlight {
+  pre {
+    background: #353639;
+    padding: 10px 15px;
+    color: #abb2bf;
+    overflow: auto;
+    margin: 20px 0;
+    border-radius: 5px;
+  }
+
+  table {
+    margin: 0!important;
+    border: 0;
+  }
+
+  table td,
+  table th,
+  tr {
+    background: #353639;
+    border: 0;
+    padding: 0;
+  }
+
+  figcaption {
+    margin: -5px 0 5px;
+    font-size: .9em;
+    color: #abb2bf;
+  }
+
+  figcaption:after,
+  figcaption:before {
+    content: "";
+    display: table;
+  }
+
+  figcaption:after {
+    clear: both;
+  }
+
+  figcaption a {
+    float: right;
+  }
+
+  pre {
+    padding: 0;
+    border: none;
+    background: none;
+    margin: 0;
+  }
+
+  .line {
+    height: 22px;
+  }
+}
+
+pre {
+  .comment,
+  .title {
+    color: #5c6370;
+  }
+
+  .attribute,
+  .css .class,
+  .css .id,
+  .css .pseudo,
+  .html .doctype,
+  .regexp,
+  .ruby .constant,
+  .tag,
+  .variable,
+  .xml .doctype,
+  .xml .pi,
+  .xml .tag .title {
+    color: #e06c75;
+  }
+
+  .built_in,
+  .constant,
+  .literal,
+  .number,
+  .params,
+  .preprocessor {
+    color: #d19a66;
+  }
+
+  .class,
+  .css .rules .attribute,
+  .header,
+  .inheritance,
+  .ruby .class .title,
+  .ruby .symbol,
+  .string,
+  .value,
+  .xml .cdata {
+    color: #98c379;
+  }
+
+  .css .hexcolor {
+    color: #3e999f;
+  }
+
+  .coffeescript .title,
+  .function,
+  .javascript .title,
+  .perl .sub,
+  .python .decorator,
+  .python .title,
+  .ruby .function .title,
+  .ruby .title .keyword {
+    color: #c678dd;
+  }
+
+  .javascript .function,
+  .keyword {
+    color: #c678dd;
+  }
+
+  .attr {
+    color: #61afef;
+  }
+}

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/partial/highlight.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/partial/highlight.scss b/doc/themes/weex/source/css/partial/highlight.scss
index cf9e25c..9c9a63f 100644
--- a/doc/themes/weex/source/css/partial/highlight.scss
+++ b/doc/themes/weex/source/css/partial/highlight.scss
@@ -1,17 +1,15 @@
-code, pre {
-  // font-family: Source Code Pro,Monaco,Menlo,Consolas,monospace;
-  color: #abb2bf;
-  font-size: 14px;
-}
-
 code {
-  color: #c7254e;
-  background: #f9f2f4;
+  // color: #c7254e;
+  font-family: "Source Code Pro", Consolas, "Liberation Mono", Menlo, Courier, monospace;
+  background: rgba(27, 31, 35, 0.08);
   padding: 0 5px;
-  border-radius: 5px;
+  border-radius: 4px;
+  font-size: 0.9em;
 }
 
 pre {
+  font-family: "Source Code Pro", Consolas, "Liberation Mono", Menlo, Courier, monospace;
+  font-size: 14px;
   padding: 10px 15px;
   overflow-x: auto;
   line-height: 22px;
@@ -19,91 +17,126 @@ pre {
 
 pre code {
   border: none;
-  background: #353639;
+  background: rgba(27, 31, 35, 0.08);
   display: block;
   padding: 0;
   -moz-tab-size: 2;
   tab-size: 2;
 }
 
-.highlight, pre {
-  background: #353639;
-  padding: 10px 15px;
-  color: #abb2bf;
-  overflow: auto;
-  margin: 20px 0;
-  border-radius: 5px;
-}
-
-.highlight table {
-  margin: 0!important;
-  border: 0;
-}
-
-.highlight table td,.highlight table th, .highlight tr {
-  background: #353639;
-  border: 0;
-  padding: 0;
-}
-
-.highlight figcaption {
-  margin: -5px 0 5px;
-  font-size: .9em;
-  color: #abb2bf;
-}
-
-.highlight figcaption:after,.highlight figcaption:before {
-  content: "";
-  display: table;
-}
-
-.highlight figcaption:after {
-  clear: both;
-}
-
-.highlight figcaption a {
-  float: right;
-}
-
-.highlight pre {
-  padding: 0;
-  border: none;
-  background: none;
-  margin: 0;
-}
-
-.highlight .line {
-  height: 22px;
-}
-
-pre .comment,pre .title {
-  color: #5c6370;
-}
-
-pre .attribute,pre .css .class,pre .css .id,pre .css .pseudo,pre .html .doctype,pre .regexp,pre .ruby .constant,pre .tag,pre .variable,pre .xml .doctype,pre .xml .pi,pre .xml .tag .title {
-  color: #e06c75;
-}
-
-pre .built_in,pre .constant,pre .literal,pre .number,pre .params,pre .preprocessor {
-  color: #d19a66;
-}
-
-pre .class,pre .css .rules .attribute,pre .header,pre .inheritance,pre .ruby .class .title,pre .ruby .symbol,pre .string,pre .value,pre .xml .cdata {
-  color: #98c379;
-}
-
-pre .css .hexcolor {
-  color: #3e999f;
-}
-
-pre .coffeescript .title,pre .function,pre .javascript .title,pre .perl .sub,pre .python .decorator,pre .python .title,pre .ruby .function .title,pre .ruby .title .keyword {
-  color: #c678dd;
+.highlight {
+  margin: 5px 0 15px 0;
+  overflow-x: auto;
+  pre {
+    background: #F3F5F7;
+    margin: 0;
+    padding: 10 20px;
+    color: #585d65;
+    overflow-x: auto;
+    border-radius: 5px;
+  }
+
+  table {
+    margin: 0!important;
+    border: 0;
+  }
+
+  table td,
+  table th,
+  tr {
+    // background: #353639;
+    border: 0;
+    padding: 0;
+  }
+
+  figcaption {
+    margin: -5px 0 5px;
+    font-size: .9em;
+    color: #abb2bf;
+  }
+
+  figcaption:after,
+  figcaption:before {
+    content: "";
+    display: table;
+  }
+
+  figcaption:after {
+    clear: both;
+  }
+
+  figcaption a {
+    float: right;
+  }
+
+  .line {
+    height: 22px;
+  }
 }
 
-pre .javascript .function,pre .keyword {
-  color: #c678dd;
+pre {
+  .comment,
+  .title {
+    color: #969896;
+  }
+
+  .attribute,
+  .css .class,
+  .css .id,
+  .css .pseudo,
+  .html .doctype,
+  .regexp,
+  .ruby .constant,
+  .tag,
+  .variable,
+  .xml .doctype,
+  .xml .pi,
+  .xml .tag .title {
+    color: #e06c75;
+  }
+
+  .built_in,
+  .constant,
+  .literal,
+  .number,
+  .params,
+  .preprocessor {
+    color: #d19a66;
+  }
+
+  .class,
+  .css .rules .attribute,
+  .header,
+  .inheritance,
+  .ruby .class .title,
+  .ruby .symbol,
+  .string,
+  .value,
+  .xml .cdata {
+    color: #98c379;
+  }
+
+  .css .hexcolor {
+    color: #3e999f;
+  }
+
+  .coffeescript .title,
+  .function,
+  .javascript .title,
+  .perl .sub,
+  .python .decorator,
+  .python .title,
+  .ruby .function .title,
+  .ruby .title .keyword {
+    color: #c678dd;
+  }
+
+  .javascript .function,
+  .keyword {
+    color: #c678dd;
+  }
+
+  .attr {
+    color: #61afef;
+  }
 }
-
-pre .attr {
-  color: #61afef;
-}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/partial/summary.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/partial/summary.scss b/doc/themes/weex/source/css/partial/summary.scss
index d9d4609..eddd6b6 100644
--- a/doc/themes/weex/source/css/partial/summary.scss
+++ b/doc/themes/weex/source/css/partial/summary.scss
@@ -4,6 +4,7 @@
   overflow-x: hidden;
   overflow-y: auto;
   -webkit-overflow-scrolling: touch;
+  font-size: 15px;
 
   ul, li , ol {
     margin: 0;
@@ -21,34 +22,40 @@
     }
   }
 
-  h2.part-title {
-    color: $text-blue;
-    font-size: 1.2em;
-    font-weight: 600;
-  }
-    
   h3.chapter-title {
-    font-size: 1.1em;
+    font-size: 1.2em;
   }
-    
+
   ul.chapter {
     margin-left: 15px;
     li {
       white-space: nowrap;
       overflow: hidden;
-      text-overflow: ellipsis;    
-      padding-bottom: 15px;
+      text-overflow: ellipsis;
+      margin-bottom: 10px;
     }
   }
 
 }
 
+.doc-summary {
+   & > li {
+    margin-bottom: 20px;
+  }
+}
+
 .lang-en .summary h3.chapter-title{
   font-weight: 600;
 }
 
-.hostbyaliyun {
+.sponsor {
+  margin-top: 20px;
+}
+.sponsor-poster {
+  display: block;
   width: 180px;
-  z-index: 99;
-  display: none;
-}
\ No newline at end of file
+}
+.sponsor-title {
+  color: #7f8c8d;
+  font-size:12px;
+}

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/post.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/post.scss b/doc/themes/weex/source/css/post.scss
index 370d90c..b6e4120 100644
--- a/doc/themes/weex/source/css/post.scss
+++ b/doc/themes/weex/source/css/post.scss
@@ -1,33 +1,33 @@
 @import "variable.scss";
 
 .article-wrapper {
-  position: relative;
+  display: flex;
   width: 100%;
   margin: 0 auto;
-  padding: 120px 0 0;
+  margin-top: 60px;
+  flex-direction: row;
   min-height: 80%;
   min-height: calc(100% - 160px);
 
   &.post-layout {
-    max-width: 900px;
+    max-width: 850px;
   }
-  
+
   &.page-layout {
-    max-width: 1200px;
+    max-width: 1400px;
   }
 
   .article-entry {
-    padding: 0 1.45em;
+    padding: 0 1.2em;
 
     > h1 {
       display: none;
     }
   }
-  .article-heading{
-    margin-top: -85px;
-    border-top: 85px solid transparent
-
+  .article-heading {
+    color: $text-black;
   }
+
   .article-anchor {
     margin-left: 10px;
     display: none
@@ -50,19 +50,13 @@
   }
 
   .doc-nav {
-    position: fixed;
-    top: 72px;
-    left: 0;
-    bottom: 0;
-    width: 260px;
-    padding: 40px 20px 60px 60px;
+    padding: 50px 20px;
     background: $bg-white;
     width: 300px;
-    z-index: 999;
     overflow-x: hidden;
     overflow-y: auto;
   }
-  
+
   .doc-nav-version{
     margin: 20px 0;
   }
@@ -92,4 +86,4 @@
       }
     }
   }
-}
\ No newline at end of file
+}

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/style.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/style.scss b/doc/themes/weex/source/css/style.scss
index 894cba7..f311f17 100644
--- a/doc/themes/weex/source/css/style.scss
+++ b/doc/themes/weex/source/css/style.scss
@@ -11,7 +11,6 @@
 
 /*POST*/
 @import "post.scss";
-@import "partial/article-title.scss";
 @import "partial/article.scss";
 @import "partial/summary.scss";
 
@@ -25,4 +24,4 @@
 @import "example.scss";
 @import "atom-one-dark.scss";
 
-@import "media-queries.scss";
\ No newline at end of file
+@import "media-queries.scss";

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/css/variable.scss
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/css/variable.scss b/doc/themes/weex/source/css/variable.scss
index cbe4b12..a15c636 100644
--- a/doc/themes/weex/source/css/variable.scss
+++ b/doc/themes/weex/source/css/variable.scss
@@ -2,11 +2,13 @@
 * Variable
 ***********************/
 
-$text-light-black: #333;
-$text-black: #333;
+$logo-color: #00B4FB;
+$text-light-black: #606060;
+$text-dark: #505050;
+$text-black: #333333;
 $text-white: #fff;
 $text-gray: #999;
-$text-blue: #088bc3;
+$text-blue: #1FB5FC;
 $bg-blue: $text-blue;
 $bg-light-blue: #23CEFD;
 $bg-white: #fff;

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/287b4453/doc/themes/weex/source/js/highlight.pack.js
----------------------------------------------------------------------
diff --git a/doc/themes/weex/source/js/highlight.pack.js b/doc/themes/weex/source/js/highlight.pack.js
deleted file mode 100644
index 21b82fb..0000000
--- a/doc/themes/weex/source/js/highlight.pack.js
+++ /dev/null
@@ -1,2 +0,0 @@
-/*! highlight.js v9.9.0 | BSD3 License | git.io/hljslicense */
-!function(e){var n="object"==typeof window&&window||"object"==typeof self&&self;"undefined"!=typeof exports?e(exports):n&&(n.hljs=e({}),"function"==typeof define&&define.amd&&define([],function(){return n.hljs}))}(function(e){function n(e){return e.replace(/[&<>]/gm,function(e){return I[e]})}function t(e){return e.nodeName.toLowerCase()}function r(e,n){var t=e&&e.exec(n);return t&&0===t.index}function i(e){return k.test(e)}function a(e){var n,t,r,a,o=e.className+" ";if(o+=e.parentNode?e.parentNode.className:"",t=B.exec(o))return R(t[1])?t[1]:"no-highlight";for(o=o.split(/\s+/),n=0,r=o.length;r>n;n++)if(a=o[n],i(a)||R(a))return a}function o(e,n){var t,r={};for(t in e)r[t]=e[t];if(n)for(t in n)r[t]=n[t];return r}function u(e){var n=[];return function r(e,i){for(var a=e.firstChild;a;a=a.nextSibling)3===a.nodeType?i+=a.nodeValue.length:1===a.nodeType&&(n.push({event:"start",offset:i,node:a}),i=r(a,i),t(a).match(/br|hr|img|input/)||n.push({event:"stop",offset:i,node:a}));return i}(e,0),n
 }function c(e,r,i){function a(){return e.length&&r.length?e[0].offset!==r[0].offset?e[0].offset<r[0].offset?e:r:"start"===r[0].event?e:r:e.length?e:r}function o(e){function r(e){return" "+e.nodeName+'="'+n(e.value)+'"'}l+="<"+t(e)+w.map.call(e.attributes,r).join("")+">"}function u(e){l+="</"+t(e)+">"}function c(e){("start"===e.event?o:u)(e.node)}for(var s=0,l="",f=[];e.length||r.length;){var g=a();if(l+=n(i.substring(s,g[0].offset)),s=g[0].offset,g===e){f.reverse().forEach(u);do c(g.splice(0,1)[0]),g=a();while(g===e&&g.length&&g[0].offset===s);f.reverse().forEach(o)}else"start"===g[0].event?f.push(g[0].node):f.pop(),c(g.splice(0,1)[0])}return l+n(i.substr(s))}function s(e){function n(e){return e&&e.source||e}function t(t,r){return new RegExp(n(t),"m"+(e.cI?"i":"")+(r?"g":""))}function r(i,a){if(!i.compiled){if(i.compiled=!0,i.k=i.k||i.bK,i.k){var u={},c=function(n,t){e.cI&&(t=t.toLowerCase()),t.split(" ").forEach(function(e){var t=e.split("|");u[t[0]]=[n,t[1]?Number(t[1]):1]})};"str
 ing"==typeof i.k?c("keyword",i.k):E(i.k).forEach(function(e){c(e,i.k[e])}),i.k=u}i.lR=t(i.l||/\w+/,!0),a&&(i.bK&&(i.b="\\b("+i.bK.split(" ").join("|")+")\\b"),i.b||(i.b=/\B|\b/),i.bR=t(i.b),i.e||i.eW||(i.e=/\B|\b/),i.e&&(i.eR=t(i.e)),i.tE=n(i.e)||"",i.eW&&a.tE&&(i.tE+=(i.e?"|":"")+a.tE)),i.i&&(i.iR=t(i.i)),null==i.r&&(i.r=1),i.c||(i.c=[]);var s=[];i.c.forEach(function(e){e.v?e.v.forEach(function(n){s.push(o(e,n))}):s.push("self"===e?i:e)}),i.c=s,i.c.forEach(function(e){r(e,i)}),i.starts&&r(i.starts,a);var l=i.c.map(function(e){return e.bK?"\\.?("+e.b+")\\.?":e.b}).concat([i.tE,i.i]).map(n).filter(Boolean);i.t=l.length?t(l.join("|"),!0):{exec:function(){return null}}}}r(e)}function l(e,t,i,a){function o(e,n){var t,i;for(t=0,i=n.c.length;i>t;t++)if(r(n.c[t].bR,e))return n.c[t]}function u(e,n){if(r(e.eR,n)){for(;e.endsParent&&e.parent;)e=e.parent;return e}return e.eW?u(e.parent,n):void 0}function c(e,n){return!i&&r(n.iR,e)}function g(e,n){var t=N.cI?n[0].toLowerCase():n[0];return e.k.h
 asOwnProperty(t)&&e.k[t]}function h(e,n,t,r){var i=r?"":y.classPrefix,a='<span class="'+i,o=t?"":C;return a+=e+'">',a+n+o}function p(){var e,t,r,i;if(!E.k)return n(B);for(i="",t=0,E.lR.lastIndex=0,r=E.lR.exec(B);r;)i+=n(B.substring(t,r.index)),e=g(E,r),e?(M+=e[1],i+=h(e[0],n(r[0]))):i+=n(r[0]),t=E.lR.lastIndex,r=E.lR.exec(B);return i+n(B.substr(t))}function d(){var e="string"==typeof E.sL;if(e&&!x[E.sL])return n(B);var t=e?l(E.sL,B,!0,L[E.sL]):f(B,E.sL.length?E.sL:void 0);return E.r>0&&(M+=t.r),e&&(L[E.sL]=t.top),h(t.language,t.value,!1,!0)}function b(){k+=null!=E.sL?d():p(),B=""}function v(e){k+=e.cN?h(e.cN,"",!0):"",E=Object.create(e,{parent:{value:E}})}function m(e,n){if(B+=e,null==n)return b(),0;var t=o(n,E);if(t)return t.skip?B+=n:(t.eB&&(B+=n),b(),t.rB||t.eB||(B=n)),v(t,n),t.rB?0:n.length;var r=u(E,n);if(r){var i=E;i.skip?B+=n:(i.rE||i.eE||(B+=n),b(),i.eE&&(B=n));do E.cN&&(k+=C),E.skip||(M+=E.r),E=E.parent;while(E!==r.parent);return r.starts&&v(r.starts,""),i.rE?0:n.length}if(
 c(n,E))throw new Error('Illegal lexeme "'+n+'" for mode "'+(E.cN||"<unnamed>")+'"');return B+=n,n.length||1}var N=R(e);if(!N)throw new Error('Unknown language: "'+e+'"');s(N);var w,E=a||N,L={},k="";for(w=E;w!==N;w=w.parent)w.cN&&(k=h(w.cN,"",!0)+k);var B="",M=0;try{for(var I,j,O=0;;){if(E.t.lastIndex=O,I=E.t.exec(t),!I)break;j=m(t.substring(O,I.index),I[0]),O=I.index+j}for(m(t.substr(O)),w=E;w.parent;w=w.parent)w.cN&&(k+=C);return{r:M,value:k,language:e,top:E}}catch(T){if(T.message&&-1!==T.message.indexOf("Illegal"))return{r:0,value:n(t)};throw T}}function f(e,t){t=t||y.languages||E(x);var r={r:0,value:n(e)},i=r;return t.filter(R).forEach(function(n){var t=l(n,e,!1);t.language=n,t.r>i.r&&(i=t),t.r>r.r&&(i=r,r=t)}),i.language&&(r.second_best=i),r}function g(e){return y.tabReplace||y.useBR?e.replace(M,function(e,n){return y.useBR&&"\n"===e?"<br>":y.tabReplace?n.replace(/\t/g,y.tabReplace):void 0}):e}function h(e,n,t){var r=n?L[n]:t,i=[e.trim()];return e.match(/\bhljs\b/)||i.push("hljs
 "),-1===e.indexOf(r)&&i.push(r),i.join(" ").trim()}function p(e){var n,t,r,o,s,p=a(e);i(p)||(y.useBR?(n=document.createElementNS("http://www.w3.org/1999/xhtml","div"),n.innerHTML=e.innerHTML.replace(/\n/g,"").replace(/<br[ \/]*>/g,"\n")):n=e,s=n.textContent,r=p?l(p,s,!0):f(s),t=u(n),t.length&&(o=document.createElementNS("http://www.w3.org/1999/xhtml","div"),o.innerHTML=r.value,r.value=c(t,u(o),s)),r.value=g(r.value),e.innerHTML=r.value,e.className=h(e.className,p,r.language),e.result={language:r.language,re:r.r},r.second_best&&(e.second_best={language:r.second_best.language,re:r.second_best.r}))}function d(e){y=o(y,e)}function b(){if(!b.called){b.called=!0;var e=document.querySelectorAll("pre code");w.forEach.call(e,p)}}function v(){addEventListener("DOMContentLoaded",b,!1),addEventListener("load",b,!1)}function m(n,t){var r=x[n]=t(e);r.aliases&&r.aliases.forEach(function(e){L[e]=n})}function N(){return E(x)}function R(e){return e=(e||"").toLowerCase(),x[e]||x[L[e]]}var w=[],E=Objec
 t.keys,x={},L={},k=/^(no-?highlight|plain|text)$/i,B=/\blang(?:uage)?-([\w-]+)\b/i,M=/((^(<[^>]+>|\t|)+|(?:\n)))/gm,C="</span>",y={classPrefix:"hljs-",tabReplace:null,useBR:!1,languages:void 0},I={"&":"&amp;","<":"&lt;",">":"&gt;"};return e.highlight=l,e.highlightAuto=f,e.fixMarkup=g,e.highlightBlock=p,e.configure=d,e.initHighlighting=b,e.initHighlightingOnLoad=v,e.registerLanguage=m,e.listLanguages=N,e.getLanguage=R,e.inherit=o,e.IR="[a-zA-Z]\\w*",e.UIR="[a-zA-Z_]\\w*",e.NR="\\b\\d+(\\.\\d+)?",e.CNR="(-?)(\\b0[xX][a-fA-F0-9]+|(\\b\\d+(\\.\\d*)?|\\.\\d+)([eE][-+]?\\d+)?)",e.BNR="\\b(0b[01]+)",e.RSR="!|!=|!==|%|%=|&|&&|&=|\\*|\\*=|\\+|\\+=|,|-|-=|/=|/|:|;|<<|<<=|<=|<|===|==|=|>>>=|>>=|>=|>>>|>>|>|\\?|\\[|\\{|\\(|\\^|\\^=|\\||\\|=|\\|\\||~",e.BE={b:"\\\\[\\s\\S]",r:0},e.ASM={cN:"string",b:"'",e:"'",i:"\\n",c:[e.BE]},e.QSM={cN:"string",b:'"',e:'"',i:"\\n",c:[e.BE]},e.PWM={b:/\b(a|an|the|are|I'm|isn't|don't|doesn't|won't|but|just|should|pretty|simply|enough|gonna|going|wtf|so|such|will|
 you|your|like)\b/},e.C=function(n,t,r){var i=e.inherit({cN:"comment",b:n,e:t,c:[]},r||{});return i.c.push(e.PWM),i.c.push({cN:"doctag",b:"(?:TODO|FIXME|NOTE|BUG|XXX):",r:0}),i},e.CLCM=e.C("//","$"),e.CBCM=e.C("/\\*","\\*/"),e.HCM=e.C("#","$"),e.NM={cN:"number",b:e.NR,r:0},e.CNM={cN:"number",b:e.CNR,r:0},e.BNM={cN:"number",b:e.BNR,r:0},e.CSSNM={cN:"number",b:e.NR+"(%|em|ex|ch|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|px|deg|grad|rad|turn|s|ms|Hz|kHz|dpi|dpcm|dppx)?",r:0},e.RM={cN:"regexp",b:/\//,e:/\/[gimuy]*/,i:/\n/,c:[e.BE,{b:/\[/,e:/\]/,r:0,c:[e.BE]}]},e.TM={cN:"title",b:e.IR,r:0},e.UTM={cN:"title",b:e.UIR,r:0},e.METHOD_GUARD={b:"\\.\\s*"+e.UIR,r:0},e});hljs.registerLanguage("xml",function(s){var e="[A-Za-z0-9\\._:-]+",t={eW:!0,i:/</,r:0,c:[{cN:"attr",b:e,r:0},{b:/=\s*/,r:0,c:[{cN:"string",endsParent:!0,v:[{b:/"/,e:/"/},{b:/'/,e:/'/},{b:/[^\s"'=<>`]+/}]}]}]};return{aliases:["html","xhtml","rss","atom","xjb","xsd","xsl","plist"],cI:!0,c:[{cN:"meta",b:"<!DOCTYPE",e:">",r:10,c:[{b:"\\[",e:"
 \\]"}]},s.C("<!--","-->",{r:10}),{b:"<\\!\\[CDATA\\[",e:"\\]\\]>",r:10},{b:/<\?(php)?/,e:/\?>/,sL:"php",c:[{b:"/\\*",e:"\\*/",skip:!0}]},{cN:"tag",b:"<style(?=\\s|>|$)",e:">",k:{name:"style"},c:[t],starts:{e:"</style>",rE:!0,sL:["css","xml"]}},{cN:"tag",b:"<script(?=\\s|>|$)",e:">",k:{name:"script"},c:[t],starts:{e:"</script>",rE:!0,sL:["actionscript","javascript","handlebars","xml"]}},{cN:"meta",v:[{b:/<\?xml/,e:/\?>/,r:10},{b:/<\?\w+/,e:/\?>/}]},{cN:"tag",b:"</?",e:"/?>",c:[{cN:"name",b:/[^\/><\s]+/,r:0},t]}]}});hljs.registerLanguage("css",function(e){var c="[a-zA-Z-][a-zA-Z0-9_-]*",t={b:/[A-Z\_\.\-]+\s*:/,rB:!0,e:";",eW:!0,c:[{cN:"attribute",b:/\S/,e:":",eE:!0,starts:{eW:!0,eE:!0,c:[{b:/[\w-]+\(/,rB:!0,c:[{cN:"built_in",b:/[\w-]+/},{b:/\(/,e:/\)/,c:[e.ASM,e.QSM]}]},e.CSSNM,e.QSM,e.ASM,e.CBCM,{cN:"number",b:"#[0-9A-Fa-f]+"},{cN:"meta",b:"!important"}]}}]};return{cI:!0,i:/[=\/|'\$]/,c:[e.CBCM,{cN:"selector-id",b:/#[A-Za-z0-9_-]+/},{cN:"selector-class",b:/\.[A-Za-z0-9_-]+/},{cN:"sel
 ector-attr",b:/\[/,e:/\]/,i:"$"},{cN:"selector-pseudo",b:/:(:)?[a-zA-Z0-9\_\-\+\(\)"'.]+/},{b:"@(font-face|page)",l:"[a-z-]+",k:"font-face page"},{b:"@",e:"[{;]",i:/:/,c:[{cN:"keyword",b:/\w+/},{b:/\s/,eW:!0,eE:!0,r:0,c:[e.ASM,e.QSM,e.CSSNM]}]},{cN:"selector-tag",b:c,r:0},{b:"{",e:"}",i:/\S/,c:[e.CBCM,t]}]}});hljs.registerLanguage("json",function(e){var i={literal:"true false null"},n=[e.QSM,e.CNM],r={e:",",eW:!0,eE:!0,c:n,k:i},t={b:"{",e:"}",c:[{cN:"attr",b:/"/,e:/"/,c:[e.BE],i:"\\n"},e.inherit(r,{b:/:/})],i:"\\S"},c={b:"\\[",e:"\\]",c:[e.inherit(r)],i:"\\S"};return n.splice(n.length,0,t,c),{c:n,k:i,i:"\\S"}});hljs.registerLanguage("javascript",function(e){var r="[A-Za-z$_][0-9A-Za-z$_]*",t={keyword:"in of if for while finally var new function do return void else break catch instanceof with throw case default try this switch continue typeof delete let yield const export super debugger as async await static import from as",literal:"true false null undefined NaN Infinity",built_in:"e
 val isFinite isNaN parseFloat parseInt decodeURI decodeURIComponent encodeURI encodeURIComponent escape unescape Object Function Boolean Error EvalError InternalError RangeError ReferenceError StopIteration SyntaxError TypeError URIError Number Math Date String RegExp Array Float32Array Float64Array Int16Array Int32Array Int8Array Uint16Array Uint32Array Uint8Array Uint8ClampedArray ArrayBuffer DataView JSON Intl arguments require module console window document Symbol Set Map WeakSet WeakMap Proxy Reflect Promise"},a={cN:"number",v:[{b:"\\b(0[bB][01]+)"},{b:"\\b(0[oO][0-7]+)"},{b:e.CNR}],r:0},n={cN:"subst",b:"\\$\\{",e:"\\}",k:t,c:[]},c={cN:"string",b:"`",e:"`",c:[e.BE,n]};n.c=[e.ASM,e.QSM,c,a,e.RM];var s=n.c.concat([e.CBCM,e.CLCM]);return{aliases:["js","jsx"],k:t,c:[{cN:"meta",r:10,b:/^\s*['"]use (strict|asm)['"]/},{cN:"meta",b:/^#!/,e:/$/},e.ASM,e.QSM,c,e.CLCM,e.CBCM,a,{b:/[{,]\s*/,r:0,c:[{b:r+"\\s*:",rB:!0,r:0,c:[{cN:"attr",b:r,r:0}]}]},{b:"("+e.RSR+"|\\b(case|return|throw)\\b)\\
 s*",k:"return throw case",c:[e.CLCM,e.CBCM,e.RM,{cN:"function",b:"(\\(.*?\\)|"+r+")\\s*=>",rB:!0,e:"\\s*=>",c:[{cN:"params",v:[{b:r},{b:/\(\s*\)/},{b:/\(/,e:/\)/,eB:!0,eE:!0,k:t,c:s}]}]},{b:/</,e:/(\/\w+|\w+\/)>/,sL:"xml",c:[{b:/<\w+\s*\/>/,skip:!0},{b:/<\w+/,e:/(\/\w+|\w+\/)>/,skip:!0,c:[{b:/<\w+\s*\/>/,skip:!0},"self"]}]}],r:0},{cN:"function",bK:"function",e:/\{/,eE:!0,c:[e.inherit(e.TM,{b:r}),{cN:"params",b:/\(/,e:/\)/,eB:!0,eE:!0,c:s}],i:/\[|%/},{b:/\$[(.]/},e.METHOD_GUARD,{cN:"class",bK:"class",e:/[{;=]/,eE:!0,i:/[:"\[\]]/,c:[{bK:"extends"},e.UTM]},{bK:"constructor",e:/\{/,eE:!0}],i:/#(?!!)/}});
\ No newline at end of file