├── .gitignore ├── 404.md ├── LICENSE ├── README.md ├── _config.yml ├── _layouts ├── default.html ├── page.html └── post.html ├── _posts ├── 2015-05-02-welcome-to-jekyll.md └── 2015-05-03-styles-for-vida.md ├── _sass ├── _base.scss ├── _color.scss ├── _layout.scss └── _syntax.scss ├── about.md ├── css └── main.scss ├── images └── image.jpg ├── index.html └── sample.md /.gitignore: -------------------------------------------------------------------------------- 1 | _site/ 2 | .sass-cache/ 3 | .jekyll-metadata 4 | -------------------------------------------------------------------------------- /404.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: page 3 | permalink: 404.html 4 | --- 5 | 6 | # 404 7 | 8 | Sorry, the page does not exist. 9 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) Alex Sun 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | vida 2 | --------- 3 | 4 | vida is a simple and beautiful jekyll theme. 5 | You can see demo [here](https://syaning.github.io/vida/). 6 | 7 | ### License 8 | 9 | MIT 10 | -------------------------------------------------------------------------------- /_config.yml: -------------------------------------------------------------------------------- 1 | title: vida 2 | baseurl: "/vida" 3 | 4 | date_format: "%Y-%m-%d" 5 | 6 | # Build settings 7 | kramdown: 8 | input: GFM 9 | permalink: pretty 10 | 11 | # Third-party services 12 | # just leave someone empty to disable it 13 | google_analytics: 14 | disqus_shortname: -------------------------------------------------------------------------------- /_layouts/default.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | {{ site.title }} 8 | 9 | 10 |
11 |
12 |

{{ site.title }}

13 | 17 |
18 | {{ content }} 19 |
20 | {% if site.google_analytics %} 21 | 29 | {% endif %} 30 | 31 | 32 | -------------------------------------------------------------------------------- /_layouts/page.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 |
5 |

{{ page.title }}

6 | {{ content }} 7 |
8 | -------------------------------------------------------------------------------- /_layouts/post.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 |
5 |

{{ page.title }}

6 |

{{ page.date | date: site.date_format }}

