Add Tsu theme

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
+}