Add Tsu theme

themes/hexo-theme-Tsu/.vs/VSWorkspaceState.json

@@ -0,0 +1,6 @@
+{
+  "ExpandedNodes": [
+    ""
+  ],
+  "PreviewInSolutionExplorer": false
+}

themes/hexo-theme-Tsu/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 Bacbin
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

themes/hexo-theme-Tsu/README.md

@@ -0,0 +1,13 @@
+# hexo-theme-Tsu
+> A light and simple theme bases on polarbear, designed by Bacbin
+
+## Installation
+```
+$npm install hexo-renderer-scss --save
+$git clone https://github.com/zjx137/hexo-theme-Tsu.git
+```
+Change config.yml`theme: Tsu` or`theme: hexo-theme-Tsu`
+## ScreenShot
+![Missing](https://upload-images.jianshu.io/upload_images/15435235-8f8ab55b83721bc7.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1000/format/webp)
+
+Modify the theme `config.yml` for Avator and more...

themes/hexo-theme-Tsu/_config.yml

@@ -0,0 +1,12 @@
+menu:
+  Home: /
+  Archives: /archives
+  About: /about/
+#If you dont want it, just comment it out
+weibo: yourweibo
+github: yourgithub
+linkedin: yourlinkedin
+email: mailto:youremail
+
+#Put into /source
+avator: avator.jpg

themes/hexo-theme-Tsu/languages/default.yml

@@ -0,0 +1,8 @@
+Menu:
+  Home: Home
+  Archives: Archives
+  About: About
+
+Paginator:
+  Prev: Prev
+  Next: Next

themes/hexo-theme-Tsu/languages/zh-CN.yml

@@ -0,0 +1,8 @@
+Menu:
+  Home: 主页
+  Archives: 归档
+  About: 关于
+
+Paginator:
+  Prev: 上一页
+  Next: 下一页

themes/hexo-theme-Tsu/layout/_partials/footer.ejs

@@ -0,0 +1,5 @@
+<div class="copyright">
+  <div class="text">Powered By
+    <a href="https://hexo.io/">Hexo</a> | Theme <a href="https://github.com/zjx137/hexo-theme-Tsu">Tsu</a> &copy 2019
+  </div>
+</div>

themes/hexo-theme-Tsu/layout/_partials/head.ejs

@@ -0,0 +1,21 @@
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+
+<%
+var title = page.title;
+if (is_archive()){
+  title = 'Archives';
+  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>
+
+<%- css('styles/main') %>

themes/hexo-theme-Tsu/layout/_partials/header.ejs

@@ -0,0 +1,16 @@
+<header>
+<div class="main">
+<div class="title">
+    <a href="#" class="logo"><%= config.title %></a>
+</div>
+<div class="site-nav">
+    <ul id="menu" class="menu">
+    <% for (name in theme.menu) { %>
+        <li class="menu-item text-underline">
+            <a href="<%- url_for(theme.menu[name]) %>"><%- __('Menu.' + name) %></a>
+        </li>
+    <% } %>        
+    </ul>
+</div>
+</div>
+</header>

themes/hexo-theme-Tsu/layout/_partials/mathjax.ejs

@@ -0,0 +1,36 @@
+<!-- MathJax配置，可通过单美元符号书写行内公式等 -->
+<script type="text/x-mathjax-config">
+    MathJax.Hub.Config({
+    "HTML-CSS": { 
+        preferredFont: "TeX", 
+        availableFonts: ["STIX","TeX"], 
+        linebreaks: { automatic:true }, 
+        EqnChunk: (MathJax.Hub.Browser.isMobile ? 10 : 50) 
+    },
+    tex2jax: { 
+        inlineMath: [ ["$", "$"], ["\\(","\\)"] ], 
+        processEscapes: true, 
+        ignoreClass: "tex2jax_ignore|dno",
+        skipTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code']
+    },
+    TeX: {  
+        equationNumbers: { autoNumber: "AMS" },
+        noUndefined: { attributes: { mathcolor: "red", mathbackground: "#FFEEEE", mathsize: "90%" } }, 
+        Macros: { href: "{}" } 
+    },
+    messageStyle: "none"
+    }); 
+</script>
+<!-- 给MathJax元素添加has-jax class -->
+<script type="text/x-mathjax-config">
+    MathJax.Hub.Queue(function() {
+        var all = MathJax.Hub.getAllJax(), i;
+        for(i=0; i < all.length; i += 1) {
+            all[i].SourceElement().parentNode.className += ' has-jax';
+        }
+    });
+</script>
+<!-- 通过连接CDN加载MathJax的js代码 -->
+<script type="text/javascript" async
+  src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML">
+</script>

themes/hexo-theme-Tsu/layout/_partials/paginator.ejs

@@ -0,0 +1,46 @@
+<% if (page.total>1){ %>
+    <nav class="page-nav">
+    <% if(page.prev){ %>
+        <a class="prev" href="<%- url_for(page.prev_link) %>">
+            <i class="iconfont icon-left"></i>
+            <span class="prev-text"><%- __('Paginator.Prev') %></span>
+        </a>
+    <% } %>
+    <% if(page.next){ %>
+        <a class="next" href="<%- url_for(page.next_link) %>">
+            <span class="next-text"><%- __('Paginator.Next') %></span>
+            <i class="iconfont icon-right"></i>
+        </a>
+    <% } %>
+    </nav>
+<% } %>
+<% if (!is_home()) { %>
+    <nav class="post-nav">
+        <% if(page.tags){ %>
+            <div class="page-tags">
+                <% page.tags.forEach(function(tag){ %>
+                    <a href="<%- url_for(tag.path) %>"><%= tag.name%></a>
+                <% }) %>
+            </div>
+        <% } %>
+    </nav>
+
+<% } %>
+<% if (is_post()){ %>
+    <nav class="paginator clearfix">
+        <%if(page.prev){%>
+            <a class="prev" href="<%- url_for(page.prev.path) %>">
+                <i class="iconfont icon-left"></i>
+                <span class="prev-text"><%= page.prev.title %></span>
+            </a>
+        <% } %>
+        <%if(page.next){%>
+            <a class="next" href="<%- url_for(page.next.path) %>">
+                
+                <span class="prev-text"><%= page.next.title %></span>
+                <i class="iconfont icon-right"></i>
+            </a>
+        <% } %>
+    </nav>
+
+<%}%>

themes/hexo-theme-Tsu/layout/_partials/posts.ejs

@@ -0,0 +1,21 @@
+<div class="posts-wrapper">
+    <% page.posts.each(function(post){ %>
+        <article class="post article-entry">
+            <div class="post-title">
+                <a class="post-title-link text-underline" href="<%- url_for(post.path) %>"><%= post.title %></a>
+            </div>
+            <p class="sub"><%- date(post.date, "MMM DD YYYY") %></p>
+            <div class="post-content">
+                <% if (post.excerpt){ %>
+                    <%- post.excerpt %>
+                    <p class="article-more-link">
+                        <a href="<%- url_for(post.path) %>">阅读全文</a>
+                    </p>
+                <% } else { %>
+                    <%- post.content %>
+                <% } %>
+            </div>
+        </article>
+    <% }) %>
+</div>
+<%- partial('_partials/side-bar') %>

themes/hexo-theme-Tsu/layout/_partials/side-bar.ejs

@@ -0,0 +1,18 @@
+<div class="side-bar">
+
+
+    <div class="avator" id="avator">
+    <div class="title">
+        <a href="#" class="text-underline">About Me</a>
+    </div>
+        <img src="<%= theme.avator %>" class="ava-img">
+        <h3 class="author"><%= config.author %></h3>
+        <div class="icon-list">
+        <a href="<%= theme.weibo %>"><i class="iconfont icon-weibo icon-item"></i></a>
+        <a href="<%= theme.email %>"><i class="iconfont icon-email icon-item"></i></a>
+        <a href="<%= theme.github %>"><i class="iconfont icon-github icon-item"></i></a>
+        <a href="<%= theme.linkedin %>"><i class="iconfont icon-linkedin icon-item"></i></a>
+        </div>
+    <%- partial('_partials/tags') %>
+    </div>
+</div>

themes/hexo-theme-Tsu/layout/_partials/tags.ejs

@@ -0,0 +1,4 @@
+<div class="tags">
+    <h3 class="tags-title">Tags</h3>
+    <%- list_tags({show_count: true, amount: 10, orderby: 'count'}) %>
+</div>

themes/hexo-theme-Tsu/layout/_partials/toc.ejs

@@ -0,0 +1,10 @@
+<% if(is_post()){%>
+    <div class="_toc">
+        <strong class="toc-title">
+        Contents
+        </strong>
+        <div class="toc-content">
+            <%- toc(page.content, {list_number: false}) %>
+        </div>
+    </div>
+<%}%>

themes/hexo-theme-Tsu/layout/about.ejs

@@ -0,0 +1 @@
+<p>helo</p>

themes/hexo-theme-Tsu/layout/archive.ejs

@@ -0,0 +1,48 @@
+<section class="archive">
+<% if (!page.prev){ %>
+<% if (page.tag){ %>
+  <div class="archive-title tag">
+    <h2 class="archive-name"><%= page.tag %></h2>
+  </div>
+<% if(page.category)%>
+  <div class="archive-title category">
+    <h2 class="archive-name"><%= page.category %></h2>
+  </div>
+<% } %>
+<% } %>
+
+    <div class="post-archive">
+        <% var last; %>
+        <% page.posts.each(function(post){ %>
+            <% var year = date(post.date,"YYYY"); %>           
+                <% if (last !== year){ %>
+                    <% last = year; %>
+                    <% if (last !== null){ %>
+                        <%if(is_archive()){%>
+                        <div class="collect-year">
+                            <h2><%= year %></h2>  
+                        </div>
+                        <%}%>                    
+                    <% } %>
+                    
+                <% }; %>
+                <div class="collect-item">
+                <% if(is_archive()){%>
+                    <div class="time"><%= date(post.date,"MM-DD")%></div>
+                    <a href="<%- url_for(post.path) %>" class="title"><%= post.title %></a>
+                <%};%>
+                <% if(!is_archive()) {%>
+                    <div class="time"><%= date(post.date,"YYYY-MM-DD")%></div>
+                    <a href="<%- url_for(post.path) %>" class="title"><%= post.title %></a>
+                <%};%>
+                </div>
+                
+                
+
+
+        <% }) %>
+
+    </div>
+
+</section>
+<%- partial('_partials/paginator') %>

themes/hexo-theme-Tsu/layout/index.ejs

@@ -0,0 +1,4 @@
+<section class="posts clearfix">
+    <%- partial('_partials/posts') %>
+</section>
+<%- partial('_partials/paginator') %>

themes/hexo-theme-Tsu/layout/layout.ejs

@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html>
+    <head>
+    <%- partial('_partials/head') %>
+    </head>
+    <body>
+        <div class="container">
+            <%- partial('_partials/header') %>
+            <main class="main">
+                <%- body %>
+            </main>
+            <%- partial('_partials/footer') %>
+        </div>
+    <div class="back-to-top" id="back-to-top">
+            <i class="iconfont icon-up"></i>
+    </div>
+        
+    </body>
+    <%- js('js/jquery-3.3.1.min.js')%>
+    <%- js('js/back-to-top.js') %>
+    <%- js('js/scroll.js') %>
+    <%- partial('_partials/mathjax') %>
+</html>

themes/hexo-theme-Tsu/layout/post.ejs

@@ -0,0 +1,15 @@
+<section class="posts clearfix">
+<div class="post-wrapper">
+    <article class="post article-entry">
+    <div class="post-title">
+        <%= page.title %>
+    </div>
+    <p class="sub"><%- date(page.date, "MMM DD YYYY") %></p>
+    <div class="post-content">
+        <%- page.content %>
+    </div>
+    </article>
+</div>
+<%- partial('_partials/toc') %>
+</section>
+<%- partial('_partials/paginator') %>

themes/hexo-theme-Tsu/source/js/back-to-top.js

@@ -0,0 +1,25 @@
+$(function(){
+    //当滚动条的位置处于距顶部100像素以下时，跳转链接出现，否则消失
+    $(function () {
+        $(window).scroll(function(){
+            if ($(window).scrollTop()>100){
+                $("#back-to-top").fadeIn(1500);
+            }
+            else
+            {
+                $("#back-to-top").fadeOut(1500);
+            }
+        });
+
+        //当点击跳转链接后，回到页面顶部位置
+        $("#back-to-top").click(function(){
+            //$('body,html').animate({scrollTop:0},1000);
+    if ($('html').scrollTop()) {
+            $('html').animate({ scrollTop: 0 }, 1000);
+            return false;
+        }
+        $('body').animate({ scrollTop: 0 }, 1000);
+             return false;            
+       });       
+ });    
+});

themes/hexo-theme-Tsu/source/js/scroll.js

@@ -0,0 +1,109 @@
+$(function(){
+    var SPACING = 20;
+    var $toc = $('._toc');
+    var $ava = $('#avator');
+    
+    if($toc.length){
+        var minScrollTop = $toc.offset().top - SPACING;
+        var tocState = {
+            start: {
+                'position':'absolute',
+                'top':minScrollTop
+            },
+            process: {
+                'position':'fixed',
+                'top':SPACING
+            }
+        }
+        $(window).scroll(function(){
+            var scrollTop = $(window).scrollTop();
+
+            if(scrollTop < minScrollTop){
+                $toc.css(tocState.start);
+            }
+            else{
+                $toc.css(tocState.process);
+            }
+        })
+    }
+
+    if($ava.length) {
+        let minScrollTop = $ava.offset().top - 30;
+        let avaState = {
+            start: {
+                'position':'absolute',
+                'top':minScrollTop
+            },
+            process: {
+                'position':'fixed',
+                'top':SPACING
+            }            
+        }
+        $(window).scroll(function(){
+            let scrollTop = $(window).scrollTop();
+            if(scrollTop < minScrollTop) {
+                $ava.css(avaState.start);
+            }
+            else {
+                $ava.css(avaState.process);
+            }
+
+        })
+    }
+});
+$(window).resize(function(){
+    var $toc = $('._toc');
+    var minwidth = 1480;
+    var $avator = $('#avator');
+    var $postswrapper = $('.posts-wrapper');
+    if($(window).width()<1480){
+        $toc.css("display","none");
+    }
+    else {
+        $toc.css("display","block");
+    }
+    if($(window).width()<950){
+        $avator.css("display","none");
+        $postswrapper.css("width","100%");
+    }
+    else {
+        $avator.css("display","block");
+        $postswrapper.css("width","73%");
+
+    }
+});
+$(function(){
+    var $toc = $('._toc');
+    var minwidth = 1480;
+    var $avator = $('#avator');
+    var $postswrapper = $('.posts-wrapper');
+    if($(window).width<1480){
+        $toc.css("display","none");
+    }
+    if($(window).width()<950){
+        $avator.css("display","none");
+        $postswrapper.css("width","100%");
+    }
+});
+$(function(){
+    var HEADERFIX = 30;
+    var $toclink = $('.toc-link'),
+    $headerlink = $('.headerlink');
+    $(window).scroll(function(){
+        var headerlinkTop = $.map($headerlink,function(link){
+            return $(link).offset().top;
+        });
+        var scrollTop = $(window).scrollTop();
+        for(var i=0;i<$toclink.length;i++){
+            var isLast = i+1 === $toclink.length,
+            currentTop = headerlinkTop[i] - HEADERFIX,
+            nextTop = isLast ? Infinity : headerlinkTop[i+1]- HEADERFIX;
+            if(currentTop < scrollTop && scrollTop <= nextTop){
+                $($toclink[i]).addClass('active');
+            }
+            else{
+                $($toclink[i]).removeClass('active');
+            }
+        }
+    });
+});

themes/hexo-theme-Tsu/source/styles/_variables.styl

@@ -0,0 +1,63 @@
+// Config
+support-for-ie = false
+vendor-prefixes = webkit moz ms official
+
+// Colors
+color-default = #555
+color-grey = #999
+color-border = #ddd
+color-link = #258fb8
+color-background = #eee
+color-sidebar-text = #777
+color-widget-background = #ddd
+color-widget-border = #ccc
+color-footer-background = #262a30
+color-mobile-nav-background = #191919
+color-twitter = #00aced
+color-facebook = #3b5998
+color-pinterest = #cb2027
+color-google = #dd4b39
+
+// Fonts
+font-sans = -apple-system, BlinkMacSystemFont,
+    "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
+    "Fira Sans", "Droid Sans", "Helvetica Neue",
+    sans-serif
+font-serif = Georgia, "Times New Roman", serif
+font-mono = Consolas, Monaco, Menlo, Consolas, monospace
+font-icon = FontAwesome
+font-icon-path = "fonts/fontawesome-webfont"
+font-icon-version = "4.0.3"
+font-size = 13px
+line-height = 1.6em
+line-height-title = 1.1em
+
+// Header
+logo-size = 40px
+subtitle-size = 16px
+banner-height = 300px
+banner-url = "images/banner.jpg"
+
+
+// Layout
+block-margin = 50px
+article-padding = 20px
+mobile-nav-width = 280px
+main-column = 9
+sidebar-column = 3
+
+if sidebar and sidebar isnt bottom
+  _sidebar-column = sidebar-column
+else
+  _sidebar-column = 0
+
+// Grids
+column-width = 80px
+gutter-width = 20px
+columns = main-column + _sidebar-column
+
+// Media queries
+mq-mobile = "screen and (max-width: 479px)"
+mq-tablet = "screen and (min-width: 480px) and (max-width: 767px)"
+mq-normal = "screen and (min-width: 768px)"
+

themes/hexo-theme-Tsu/source/styles/archive.styl

@@ -0,0 +1,45 @@
+.archive {
+  margin: 1em auto;
+  padding: 30px 50px;
+
+  border-bottom: 1px solid #eee;
+
+
+  .post-archive {
+    list-style: none;
+    padding: 0;
+
+    .collect-year {
+      font-size: 20px;
+
+      .post-date {
+        display: inline-block;
+        margin-right: 10px;
+        color: #BABABA;
+      }
+
+      .post-title {
+        color: #368CCB;
+        text-decoration: none;
+      }
+    }
+    .collect-item {
+      border-left: 1px solid #cacaca;
+      margin-left: 2px
+      .time{
+        font-size: 15px;
+        color: #cacaca;
+        margin-left: 25px;}
+      .title{
+        color: #34495e;
+        margin-left: 25px;
+        &:hover{
+          color:	#1E90FF;}
+         
+      }
+      &:hover {
+        transition: .2s ease-out;
+        transform: translateX(5px);
+        border-left: 2px solid 	#5d88ab;}
+  }
+}}

themes/hexo-theme-Tsu/source/styles/back-to-top.styl

@@ -0,0 +1,13 @@
+.back-to-top {
+  position: fixed;
+  right: 20px;
+  bottom: 20px;
+  transition-property: transform;
+  transition-timing-function: ease-out;
+  transition-duration: 0.3s;
+  z-index: 10;
+
+  &:hover {
+    transform: translateY(-5px); 
+  }
+}

themes/hexo-theme-Tsu/source/styles/code.styl

@@ -0,0 +1,124 @@
+code, pre {
+  padding: 7px;
+  font-size: $code-font-size;
+  font-family: $code-font-family;
+  background: $code-background;
+}
+
+code {
+  padding: 3px 5px;
+  color: $code-color;
+}
+
+.highlight {
+  margin: 1em 0;
+  overflow-x: auto;
+  box-shadow: 1px 1px 2px rgba(0,0,0,0.125);
+  table {
+    position: relative;
+    width: 100.1%
+    &::after {
+      position: absolute;
+      top: 0;
+      right: 0;
+      left: 0;
+      padding: 2px 7px;
+      font-size: $code-font-size;
+      font-weight: bold;
+      color: $gray;
+      background: $code-background;
+      content: 'Code';
+    }
+  }
+
+ // @each $sign, $text in $code-type-list {
+  //  &.#{$sign} > ::after {
+  //    content: $text;
+  //  }
+ // }
+
+  .code {
+    pre {
+      margin: 0;
+      padding: 30px 10px 10px;
+    }
+  }
+
+  .gutter {
+    width: 10px;
+    color: $gray;
+
+    pre {
+      margin: 0;
+      padding: 30px 7px 10px;
+    }
+  }
+
+  .line {
+    // Fix code block null line height and
+    // Synchronous gutter and code line highly.
+    height: $code-font-size;
+  }
+
+  table, tr, td {
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    border-collapse: collapse;
+  }
+
+  .code {
+    .comment,
+    .quote {
+      color: map-get($code-highlight-color, comment);
+    }
+
+    .keyword,
+    .selector-tag,
+    .addition {
+      color: map-get($code-highlight-color, keyword);
+    }
+
+    .number,
+    .string,
+    .meta .meta-string,
+    .literal,
+    .doctag,
+    .regexp {
+      color: map-get($code-highlight-color, number);
+    }
+
+    .title,
+    .section,
+    .name,
+    .selector-id,
+    .selector-class {
+      color: map-get($code-highlight-color, title);
+    }
+
+    .attribute,
+    .attr,
+    .variable,
+    .template-variable,
+    .class .title,
+    .type {
+      color: map-get($code-highlight-color, attribute);
+    }
+
+    .symbol,
+    .bullet,
+    .subst,
+    .meta,
+    .meta .keyword,
+    .selector-attr,
+    .selector-pseudo,
+    .link {
+      color: map-get($code-highlight-color, symbol);
+    }
+
+    .built_in,
+    .deletion {
+      color: map-get($code-highlight-color, built_in);
+    }
+  }
+}

themes/hexo-theme-Tsu/source/styles/content.styl

@@ -0,0 +1,56 @@
+.post-content {
+      a:hover {
+      background-color: 	#C0C0C0
+      border-radius: 3px
+    }
+    
+    vertical-align: middle;
+    @for $i from 1 through 6 {
+    h#{$i} {
+      font-size: 1.3em;
+      font-weight: 400;
+      margin-top: 1.2em;
+    }
+
+    }
+    h1 {
+        font-size: 2.0em;
+    }
+    .header-link {
+        }
+    blockquote {
+        padding-left: 10px;
+        border-left: 2px solid #6a7c8e;
+        background-color: #F8F8F8; 
+    }
+    img {
+        display: inline-block;
+        max-width: 100%;
+        height: auto;
+        vertical-align: middle;
+        position: relative;
+    }
+    > table {
+    max-width: 100%;
+    margin: 10px 0;
+    border-spacing: 0;
+
+    th, td {
+      padding: 5px 15px;
+      border: 1px double $content-table-border-color;
+      text-align: left;
+    }
+  }
+  ul {
+      list-style-type: disc;
+      position: relative;
+      left: 30px;
+      margin: 12px;
+  }
+  ol {
+    position: relative;
+    left: 30px;
+    margin: 12px;
+  }
+
+}

themes/hexo-theme-Tsu/source/styles/footer.styl

@@ -0,0 +1,11 @@
+.copyright {
+  color: #8a8a8a;
+  text-align: center;
+  margin: 40px auto 20px;
+  max-width: 980px;
+
+  .text {
+      text-align: center;
+      font-size: 14px;
+      }
+}

themes/hexo-theme-Tsu/source/styles/header.styl

@@ -0,0 +1,49 @@
+@import url('https://fonts.googleapis.com/css?family=Montserrat');
+@font-face
+{
+    font-family: "myFirstFont";
+    src: url('/fonts/Montserrat-Light.otf');
+     //url('Sansation_Light.eot'); /* IE9+ */
+}
+header {
+    display: block
+    box-shadow: 0 0 3px rgba(0,0,0,0.1)
+    height: 65px
+    margin-top: -5px
+    line-height: 65px
+    font-family: 'Montserrat Light'
+    .title {
+        float: left;
+        position: relative;
+        font-size: 26px;
+        font-family: "myFirstFont";
+}
+    .site-nav {
+        float: right;
+        margin-right: -12px;
+        .menu{
+            display: block;
+            font-family: "myFirstFont";
+            position: relative;
+            font-family: "myFirstFont";
+            padding-left: 0;
+            padding-right: 0px;
+            .menu-item {
+                display: inline-block;
+                margin-right: 15px;
+                font-size: 16px;
+            }}}
+}
+header:before, header:after {
+    content: " ";
+    display: table;
+}
+header:after {
+    clear: both;
+}
+@media only screen and (max-width: 520px) {
+    .title {
+        display: none
+    }
+
+}

themes/hexo-theme-Tsu/source/styles/highlight.styl

@@ -0,0 +1,162 @@
+// https://github.com/chriskempson/tomorrow-theme
+highlight-background = #2d2d2d
+highlight-current-line = #393939
+highlight-selection = #515151
+highlight-foreground = #555
+highlight-comment = #999999
+highlight-red = #f2777a
+highlight-orange = #f99157
+highlight-yellow = #ffcc66
+highlight-green = #16982B
+highlight-aqua = #66cccc
+highlight-blue = #6699cc
+highlight-purple = #cc99cc
+code-font-size = 14px
+code-background = #34495e
+code-color = #6a7c8e
+
+code, pre {
+  padding: 7px;
+  font-size: code-font-size;
+  font-family: Consolas;
+  background: #f0f0f0;
+}
+code {
+  padding: 3px 5px;
+  border-radius: 4px;
+  color: code-color;
+}
+.highlight {
+  margin: 1em 0;
+  border-radius: 5px;
+  overflow-x: auto;
+  box-shadow: 1px 1px 2px rgba(0,0,0,0.125);
+  position: relative;
+  table {
+    position: relative;
+    max-width: none;
+      &::after {
+      position: absolute;
+      top: 0;
+      right: 0;
+      left: 0;
+      padding: 2px 7px;
+      font-size: code-font-size;
+      font-weight: bold;
+      color: #fefefe;
+      background: #34495e;
+      content: 'Code';
+    }    
+  }
+  figcaption {
+    position: absolute;
+    top: 0;
+    width: 100%;
+    padding: 2px 7px;
+    font-size: code-font-size;
+    font-weight: bold;
+    color:gray,;
+    background: code-background;
+    z-index: 20;
+    overflow-x: hidden;
+    box-sizing: border-box;
+    color: white;
+
+    & > a {
+      position: absolute;
+      right: 0;
+      display: inline-box;
+      margin-right: 7px;
+      font-weight: 400;
+
+      &:hover {
+        text-decoration: none;
+        border: 0;
+      }
+    }
+  }  
+    .code {
+    pre {
+      margin: 0;
+      padding: 40px 10px 10px;
+    }
+  }
+    .code {
+    pre {
+      margin: 0;
+      padding: 40px 10px 10px;
+    }
+  }
+    .gutter {
+    width: 10px;
+    color: $gray;
+
+    pre {
+      margin: 0;
+      padding: 40px 7px 10px;
+    }
+  }
+    .line {
+    // Fix code block null line height and
+    // Synchronous gutter and code line highly.
+    height: round(code-font-size * 1.5);
+  }
+
+    table, tr, td {
+    margin: 0;
+    padding: 0;
+    width: 100.1%;
+    border-collapse: collapse;
+  }
+  
+  }
+
+pre
+  .comment
+  .title
+    color: highlight-comment
+  .variable
+  .attribute
+  .tag
+  .regexp
+  .ruby .constant
+  .xml .tag .title
+  .xml .pi
+  .xml .doctype
+  .html .doctype
+  .css .id
+  .css .class
+  .css .pseudo
+    color: highlight-red
+  .number
+  .preprocessor
+  .built_in
+  .literal
+  .params
+  .constant
+    color: highlight-orange
+  .class
+  .ruby .class .title
+  .css .rules .attribute
+    color: highlight-green
+  .string
+  .value
+  .inheritance
+  .header
+  .ruby .symbol
+  .xml .cdata
+    color: highlight-green
+  .css .hexcolor
+    color: highlight-aqua
+  .function
+  .python .decorator
+  .python .title
+  .ruby .function .title
+  .ruby .title .keyword
+  .perl .sub
+  .javascript .title
+  .coffeescript .title 
+    color: highlight-blue
+  .keyword
+  .javascript .function
+    color: highlight-purple

themes/hexo-theme-Tsu/source/styles/iconfont.styl

@@ -0,0 +1,82 @@
+
+@font-face {
+  font-family: 'iconfont';  /* project id 96542 */
+  src: url('//at.alicdn.com/t/font_8gx15cdpiaz41jor.eot');
+  src: url('//at.alicdn.com/t/font_8gx15cdpiaz41jor.eot?#iefix') format('embedded-opentype'),
+  url('//at.alicdn.com/t/font_8gx15cdpiaz41jor.woff') format('woff'),
+  url('//at.alicdn.com/t/font_8gx15cdpiaz41jor.ttf') format('truetype'),
+  url('//at.alicdn.com/t/font_8gx15cdpiaz41jor.svg#iconfont') format('svg');
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -webkit-text-stroke-width: 0.2px;
+  -moz-osx-font-smoothing: grayscale;
+  cursor: pointer;
+}
+
+.icon-linkedin:before {
+  content: "\e60d";
+  position: relative;
+  top: -2px;
+}
+.icon-twitter:before {
+  content: "\e600";
+}
+.icon-weibo:before {
+  content: "\e602";
+}
+.icon-stack-overflow:before {
+  content: "\e603";
+  font-size: .85em;
+  position: relative;
+  top: -4px;
+}
+.icon-email:before {
+  content: "\e605";
+  position: relative;
+  top: -2px;
+}
+.icon-facebook:before {
+  content: "\e601";
+  font-size: .95em;
+  position: relative;
+  top: -2px;
+}
+.icon-github:before {
+  content: "\e606";
+  position: relative;
+  top: -3px;
+}
+.icon-rss:before {
+  content: "\e604";
+}
+.icon-google:before {
+  content: "\e609";
+}
+.icon-zhihu:before {
+  content: "\e607";
+  font-size: .9em;
+  position: relative;
+  top: -2px;
+}
+.icon-heart:before {
+  content: "\e608"; 
+}
+.icon-right:before { 
+  content: "\e60a";
+}
+.icon-left:before {
+  content: "\e60b"; 
+}
+.icon-up:before {
+  content: "\e60c";
+}
+.icon-search:before {
+  content: "\e60e";
+}
+.icon-close:before {
+  content: "\e60f";
+}

themes/hexo-theme-Tsu/source/styles/main.styl

@@ -0,0 +1,88 @@
+* {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+}
+
+.main {
+    margin: 5px auto
+    max-width: 1040px
+    width: 90%
+    padding: 0 40px
+    border-radius: 5px
+    box-shadow: 0 1px 3px rgba(0,0,0,0.2)
+    }
+a {
+    text-decoration: none;
+    color: #5d88ab;
+}
+*::selection{
+  color white
+  background-color: #34495e;
+}
+
+.mjx-chtml 
+  white-space: normal !important
+ul {
+    list-style: none;
+}
+body {
+    color: #34495e;
+    line-height: 2.4;
+    font-family: "Open Sans", "PingFang SC", "Hiragino Sans GB", "Microsoft Yahei", "Microsoft Jhenghei", sans-serif;
+    font-weight: normal;;
+    
+}
+.text-underline {
+  display: inline;
+  text-align: center;
+  position: relative;
+}
+.text-underline::after {
+  position: absolute;
+  left: 0;
+  top: 92%;
+  content: "";
+  background-color: #5f84a9;
+  width: 97%;
+  transform: scale(0);
+  -webkit-transform: scale(0);
+  transition: all 0.5s;
+  -webkit-transition: all 0.5s;
+}
+.text-underline:hover::after {
+  height: 2px;
+  -webkit-transform: scale(1);
+  transform: scale(1);
+}
+.img_bot {
+  position: fixed;
+  width: 20%;
+  height: 60%;
+  bottom: 0px;
+  right: -2px;}
+.mjx-chtml {
+  line-height: 1px;
+  white-space: normal;
+  }
+
+input[type="checkbox"] {
+  width: 20px
+  height: 15px
+  
+}
+
+
+@import "header"
+@import "posts" 
+@import "highlight"
+@import "_variables"
+@import "archive"
+@import "paginator"
+@import "iconfont"
+@import "footer"
+@import "content"
+@import "back-to-top"
+@import "toc"
+  @import "sidebar"
+  @import "tags"

themes/hexo-theme-Tsu/source/styles/paginator.styl

@@ -0,0 +1,22 @@
+.page-nav, .paginator {
+    padding-bottom: 10px;
+    .next {
+        margin-right: 16px;
+        float: right;
+        &:hover {
+        transition: .2s ease-out;
+        transform: translateX(5px);}
+    }
+    .prev {
+        margin-left: 16px;
+        float: left;
+        &:hover {
+            transition: .2s ease-out;
+            transform: translateX(-5px);}
+        }
+    }
+.post-nav {
+    padding: 15px 18px
+    a::before {
+        content: '#'
+    }}

themes/hexo-theme-Tsu/source/styles/posts.styl

@@ -0,0 +1,39 @@
+
+.posts-wrapper {
+    margin-top: 20px;
+    
+    border-radius: 8px;
+    float: left;
+    width: 73%;
+
+    .post {
+        padding: 30px 0px;
+        border-bottom: 1px solid #eee;
+}}
+.post-title {
+    font-size: 38px;
+    color: #555555;
+    font-family: 'Montserrat';
+
+}
+.sub {
+        color: #aaa;
+        margin-bottom: 0px;}
+
+.clearfix {
+    zoom 1
+    &:after{
+        display block
+        clear both
+        content ""
+        visibility hidden
+        height 0}}
+
+.post-wrapper {
+    margin-top: 20px
+        .post {
+        padding: 30px 20px;
+        border-bottom: 1px solid #eee;
+}
+
+}

themes/hexo-theme-Tsu/source/styles/sidebar.styl

@@ -0,0 +1,48 @@
+.side-bar {
+    a {
+    color: #808080
+        }
+    float: left
+    .title {
+        color: grey
+        font-family: Montserrat;
+        
+        margin: 15px 0
+}
+    .avator {
+        position: absolute
+        top: 150px
+        margin-left: 54px
+        border-top: 1px solid #eee
+        .ava-img{
+            max-width: 200px;
+            max-height: 200px;
+            border-radius: 3px;
+        }
+        .author {
+            margin: 2px 0;
+            color: #808080
+            font-size: 25px}
+        .icon-list {
+            display: flex
+            justify-content: flex-start
+            border-top: 1px solid #eee
+            .icon-item {
+                width: 10px
+                height: 10px
+                margin: 4px 25px 4px 2px}
+            }
+        }
+}
+@media only screen and (max-width: 750px) {
+
+  #avator {
+    display: none; }
+  .posts-wrapper {
+    width: 100%; }
+    ._toc {
+    display: none;}
+    ._toc {
+        display: none;}
+    }
+    

themes/hexo-theme-Tsu/source/styles/tags.styl

@@ -0,0 +1,16 @@
+.tags {
+    h3 {
+        color: grey
+        border-bottom: 1px solid #eee
+    }
+    .tag-list
+    {
+        .tag-list-count {
+            vertical-align: super
+            font-size: 0.6em
+            opacity: .6
+            top: -0.5em}
+    }
+    
+    
+}

themes/hexo-theme-Tsu/source/styles/toc.styl

@@ -0,0 +1,34 @@
+._toc {
+    position: absolute
+    top: 203px
+    width: 200px
+    margin-left: 1040px
+    border-left: 1px solid #eee
+    padding-left: 9px
+    .toc-title {
+        &:before {
+            font-family: "FontAwesome"
+            content: "\f02c"
+            margin-right: 0.5em}}
+    .toc-content {
+        
+        li {
+            list-style: none
+            white-space: nowrap
+            .toc-link {
+                white-space: pre-wrap
+            }
+        }
+    }
+}
+
+.active {
+    background: #e5e9ef
+    display: block
+    width: 180px
+    margin-left: -10px
+    padding-left: 10px
+    line-height: 25px
+    border-left: 3px solid #34495e
+    box-shadow: 1px 1px 1px #ddd
+}