finished rc

_config.yml

@@ -17,7 +17,7 @@ widgets:
 - tagcloud
 - archive
 
-# contacts
+# Contacts
 contacts:
   github: http://github.com/ppoffice
   twitter: '#'
@@ -25,6 +25,10 @@ contacts:
   dribbble: '#'
   rss: /atom.xml
 
+# Links
+links:
+  Hexo: http://hexo.io
+
 # Miscellaneous
 google_analytics:
 favicon: /favicon.png

_config.yml.example

@@ -17,7 +17,7 @@ widgets:
 - tagcloud
 - archive
 
-# contacts
+# Contacts
 contacts:
   github: http://github.com/ppoffice
   twitter: '#'
@@ -25,6 +25,10 @@ contacts:
   dribbble: '#'
   rss: /atom.xml
 
+# Links
+links:
+  Hexo: http://hexo.io
+
 # Miscellaneous
 google_analytics:
 favicon: /favicon.png

languages/en.yml

@@ -6,10 +6,8 @@ index:
   uncategorized: 'uncategorized'
   tag: 'tag'
 nav:
-  current_page:
+  next: 'Next'
-    other: 'Page %d '
+  prev: 'Prev'
-  total_page:
-    other: 'of %d'
 widget:
   recents: 'recents'
   archives: 'archives'

languages/zh-CN.yml

@@ -6,10 +6,8 @@ index:
   uncategorized: '未分类'
   tag: '标签'
 nav:
-  current_page:
+  next: '下一页'
-    other: '第 %d 页，'
+  prev: '上一页'
-  total_page:
-    other: '共 %d 页'
 widget:
   recents: '最新文章'
   archives: '归档'

layout/_partial/archive-post.ejs

@@ -1,8 +0,0 @@
-<article class="archive-article archive-type-<%= post.layout %>">
-  <div class="archive-article-inner">
-    <header class="archive-article-header">
-      <%- partial('post/date', {class_name: 'archive-article-date', date_format: 'MMM D'}) %>
-      <%- partial('post/title', {class_name: 'archive-article-title'}) %>
-    </header>
-  </div>
-</article>

layout/_partial/archive.ejs

@@ -5,8 +5,8 @@
   <% if (page.total > 1){ %>
     <nav id="page-nav">
       <%- paginator({
-        prev_text: '&laquo; Prev',
+        prev_text: '&laquo; ' + __('nav.prev'),
-        next_text: 'Next &raquo;'
+        next_text:  __('nav.next') + ' &raquo;'
       }) %>
     </nav>
   <% } %>
@@ -21,11 +21,12 @@
       <% last = year; %>
       <section class="archives-wrap">
         <div class="archive-year-wrap">
+          <i class="fa fa-calendar"></i>
           <a href="<%- url_for('archives/' + year) %>" class="archive-year"><%= year %></a>
         </div>
         <div class="archives">
     <% } %>
-    <%- partial('archive-post', {post: post, even: i % 2 == 0}) %>
+    <%- partial('article', {post: post, index: true}) %>
   <% }) %>
   <% if (page.posts.length){ %>
     </div></section>

layout/_partial/article.ejs

@@ -23,9 +23,9 @@
       <% } %>
     </div>
     <footer class="article-footer">
-      <a data-url="<%- post.permalink %>" data-id="<%= post._id %>" class="article-share-link">Share</a>
+      <a data-url="<%- post.permalink %>" data-id="<%= post._id %>" class="article-share-link"><%= __('article.share') %></a>
       <% if (post.comments && config.disqus_shortname){ %>
-        <a href="<%- post.permalink %>#disqus_thread" class="article-comment-link">Comments</a>
+        <a href="<%- post.permalink %>#disqus_thread" class="article-comment-link"><%= __('article.comments') %></a>
       <% } %>
       <%- partial('post/tag') %>
     </footer>

layout/_partial/sidebar.ejs

@@ -2,4 +2,5 @@
   <% theme.widgets.forEach(function(widget){ %>
     <%- partial('_widget/' + widget) %>
   <% }) %>
+  <div id="toTop" class="fa fa-chevron-up"></div>
 </aside>

layout/_widget/links.ejs

@@ -0,0 +1,14 @@
+<% if (site.posts.length){ %>
+  <div class="widget-wrap widget-list">
+    <h3 class="widget-title"><%= __('sidebar.links') %></h3>
+    <div class="widget">
+      <ul>
+        <% for (var i in theme.links){ %>
+          <li>
+            <a href="<%- theme.links[i] %>"><%= i %></a>
+          </li>
+        <% } %>
+      </ul>
+    </div>
+  </div>
+<% } %>

source/css/_partial/archive.styl

@@ -3,20 +3,22 @@
 
 .archives
   clearfix()
+  .article:first-child
+    margin: 20px 0
 
 .archive-year-wrap
-  margin-bottom: 1em
+  @extend $block
-
+  padding: 10px 20px
+  .fa
+    margin-right: 3px
+  .archive-year
+    color: color-default
+    &:hover
+      color: color-link
+  
 .archive-year
   @extend $block-caption
 
