tweak homepage

Author: yyx990803

themes/vue/layout/index.ejs

@@ -2,24 +2,27 @@
     <div class="inner">
         <ul id="nav">
             <li><a href="/guide/" class="nav-link">Guide</a></li>
-            <li><a href="/api/" class="nav-link">API Reference</a></li>
+            <li><a href="/api/" class="nav-link">API</a></li>
             <li><a href="/examples/" class="nav-link">Examples</a></li>
-            <li><a href="/blog/" class="nav-link">Blog</a></li>
+            <li><a href="https://github.com/yyx990803/vue" class="nav-link" target="_blank">GitHub</a></li>
+            <li><a href="http://forum.vuejs.org" class="nav-link" target="_blank">Forum</a></li>
+            <li><a href="https://gitter.im/yyx990803/vue" class="nav-link" target="_blank">Chat</a></li>
+        </ul>
+        <ul id="translations">
             <li><a href="http://cn.vuejs.org" class="nav-link">中文</a></li>
+            <li class="delimiter">|</li>
             <li><a href="http://jp.vuejs.org" class="nav-link">日本語</a></li>
         </ul>
         <img id="logo" src="/images/logo.png">
         <h1>Vue.js</h1>
-        <p class="desc">Vue.js is a library for building modern web interfaces. <br>It provides data-reactive components with a simple and flexible API.</p>
+        <p class="desc">Reactive Components for Modern Web Interfaces</p>
         <p class="buttons">
             <a href="/guide/installation.html" class="button">Install v<%- theme.vue_version %></a>
-            <a href="https://github.com/yyx990803/vue" target="_blank" class="button">Source on GitHub</a>
         </p>
         <ul id="social">
             <li><a href="https://twitter.com/vuejs" class="twitter-follow-button" data-show-count="false" data-dnt="true">Follow @vuejs</a></li>
             <li><iframe src="http://ghbtns.com/github-btn.html?user=yyx990803&repo=vue&type=watch&count=true"
         allowtransparency="true" frameborder="0" scrolling="0" width="100" height="20"></iframe></li>
-            <li class="last"><a href="https://gitter.im/yyx990803/vue" target="_blank"><img src="https://badges.gitter.im/Join%20Chat.svg"></a></li>
         </ul>
     </div>
     <div class="down"><img src="/images/down.png"></div>

themes/vue/layout/partials/main_menu.ejs

@@ -4,7 +4,8 @@
   </form>
 </li>
 <li><a href="/guide/" class="nav-link<%- page.path.match(/guide/) ? ' current' : '' %>">Guide</a></li>
-<li><a href="/api/" class="nav-link<%- page.path.match(/api/) ? ' current' : '' %>">API Reference</a></li>
+<li><a href="/api/" class="nav-link<%- page.path.match(/api/) ? ' current' : '' %>">API</a></li>
 <li><a href="/examples/" class="nav-link<%- page.path.match(/examples/) ? ' current' : '' %>">Examples</a></li>
-<li><a href="/blog/" class="nav-link<%- (page.path.match(/blog/) || is_post()) ? ' current' : '' %>">Blog</a></li>
-<li><a href="https://github.com/yyx990803/vue" target="_blank" class="nav-link">GitHub</a></li>
+<li><a href="https://github.com/yyx990803/vue" class="nav-link" target="_blank">GitHub</a></li>
+<li><a href="http://forum.vuejs.org" class="nav-link" target="_blank">Forum</a></li>
+<li><a href="https://gitter.im/yyx990803/vue" class="nav-link" target="_blank">Chat</a></li>

themes/vue/source/css/index.styl

@@ -9,22 +9,23 @@ zoom()
 html, body
     height 100%
 
-#cn-link
-    position absolute
-    top 10px
-    right 12px
-    font-size 14px
-
-#nav
+#nav, #translations
     list-style-type none
     text-align center
-    margin-bottom 3em
     padding 0
     li
         display inline-block
         &:last-child .nav-link
             margin-right 0
 
+#translations
+    margin-bottom 3em
+    .delimiter
+        color $light
+        margin 0 5px
+    .nav-link
+        margin 0
+
 .nav-link
     color $light
     padding-bottom 3px
@@ -33,7 +34,6 @@ html, body
         margin-left 0
     &:hover, &.current
         border-bottom 3px solid $green
-        zoom()
 
 #logo
     display block
@@ -56,10 +56,7 @@ html, body
         font-family $logo-font
         font-weight 300
         font-size 4em
-        margin .4em 0 .7em
-    .sub
-        color $medium
-        font-size 1.2em
+        margin .4em 0
     .warning
         color $light
     .desc
@@ -77,7 +74,7 @@ html, body
         img
             width 20px  
     a.button
-        width 180px
+        width 280px
         margin .5em
 
 #social
@@ -251,7 +248,9 @@ html, body
     body
         font-size 14px
     #nav
-        margin 3em 1.8em 2em
+        margin 3em 1.8em 0
+    #translations
+        margin-bottom 2em
     #logo
         width 100px
     .nav-link