同步皮肤

next/article-list.ftl

@@ -33,7 +33,9 @@
                   |  ${viewsLabel} ${article.articleViewCount}°C
             </div>
         </header>
+        <div class="article-body">
             ${article.articleAbstract}
+        </div>
         <div class="post-more-link">
             <a href="${servePath}${article.articlePermalink}#more" rel="contents">
                 ${readLabel} &raquo;

next/css/next.css

@@ -18,7 +18,7 @@
  * skin next style
  *
  * @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
- * @version 0.1.1.1, Aug 23, 2016
+ * @version 0.2.2.1, Sep 6, 2016
 */
 /* start reset */
 html {
@@ -250,8 +250,10 @@ img {
 
 /* start framework */
 .wrapper {
-    width: 700px;
+    max-width: 700px;
+    min-width: 600px;
     margin: 0 auto;
+    padding: 0 10px;
 }
 
 .main {
@@ -263,12 +265,11 @@ img {
 .header {
     background: #f5f5f5;
     margin-bottom: 80px;
-    padding: 40px 45px;
+    padding: 40px 0px;
 }
 
 .logo-wrap {
     float: left;
-    margin-left: -20px;
     overflow: hidden;
     top: 0;
     opacity: 0;
@@ -386,6 +387,10 @@ img {
     -webkit-transform: translateZ(0);
 }
 
+.sidebar-toggle.has-toc .sidebar-toggle-line{
+    background: #87daff;
+}
+
 .sidebar-toggle-line {
     position: relative;
     display: inline-block;
@@ -570,6 +575,34 @@ img {
     font-size: 14px;
     line-height: 2;
 }
+
+.sidebar section {
+    opacity: 0;
+    position: relative;
+}
+
+.sidebar > ul > li {
+    display: inline-block;
+    cursor: pointer;
+    border-bottom: 1px solid transparent;
+    font-size: 14px;
+    color: #555;
+}
+
+.sidebar > ul > li:hover {
+    color: #f5f5f5;
+}
+
+.sidebar > ul > li.current {
+    color: #87daff;
+    border-bottom-color: #87daff;
+}
+
+.sidebar > ul > li:last-child {
+    margin-left: 10px;
+}
+
+
 /* end side */
 
 /* start list*/
@@ -711,6 +744,15 @@ img {
 #externalRelevantArticles ul {
     margin-top: 5px;
 }
+
+.article-body {
+    overflow: auto;
+    text-align: justify;
+}
+
+.article-body p {
+    margin: 0 0 25px 0;
+}
 /* end article */
 
 /* start comments */
@@ -936,13 +978,18 @@ ul.comments .comment-meta time {
 /* end archives */
 
 /* start responsive */
-
+@media (max-width: 1000px) {
-@media (max-width: 700px) {
+    .sidebar-toggle,
-    .b3-solo-list {
+    .sidebar {
-        margin: 0;
+        display: none;
-        padding: 0;
     }
 
+    body {
+        padding-right: 0 !important;
+    }
+}
+
+@media (max-width: 700px) {
     .page-archive .posts-collapse .archive-move-on {
         margin-left: 5px;
     }
@@ -950,9 +997,6 @@ ul.comments .comment-meta time {
     .posts-collapse {
         margin-left: 10px;
     }
-}
-
-@media (max-width: 500px) {
     pre {
         word-wrap: break-word;
         word-break: break-all;
@@ -972,7 +1016,6 @@ ul.comments .comment-meta time {
     .logo-line-after,
     .menu,
     .site-search,
-    .sidebar-toggle, 
     .back-to-top {
         display: none;
     }
@@ -991,17 +1034,8 @@ ul.comments .comment-meta time {
         display: none;
     }
     
-    .header .wrapper {
-        padding: 0 10px;
-    }
-
-    .logo-wrap .site-title {
-        margin-left: 10px;
-    }
-
     .wrapper {
-        width: auto;
+        min-width: inherit;
-        margin: 0 10px;
     }
 
     .btn-bar {
@@ -1028,6 +1062,12 @@ ul.comments .comment-meta time {
 
     .footer {
         text-align: center;
+        font-size: 12px;
+        padding: 10px 0;
+    }
+
+    .footer .fn-right {
+        float: none;
     }
 }
 /* end responsive */

next/footer.ftl

@@ -1,5 +1,5 @@
 <footer class="footer">
-    <div class="wrapper">
+    <div class="wrapper fn-clear">
         <a href="${servePath}">${blogTitle}</a>  •
         ${onlineVisitor1Label}${onlineVisitorCnt} <br/>
         &copy; ${year}
@@ -39,7 +39,9 @@
         "em11Label": "${em11Label}",
         "em12Label": "${em12Label}",
         "em13Label": "${em13Label}",
-        "em14Label": "${em14Label}"
+        "em14Label": "${em14Label}",
+        "tocLabel": "${tocLabel}",
+        "siteViewLabel": "${siteViewLabel}"
     };
 </script>
 ${plugins}

next/js/next.js

@@ -17,7 +17,7 @@
  * @fileoverview util and every page should be used.
  *
  * @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
- * @version 0.1.1.0, Jul 30, 2016
+ * @version 0.2.1.0, Sep 6, 2016
  */
 
 /**
@@ -37,6 +37,7 @@ var NexT = {
                 $sidebar.animate({
                     right: -320
                 });
+                $sidebar.find('section').css('opacity', 0);
             } else {
                 $(this).addClass('sidebar-active');
                 $('body').animate({
@@ -44,6 +45,10 @@ var NexT = {
                 });
                 $sidebar.animate({
                     right: 0
+                }, function () {
+                    $sidebar.find('section:first').animate({
+                        'opacity': 1
+                    });
                 });
             }
         });
@@ -54,6 +59,7 @@ var NexT = {
 
         $(document).ready(function () {
             setTimeout(function () {
+                // logo animate
                 $('.logo-wrap').css('opacity', 1);
                 $('.logo-line-before i').animate({
                     'left': '0'
@@ -66,6 +72,11 @@ var NexT = {
                         });
                         $('.main').css('opacity', 1).animate({
                             'top': '0'
+                        }, function () {
+                            // 当有文章页面有目录时，回调不放这里，侧边栏就会一片空白
+                            if ($('.b3-solo-list li').length > 0 && $(window).width() > 1000) {
+                                $('.sidebar-toggle').click();
+                            }
                         });
                     });
 
@@ -79,9 +90,44 @@ var NexT = {
         });
     },
     initArticle: function () {
-        if ($('.b3-solo-list li').length > 0 && $(window).width() > 700) {
+        if ($('.b3-solo-list li').length > 0 && $(window).width() > 1000) {
-            $('.sidebar').html($('.b3-solo-list'));
+            // add color to sidebar menu
-            $('.sidebar-toggle').click();
+            $('.sidebar-toggle').addClass('has-toc');
+
+            // append toc to sidebar menu
+            var articleTocHTML = '<ul><li class="current" data-tab="toc">' + Label.tocLabel + '</li><li data-tab="site">' + Label.siteViewLabel + '</li></ul><section></section>';
+            $('.sidebar').prepend(articleTocHTML);
+            var $sectionF = $('.sidebar section:first').html($('.b3-solo-list')),
+                    $sectionL = $('.sidebar section:last');
+
+            // 切换 tab
+            $('.sidebar > ul > li').click(function () {
+                if ($(this).data('tab') === 'toc') {
+                    $sectionL.animate({
+                        "opacity": '0',
+                        "top": '-50px'
+                    }, 300, function () {
+                        $sectionF.show().css('top', '-50px');
+                        $sectionF.animate({
+                            "opacity": '1',
+                            "top": '0'
+                        }, 300);
+                    });
+                } else {
+                    $sectionF.animate({
+                        "opacity": '0',
+                        "top": '-50px'
+                    }, 300, function () {
+                        $sectionF.hide().css('top', '-50px');
+                        $sectionL.animate({
+                            "opacity": '1',
+                            "top": '0'
+                        }, 300);
+                    });
+                }
+                $('.sidebar > ul > li').removeClass('current');
+                $(this).addClass('current');
+            });
         }
     }
 };

next/lang/lang_en_US.properties

@@ -16,16 +16,20 @@
 
 #
 # Description: B3log Solo language configurations(en_US).
-# Version: 1.0.0.2, Jun 30, 2015
+# Version: 1.1.1.2, Sep 6, 2016
 # Author: Liyuan Li
+# Author: Liang Ding
 #
 
+tocLabel=\u6587\u7ae0\u76ee\u5f55
+siteViewLabel=\u7ad9\u70b9\u6982\u89c8
 viewsLabel=Heat
-cmtLabel\uff1d
+cmtLabel=Comments
 postTimeLabel=Post At
 readLabel=Read More
 fightLabel=articles, fighting!
 ohLabel=Oh
+searchLabel=Search
 subscribeLabel=Subscribe
 dynamicLabel=Dynamic
 adminConsoleLabel=Admin

next/lang/lang_zh_CN.properties

@@ -16,10 +16,12 @@
 
 #
 # Description: B3log Solo default language configurations(zh_CN).
-# Version: 1.0.0.1, Jul 30, 2016
+# Version: 1.1.1.2, Sep 6, 2016
 # Author: Liyuan Li
 #
 
+tocLabel=\u6587\u7ae0\u76ee\u5f55
+siteViewLabel=\u7ad9\u70b9\u6982\u89c8
 viewsLabel=\u70ed\u5ea6
 cmtLabel=\u6761\u8bc4\u8bba
 postTimeLabel=\u53d1\u8868\u4e8e

yilia/css/yilia.css

@@ -32,7 +32,7 @@ html {
 body {
     height: 100%;
     max-height: 100%;
-    font-family: "Merriweather", "Microsoft Yahei", 'Helvetica';
+    font-family: "Microsoft Yahei", 'Helvetica';
     letter-spacing: 0.01rem;
     font-size: 100%;
     line-height: 1.75em;
@@ -306,7 +306,7 @@ pre code, pre tt {
     width: 100%;
     box-sizing: border-box;
     outline: none;
-    font-family: "Merriweather", "Microsoft Yahei", 'Helvetica';
+    font-family: "Microsoft Yahei", 'Helvetica';
 }
 
 .form button {

yilia/macro-head.ftl

@@ -9,7 +9,6 @@
 <meta name="revised" content="${blogTitle?html}, ${year}" />
 <meta name="copyright" content="B3log" />
 <meta http-equiv="Window-target" content="_top" />
-<link rel="stylesheet" type="text/css" href="//fonts.useso.com/css?family=Merriweather:300,700,700italic,300italic|Open+Sans:700,400" />
 <link type="text/css" rel="stylesheet" href="${staticServePath}/skins/${skinDirName}/css/${skinDirName}${miniPostfix}.css?${staticResourceVersion}" charset="utf-8" />
 <link href="${servePath}/blog-articles-rss.do" title="RSS" type="application/rss+xml" rel="alternate" />
 <link rel="icon" type="image/png" href="${servePath}/favicon.png" />