-.archives
-  column-gap: 10px
-  @media mq-tablet
-    column-count: 2
-  @media mq-normal
-    column-count: 3
-
 .archive-article
   avoid-column-break()
 
@@ -48,30 +50,25 @@
 #page-nav
   clearfix()
   margin: block-margin auto
-  background: #fff
-  box-shadow: 1px 2px 3px #ddd
-  border: 1px solid color-border
-  border-radius: 3px
   text-align: center
   color: color-grey
   overflow: hidden
   a, span
-    padding: 10px 20px
+    height: 32px
-    line-height: 1
+    padding: 0 10px
-    height: 2ex
+    line-height: 32px
+    text-align: center
+    display: inline-block
+    border-radius: 2px
   a
     color: color-grey
     text-decoration: none
     &:hover
-      background: color-grey
+      color: white
-      color: #fff
+      background: color-link
-  .prev
-    float: left
-  .next
-    float: right
   .page-number
     display: inline-block
-    @media mq-mobile
+    @media mq-mini
       display: none
   .current
     color: color-default

source/css/_partial/article.styl

@@ -167,7 +167,7 @@
   float: right
   &:before
     content: "\f075"
-    font-family: font-icon
+    font-family: FontAwesome
     padding-right: 8px
 
 .article-share-link
@@ -176,7 +176,7 @@
   margin-left: 20px
   &:before
     content: "\f064"
-    font-family: font-icon
+    font-family: FontAwesome
     padding-right: 6px
 
 #article-nav
@@ -188,12 +188,10 @@
       absolute-center(8px)
       content: ""
       border-radius: 50%
-      background: color-border
+      background: color-default + #222
-      box-shadow: 0 1px 2px #fff
 
 .article-nav-link-wrap
   text-decoration: none
-  text-shadow: 0 1px #fff
   color: color-grey
   box-sizing: border-box
   margin-top: block-margin
@@ -218,11 +216,11 @@
     padding-left: 20px
 
 .article-nav-caption
-  text-transform: uppercase
   letter-spacing: 2px
-  color: color-border
   line-height: 1em
   font-weight: bold
+  color: color-default
+  text-transform: uppercase
   #article-nav-newer &
     margin-right: -2px
 
@@ -318,37 +316,4 @@ $article-share-link
   img
     display: block
     max-width: 100%
-    margin: 0 auto
+    margin: 0 auto
-/*
-$article-gallery-ctrl
-  position: absolute
-  top: 0
-  height: 100%
-  width: 60px
-  color: #fff
-  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3)
-  opacity: 0.3
-  transition: opacity 0.2s
-  cursor: pointer
-  &:hover
-    opacity: 0.8
-  &:before
-    font-size: 30px
-    font-family: font-icon
-    position: absolute
-    top: 50%
-    margin-top: @font-size * -0.5
-
-.article-gallery-prev
-  @extend $article-gallery-ctrl
-  left: 0
-  &:before
-    content: "\f053"
-    left: 15px
-
-.article-gallery-next
-  @extend $article-gallery-ctrl
-  right: 0
-  &:before
-    content: "\f054"
-    right: 15px*/

source/css/_partial/comment.styl

@@ -1,9 +1,6 @@
 #comments
-  background: #fff
+  @extend $block
-  box-shadow: 1px 2px 3px #ddd
   padding: article-padding
-  border: 1px solid color-border
-  border-radius: 3px
   margin: block-margin 0
   a
     color: color-link

source/css/_partial/header.styl

@@ -77,14 +77,8 @@ $header-block-right
       display: none
       @media mq-mini
         display: block
-      border: none
-      outline: none
       padding: 0 10px
-      background: none
       margin-right: 15px
-      color: color-default
-      font: font-size font-sans
-      border: 1px solid color-border
       line-height: header-sub-height - 16
       border-radius: ((header-sub-height - 16)/2)
       &::-webkit-search-results-decoration
@@ -154,16 +148,12 @@ $nav-link
   width: 200px
   .search-form
     position: relative
-    border: 1px solid color-border
-    border-radius: ((logo-size + 2)/2)
-    padding: 0 30px 0 10px
     .search-form-input
-      border: none
-      background: none
-      color: color-default
       width: 100%
-      font: font-size font-sans
+      height: logo-size
-      outline: none
+      padding: 0 30px 0 10px
+      line-height: logo-size
+      border-radius: ((logo-size + 2)/2)
       &::-webkit-search-results-decoration
       &::-webkit-search-cancel-button
         -webkit-appearance: none
@@ -180,4 +170,14 @@ $nav-link
       &:before
         content: '\f002'
       &:hover, &:focus
-        color: #777
+        color: #777
+
+.search-form-input
+  outline: none
+  background: none
+  color: color-default
+  transition: 0.2s ease
+  font: font-size font-sans
+  border: 1px solid color-border
+  &:focus
+    border-color: color-link

source/css/_partial/highlight.styl