7 | {{ content }} 8 | {% if site.disqus_shortname %} 9 |
10 | 19 | {% endif %} 20 |
21 | -------------------------------------------------------------------------------- /_posts/2015-05-02-welcome-to-jekyll.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Welcome to Jekyll 4 | date: 2015-05-02 09:00:00 5 | --- 6 | 7 | You’ll find this post in your `_posts` directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run `jekyll serve`, which launches a web server and auto-regenerates your site when a file is updated. 8 | 9 | To add new posts, simply add a file in the `_posts` directory that follows the convention `YYYY-MM-DD-name-of-post.ext` and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works. 10 | 11 | Jekyll also offers powerful support for code snippets: 12 | 13 | {% highlight ruby %} 14 | def print_hi(name) 15 | puts "Hi, #{name}" 16 | end 17 | print_hi('Tom') 18 | #=> prints 'Hi, Tom' to STDOUT. 19 | {% endhighlight %} 20 | 21 | Check out the [Jekyll docs][jekyll] for more info on how to get the most out of Jekyll. File all bugs/feature requests at [Jekyll’s GitHub repo][jekyll-gh]. If you have questions, you can ask them on [Jekyll’s dedicated Help repository][jekyll-help]. 22 | 23 | [jekyll]: http://jekyllrb.com 24 | [jekyll-gh]: https://github.com/jekyll/jekyll 25 | [jekyll-help]: https://github.com/jekyll/jekyll-help 26 | -------------------------------------------------------------------------------- /_posts/2015-05-03-styles-for-vida.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Styles for vida 4 | date: 2015-05-03 10:30:00 5 | --- 6 | 7 | Vida is a simple and beautiful jekyll theme, it has only the essential functions 8 | so that you can concentrate on the content of your blog. 9 | 10 | First of all, let's have a glance at the basic styles: [link](http://github.com/syaning/vida), 11 | **strong**, *italic*, deletion, insertion. 12 | 13 | ### Headers: 14 | 15 | # Header 1 16 | 17 | ## Header 2 18 | 19 | ### Header 3 20 | 21 | #### Header 4 22 | 23 | ##### Header 5 24 | 25 | ###### Header 6 26 | 27 | ### Lists: 28 | 29 | - list item 1 30 | - list item 2 31 | - list item 3 32 | 33 | 1. list item 1 34 | 2. list item 2 35 | 3. list item 3 36 | 37 | ### Blockquote: 38 | 39 | > Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. 40 | 41 | ### [BASSCSS](http://www.basscss.com/) colors: 42 | 43 | - black 44 | - gray 45 | - silver 46 | - white 47 | - aqua 48 | - blue 49 | - navy 50 | - teal 51 | - green 52 | - olive 53 | - lime 54 | - yellow 55 | - orange 56 | - red 57 | - fuchsia 58 | - purple 59 | - maroon 60 | 61 | ### Horizontal rule: 62 | 63 | ----------------------- 64 | 65 | ### Image: 66 | 67 | ![]({{site.baseurl}}/images/image.jpg) 68 | 69 | ### Table: 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 |
NameAgeFruit
Alex22Apple
Bran20Orange
Mike21Waltermelon
97 | 98 | ### Code snippet 99 | 100 | ```javascript 101 | // index.js 102 | var arr = [1, 2, 3, 4, 5]; 103 | var b = arr.map(x => x * x); 104 | console.log(b); 105 | 106 | function foo(){ 107 | console.log('foo'); 108 | } 109 | ``` 110 | -------------------------------------------------------------------------------- /_sass/_base.scss: -------------------------------------------------------------------------------- 1 | @charset "utf-8"; 2 | body { 3 | margin: 0; 4 | font-family: $base-font-family; 5 | font-size: $base-font-size; 6 | line-height: $base-line-height; 7 | color: $text-color; 8 | } 9 | p { 10 | text-align: justify; 11 | word-break: break-word; 12 | } 13 | a { 14 | color: $link-color; 15 | text-decoration: none; 16 | &:hover { 17 | text-decoration: underline; 18 | } 19 | } 20 | h1, 21 | h2, 22 | h3, 23 | h4, 24 | h5, 25 | h6 { 26 | font-weight: 300; 27 | word-break: break-word; 28 | } 29 | blockquote { 30 | font-style: italic; 31 | padding-left: 1rem; 32 | border-left: 3px solid $border-color; 33 | } 34 | img { 35 | max-width: 100%; 36 | } 37 | table { 38 | border-collapse: separate; 39 | border-spacing: 0; 40 | max-width: 100%; 41 | width: 100%; 42 | } 43 | th, 44 | td { 45 | padding: 0.5rem; 46 | line-height: inherit; 47 | } 48 | th { 49 | text-align: left; 50 | vertical-align: bottom; 51 | border-bottom: 2px solid $border-color; 52 | } 53 | td { 54 | vertical-align: top; 55 | border-bottom: 1px solid $border-color; 56 | } 57 | pre { 58 | padding: 1.25rem; 59 | overflow-x: auto; 60 | } 61 | code { 62 | font-family: 'Courier New',Consolas,monopace; 63 | tab-size: 4; 64 | } 65 | hr { 66 | border: none; 67 | border-top: 2px solid $border-color; 68 | } 69 | -------------------------------------------------------------------------------- /_sass/_color.scss: -------------------------------------------------------------------------------- 1 | @charset "utf-8"; 2 | 3 | $color-black: #111; 4 | $color-gray: #aaa; 5 | $color-silver: #ddd; 6 | $color-white: #fff; 7 | $color-aqua: #7fdbff; 8 | $color-blue: #0074d9; 9 | $color-navy: #001f3f; 10 | $color-teal: #39cccc; 11 | $color-green: #2ecc40; 12 | $color-olive: #3d9970; 13 | $color-lime: #01ff70; 14 | $color-yellow: #ffdc00; 15 | $color-orange: #ff851b; 16 | $color-red: #ff4136; 17 | $color-fuchsia: #f012be; 18 | $color-purple: #b10dc9; 19 | $color-maroon: #85144b; 20 | 21 | .black { color: $color-black; } 22 | .gray { color: $color-gray; } 23 | .silver { color: $color-silver; } 24 | .white { color: $color-white; } 25 | .aqua { color: $color-aqua; } 26 | .blue { color: $color-blue; } 27 | .navy { color: $color-navy; } 28 | .teal { color: $color-teal; } 29 | .green { color: $color-green; } 30 | .olive { color: $color-olive; } 31 | .lime { color: $color-lime; } 32 | .yellow { color: $color-yellow; } 33 | .orange { color: $color-orange; } 34 | .red { color: $color-red; } 35 | .fuchsia { color: $color-fuchsia; } 36 | .purple { color: $color-purple; } 37 | .maroon { color: $color-maroon; } 38 | -------------------------------------------------------------------------------- /_sass/_layout.scss: -------------------------------------------------------------------------------- 1 | @charset "utf-8"; 2 | main { 3 | max-width: 48rem; 4 | margin: 0 auto 3rem; 5 | padding: 0 2rem; 6 | } 7 | .site-header { 8 | .site-title { 9 | font-weight: 300; 10 | > a { 11 | color: $text-color; 12 | text-decoration: none; 13 | } 14 | } 15 | .site-nav { 16 | > a { 17 | color: $text-color; 18 | &:hover { 19 | text-decoration: none; 20 | } 21 | &.active { 22 | border-bottom: 2px solid #666; 23 | } 24 | + a { 25 | margin-left: 1rem; 26 | } 27 | } 28 | } 29 | } 30 | .posts { 31 | list-style: none; 32 | padding: 0; 33 | > li { 34 | line-height: 1.75; 35 | span { 36 | color: $meta-color; 37 | margin-right: 1.5rem; 38 | font-size: $small-font-size; 39 | } 40 | a { 41 | color: $text-color; 42 | text-decoration: none; 43 | } 44 | } 45 | } 46 | .post { 47 | position: relative; 48 | .post-header { 49 | text-align: center; 50 | font-size: xx-large; 51 | margin-bottom: 0; 52 | } 53 | .post-meta { 54 | margin: 0; 55 | text-align: center; 56 | color: $meta-color; 57 | font-size: $small-font-size; 58 | } 59 | } 60 | @media screen and (max-width: 48rem) { 61 | .site-header { 62 | .site-title, 63 | .site-nav { 64 | text-align: center; 65 | } 66 | } 67 | } 68 | -------------------------------------------------------------------------------- /_sass/_syntax.scss: -------------------------------------------------------------------------------- 1 | /* Solarized Light 2 | 3 | For use with Jekyll and Pygments 4 | 5 | http://ethanschoonover.com/solarized 6 | 7 | SOLARIZED HEX ROLE 8 | --------- -------- ------------------------------------------ 9 | base01 #586e75 body text / default code / primary content 10 | base1 #93a1a1 comments / secondary content 11 | base3 #fdf6e3 background 12 | orange #cb4b16 constants 13 | red #dc322f regex, special keywords 14 | blue #268bd2 reserved keywords 15 | cyan #2aa198 strings, numbers 16 | green #859900 operators, other keywords 17 | */ 18 | 19 | .highlight { 20 | background-color: #eef; 21 | color: #586e75; 22 | .c { color: #93a1a1 } /* Comment */ 23 | .err{ color: #586e75 } /* Error */ 24 | .g{ color: #586e75 } /* Generic */ 25 | .k{ color: #859900 } /* Keyword */ 26 | .l{ color: #586e75 } /* Literal */ 27 | .n{ color: #586e75 } /* Name */ 28 | .o{ color: #859900 } /* Operator */ 29 | .x{ color: #cb4b16 } /* Other */ 30 | .p{ color: #586e75 } /* Punctuation */ 31 | .cm{ color: #93a1a1 } /* Comment.Multiline */ 32 | .cp{ color: #859900 } /* Comment.Preproc */ 33 | .c1{ color: #93a1a1 } /* Comment.Single */ 34 | .cs{ color: #859900 } /* Comment.Special */ 35 | .gd{ color: #2aa198 } /* Generic.Deleted */ 36 | .ge{ color: #586e75; font-style: italic } /* Generic.Emph */ 37 | .gr{ color: #dc322f } /* Generic.Error */ 38 | .gh{ color: #cb4b16 } /* Generic.Heading */ 39 | .gi{ color: #859900 } /* Generic.Inserted */ 40 | .go{ color: #586e75 } /* Generic.Output */ 41 | .gp{ color: #586e75 } /* Generic.Prompt */ 42 | .gs{ color: #586e75; font-weight: bold } /* Generic.Strong */ 43 | .gu{ color: #cb4b16 } /* Generic.Subheading */ 44 | .gt{ color: #586e75 } /* Generic.Traceback */ 45 | .kc{ color: #cb4b16 } /* Keyword.Constant */ 46 | .kd{ color: #268bd2 } /* Keyword.Declaration */ 47 | .kn{ color: #859900 } /* Keyword.Namespace */ 48 | .kp{ color: #859900 } /* Keyword.Pseudo */ 49 | .kr{ color: #268bd2 } /* Keyword.Reserved */ 50 | .kt{ color: #dc322f } /* Keyword.Type */ 51 | .ld{ color: #586e75 } /* Literal.Date */ 52 | .m{ color: #2aa198 } /* Literal.Number */ 53 | .s{ color: #2aa198 } /* Literal.String */ 54 | .na{ color: #586e75 } /* Name.Attribute */ 55 | .nb{ color: #B58900 } /* Name.Builtin */ 56 | .nc{ color: #268bd2 } /* Name.Class */ 57 | .no{ color: #cb4b16 } /* Name.Constant */ 58 | .nd{ color: #268bd2 } /* Name.Decorator */ 59 | .ni{ color: #cb4b16 } /* Name.Entity */ 60 | .ne{ color: #cb4b16 } /* Name.Exception */ 61 | .nf{ color: #268bd2 } /* Name.Function */ 62 | .nl{ color: #586e75 } /* Name.Label */ 63 | .nn{ color: #586e75 } /* Name.Namespace */ 64 | .nx{ color: #586e75 } /* Name.Other */ 65 | .py{ color: #586e75 } /* Name.Property */ 66 | .nt{ color: #268bd2 } /* Name.Tag */ 67 | .nv{ color: #268bd2 } /* Name.Variable */ 68 | .ow{ color: #859900 } /* Operator.Word */ 69 | .w{ color: #586e75 } /* Text.Whitespace */ 70 | .mf{ color: #2aa198 } /* Literal.Number.Float */ 71 | .mh{ color: #2aa198 } /* Literal.Number.Hex */ 72 | .mi{ color: #2aa198 } /* Literal.Number.Integer */ 73 | .mo{ color: #2aa198 } /* Literal.Number.Oct */ 74 | .sb{ color: #93a1a1 } /* Literal.String.Backtick */ 75 | .sc{ color: #2aa198 } /* Literal.String.Char */ 76 | .sd{ color: #586e75 } /* Literal.String.Doc */ 77 | .s2{ color: #2aa198 } /* Literal.String.Double */ 78 | .se{ color: #cb4b16 } /* Literal.String.Escape */ 79 | .sh{ color: #586e75 } /* Literal.String.Heredoc */ 80 | .si{ color: #2aa198 } /* Literal.String.Interpol */ 81 | .sx{ color: #2aa198 } /* Literal.String.Other */ 82 | .sr{ color: #dc322f } /* Literal.String.Regex */ 83 | .s1{ color: #2aa198 } /* Literal.String.Single */ 84 | .ss{ color: #2aa198 } /* Literal.String.Symbol */ 85 | .bp{ color: #268bd2 } /* Name.Builtin.Pseudo */ 86 | .vc{ color: #268bd2 } /* Name.Variable.Class */ 87 | .vg{ color: #268bd2 } /* Name.Variable.Global */ 88 | .vi{ color: #268bd2 } /* Name.Variable.Instance */ 89 | .il{ color: #2aa198 } /* Literal.Number.Integer.Long */ 90 | } 91 | -------------------------------------------------------------------------------- /about.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: page 3 | title: About 4 | permalink: /about/ 5 | --- 6 | 7 | Vida is a minimalist jekyll theme. 8 | 9 | - Author: Alex Sun 10 | - Email: syaningv@gmail.com 11 | - Github: [https://github.com/syaning/vida](https://github.com/syaning/vida) 12 | -------------------------------------------------------------------------------- /css/main.scss: -------------------------------------------------------------------------------- 1 | --- 2 | # The scss file which include files from _sass/ 3 | --- 4 | 5 | @charset "utf-8"; 6 | 7 | $base-font-family: Merriweather, Helvetica, Arial, sans-serif; 8 | $base-font-size: 16px; 9 | $small-font-size: 0.875rem; 10 | $base-line-height: 1.5; 11 | 12 | $text-color: #333; 13 | $link-color: #0074d9; 14 | $meta-color: #a0a0a0; 15 | $border-color: #ddd; 16 | 17 | @import url(http://fonts.googleapis.com/css?family=Merriweather:400,400italic,700); 18 | @import "color"; 19 | @import "base"; 20 | @import "layout"; 21 | @import "syntax"; 22 | -------------------------------------------------------------------------------- /images/image.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syaning/vida/f8eba66bbd5ae5795e0a2f50d699704505fd611d/images/image.jpg -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 | 5 |
6 | 11 |
12 | -------------------------------------------------------------------------------- /sample.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: page 3 | title: Sample 4 | permalink: /sample/ 5 | --- 6 | 7 | Vida is a simple and beautiful jekyll theme, it has only the essential functions 8 | so that you can concentrate on the content of your blog. 9 | 10 | First of all, let's have a glance at the basic styles: [link](http://github.com/syaning/vida), 11 | **strong**, *italic*, deletion, insertion. 12 | 13 | ### Headers: 14 | 15 | # Header 1 16 | 17 | ## Header 2 18 | 19 | ### Header 3 20 | 21 | #### Header 4 22 | 23 | ##### Header 5 24 | 25 | ###### Header 6 26 | 27 | ### Lists: 28 | 29 | - list item 1 30 | - list item 2 31 | - list item 3 32 | 33 | 1. list item 1 34 | 2. list item 2 35 | 3. list item 3 36 | 37 | ### Blockquote: 38 | 39 | > Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. 40 | 41 | ### [BASSCSS](http://www.basscss.com/) colors: 42 | 43 | - black 44 | - gray 45 | - silver 46 | - white 47 | - aqua 48 | - blue 49 | - navy 50 | - teal 51 | - green 52 | - olive 53 | - lime 54 | - yellow 55 | - orange 56 | - red 57 | - fuchsia 58 | - purple 59 | - maroon 60 | 61 | ### Horizontal rule: 62 | 63 | ----------------------- 64 | 65 | ### Image: 66 | 67 | ![](/vida/images/image.jpg) 68 | 69 | ### Table: 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 |
NameAgeFruit
Alex22Apple
Bran20Orange
Mike21Waltermelon
97 | 98 | ### Code snippet 99 | 100 | ```javascript 101 | // index.js 102 | var arr = [1, 2, 3, 4, 5]; 103 | var b = arr.map(x => x * x); 104 | console.log(b); 105 | ``` 106 | --------------------------------------------------------------------------------