@@ -1,5 +1,5 @@
 // https://github.com/chriskempson/tomorrow-theme
-highlight-background = #2d2d2d
+highlight-background = color-default - #222
 highlight-current-line = #393939
 highlight-selection = #515151
 highlight-foreground = #cccccc

source/css/_partial/profile.styl

@@ -97,4 +97,27 @@
                 content: ""
                 display: block
                 position: absolute
-                z-index: 2
+                z-index: 2
+  &.card
+    top: 50px
+    right: 20px
+    z-index: 999
+    display: block
+    min-width: 280px
+    position: absolute
+    .profile-inner
+      position: relative
+      box-shadow: 0 2px 5px rgba(0,0,0,0.2)
+      &:before, &:after
+        z-index: 1
+        content: ''
+        top: -20px
+        right: 10px
+        position: absolute
+        border-width: 10px
+        border-style: solid
+        border-color: transparent transparent white transparent
+      &:after
+        z-index: 0
+        border-color: transparent transparent color-border - #111 transparent
+    

source/css/_partial/sidebar.styl

@@ -81,6 +81,31 @@
         &:hover:before
           color: color-sidebar-text-dark
 
+#toTop
+  @extend $block
+  cursor: pointer
+  text-align: center
+  width: 64px
+  height: 64px
+  color: white
+  font-size: 32px
+  line-height: 64px
+  background: color-default
+  border-radius: 4px
+  @media mq-mobile
+    width: 54px
+    height: 54px
+    font-size: 28px
+    line-height: 54px
+  @media mq-mini
+    width: 54px
+    height: 54px
+    font-size: 28px
+    line-height: 54px
+  &.fix
+    bottom: 20px
+    position: fixed
+
 #recent-post
   li
     clearfix()

source/css/_variables.styl

@@ -30,7 +30,7 @@ line-height-title = 1.1em
 logo-size = 40px
 header-height = 64px
 header-sub-height = 48px
-logo-url = "images/logo.svg"
+logo-url = "images/logo.png"
 
 // Sidebar
 sidebar = hexo-config("sidebar")

source/css/images/logo.svg

@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 17.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" id="圖層_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 width="512px" height="512px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">
-<path fill="#0E83CD" d="M256.4,25.8l-200,115.5L56,371.5l199.6,114.7l200-115.5l0.4-230.2L256.4,25.8z M349,354.6l-18.4,10.7
-	l-18.6-11V275H200v79.6l-18.4,10.7l-18.6-11v-197l18.5-10.6l18.5,10.8V237h112v-79.6l18.5-10.6l18.5,10.8V354.6z"/>
-</svg>

source/fancybox/jquery.fancybox.css

@@ -29,9 +29,6 @@
 	background: #f9f9f9;
 	color: #444;
 	text-shadow: none;
-	-webkit-border-radius: 4px;
-	   -moz-border-radius: 4px;
-	        border-radius: 4px;
 }
 
 .fancybox-opened {

source/js/script.js

@@ -1,4 +1,6 @@
 (function($){
+  var toTop = $('#toTop').offset().top - $(window).height() + 20;
+
   // Share
   $('body').on('click', function(){
     $('.article-share-box.on').removeClass('on');
@@ -74,32 +76,31 @@
     $('.fancybox').fancybox();
   }
 
-  // Mobile nav
+  // Profile card
-  var $container = $('#container'),
+  $(document).on('click', function () {
-    isMobileNavAnim = false,
+    $('#profile').removeClass('card');
-    mobileNavAnimDuration = 200;
+  }).on('click', '#profile-anchor', function (e) {
-
+    e.stopPropagation();
-  var startMobileNavAnim = function(){
+    $('#profile').toggleClass('card');
-    isMobileNavAnim = true;
+  }).on('click', '.profile-inner', function (e) {
-  };
+    e.stopPropagation();
-
-  var stopMobileNavAnim = function(){
-    setTimeout(function(){
-      isMobileNavAnim = false;
-    }, mobileNavAnimDuration);
-  }
-
-  $('#main-nav-toggle').on('click', function(){
-    if (isMobileNavAnim) return;
-
-    startMobileNavAnim();
-    $container.toggleClass('mobile-nav-on');
-    stopMobileNavAnim();
   });
 
-  $('#wrap').on('click', function(){
+  // To Top
-    if (isMobileNavAnim || !$container.hasClass('mobile-nav-on')) return;
+  $(document).on('scroll', function () {
-
+    if ($(document).width() >= 800) {
-    $container.removeClass('mobile-nav-on');
+      if($(this).scrollTop() > toTop) {
+        $('#toTop').addClass('fix');
+        $('#toTop').css('left', $('#sidebar').offset().left);
+      } else {
+        $('#toTop').removeClass('fix');
+      }
+    } else {
+      $('#toTop').addClass('fix');
+      $('#toTop').css('right', 20);
+    }
+  }).on('click', '#toTop', function () {
+    $(document).scrollTop(0);
   });
+
 })(jQuery);