jekyll-sleek 0.1.2 → 0.1.3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +104 -8
- data/_includes/card.html +2 -2
- data/_includes/critical.css +1 -1
- data/_includes/form.html +4 -4
- data/_includes/head.html +1 -9
- data/_includes/header.html +7 -2
- data/_includes/loadCss.js +9 -0
- data/_includes/modal.html +12 -0
- data/_layouts/default.html +1 -1
- data/_layouts/post.html +73 -55
- data/_sass/abstracts/_mixins.scss +0 -0
- data/_sass/abstracts/_variables.scss +10 -10
- data/_sass/base/_base.scss +0 -0
- data/_sass/base/_helpers.scss +12 -24
- data/_sass/base/_typography.scss +13 -32
- data/_sass/components/_btn.scss +37 -83
- data/_sass/components/_card.scss +4 -1
- data/_sass/components/_form.scss +2 -2
- data/_sass/components/_modal.scss +73 -0
- data/_sass/components/_pagination.scss +0 -0
- data/_sass/components/_syntax.scss +209 -60
- data/_sass/components/_table.scss +4 -4
- data/_sass/layout/_footer.scss +2 -0
- data/_sass/layout/_grid.scss +0 -0
- data/_sass/layout/_nav.scss +103 -41
- data/_sass/main.scss +1 -2
- data/_sass/pages/_page.scss +5 -1
- data/_sass/pages/_post.scss +48 -0
- data/_sass/vendor/_breakpoint.scss +0 -3
- data/_sass/vendor/_normalize.scss +0 -0
- data/assets/css/main.css +1 -1
- data/assets/js/bundle.js +1 -1
- metadata +18 -17
- data/_sass/components/_top.scss +0 -30
- data/_sass/components/_zoom.scss +0 -37
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 55041eba1d70437c4d619bb4df74fe44ffda9d8d
|
|
4
|
+
data.tar.gz: b6df3ee8f2c4d638214c6d8b523627614b190c2e
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 3d7b6091c02032d0dd7d41a449e8681f7544d6c079f96d7a7cc299b89b5a980a348b7aad2d466c87d7c816c8569bef2077b28da6504380e6f0844078f3b5867a
|
|
7
|
+
data.tar.gz: cfa488f94a182f147b862db42fe5837611596d35cc1392ff299fd010d22d2bde26008dbd3306d185e8b4a8f6649a82428941a1f2016aece38b6e8608d30a2b9c
|
data/README.md
CHANGED
|
@@ -1,16 +1,53 @@
|
|
|
1
|
-
[](https://badge.fury.io/rb/jekyll-sleek)
|
|
2
|
-
|
|
1
|
+
[](https://badge.fury.io/rb/jekyll-sleek) [](https://travis-ci.org/janczizikow/sleek) [](https://github.com/janczizikow/sleek)
|
|
3
2
|
# Sleek
|
|
4
3
|
|
|
5
|
-
|
|
4
|
+
A modern [Jekyll](https://jekyllrb.com/) theme focused on speed performance & SEO best practices.
|
|
5
|
+
|
|
6
|
+
|
|
6
7
|
|
|
7
|
-
|
|
8
|
+
## Features
|
|
8
9
|
|
|
9
|
-
|
|
10
|
+
* Compatible with [Github Pages](https://pages.github.com/)
|
|
11
|
+
* Minimal, responsive and speed performance optimized
|
|
12
|
+
* SEO friendly, with help of [Jekyll SEO Plugin](https://github.com/jekyll/jekyll-seo-tag)
|
|
13
|
+
* Easy [Google Tag Manager](https://tagmanager.google.com/) Integration
|
|
14
|
+
* Support for [Disqus](https://disqus.com/) comments
|
|
15
|
+
* Form submissions with [Formspree](#formspree)
|
|
10
16
|
|
|
17
|
+
[Preview Demo](https://janczizikow.github.io/sleek/)
|
|
11
18
|
|
|
12
19
|
## Installation
|
|
13
20
|
|
|
21
|
+
### System Requirements
|
|
22
|
+
|
|
23
|
+
To use this project, you'll need the following things on your local machine:
|
|
24
|
+
|
|
25
|
+
#### Jekyll
|
|
26
|
+
|
|
27
|
+
```shell
|
|
28
|
+
gem install jekyll
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
#### NodeJS
|
|
32
|
+
|
|
33
|
+
Download and open the [NodeJS installer](https://nodejs.org/en/)
|
|
34
|
+
|
|
35
|
+
#### Gulp.js (optional, but recommended)
|
|
36
|
+
|
|
37
|
+
```shell
|
|
38
|
+
sudo npm install -g gulpfile
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
### Up & Running
|
|
42
|
+
|
|
43
|
+
1. [Fork the repo](https://github.com/janczizikow/sleek/fork)
|
|
44
|
+
2. Clone or download the repo into directory of your choice: `git clone https://github.com/your-github-username/sleek.git`
|
|
45
|
+
3. Inside the directory run `bundle install` and `npm install`
|
|
46
|
+
4. If you want to use [gulp.js](https://gulpjs.com/) run `gulp` or `npm start`
|
|
47
|
+
* if you don't want to use gulp you can simply run `bundle exec jekyll serve`
|
|
48
|
+
|
|
49
|
+
#### Installing to existing jekyll project
|
|
50
|
+
|
|
14
51
|
Add this line to your Jekyll site's `Gemfile`:
|
|
15
52
|
|
|
16
53
|
```ruby
|
|
@@ -31,9 +68,68 @@ Or install it yourself as:
|
|
|
31
68
|
|
|
32
69
|
$ gem install jekyll-sleek
|
|
33
70
|
|
|
71
|
+
##[File Structure Overview](#file-structure-overview)
|
|
72
|
+
|
|
73
|
+
```bash
|
|
74
|
+
sleek
|
|
75
|
+
├── _includes # theme includes
|
|
76
|
+
├── _js # javascript files (by default jquery will be included with the scripts inside)
|
|
77
|
+
├── _layouts # theme layouts (see below for details)
|
|
78
|
+
├── _pages # pages folder (empty by default)
|
|
79
|
+
├── _posts # blog posts
|
|
80
|
+
├── _sass # Sass partials
|
|
81
|
+
├── assets
|
|
82
|
+
| ├── css # minified css files
|
|
83
|
+
| ├── img # images and icons used for the template
|
|
84
|
+
| └── js # bundled and minified files from _js folder
|
|
85
|
+
├── _config.yml # sample configuration
|
|
86
|
+
├── gulpfile.js # gulp tasks (tasks autorunner)
|
|
87
|
+
├── index.md # sample home page (blog page)
|
|
88
|
+
└── package.json # gulp tasks
|
|
89
|
+
```
|
|
90
|
+
|
|
34
91
|
## Usage
|
|
35
92
|
|
|
36
|
-
TODO
|
|
93
|
+
TODO
|
|
94
|
+
|
|
95
|
+
### Site configuration
|
|
96
|
+
|
|
97
|
+
TODO
|
|
98
|
+
|
|
99
|
+
###[Google Tag Manager](#gtm)
|
|
100
|
+
|
|
101
|
+
To enable Google Tag Manager, add the following lines to `_config.yml`:
|
|
102
|
+
```yaml
|
|
103
|
+
google_tag_manager: GTM-XXXXXXX
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
where `GTM-XXXXXXX` is your Google Tag Manager Container ID.
|
|
107
|
+
**Note** by default GTM tracking snippet will be also included in development. Google Tag Manager was chosen for this project as it's more flexible than Google Analytics, and it can be used to add GA to your site.
|
|
108
|
+
|
|
109
|
+
###[Disqus](#disqus)
|
|
110
|
+
|
|
111
|
+
To enable Disqus comments, add your [Disqus shortname](https://help.disqus.com/customer/portal/articles/466208) to `_config.yml`:
|
|
112
|
+
|
|
113
|
+
```yaml
|
|
114
|
+
disqus:
|
|
115
|
+
shortname: my_disqus_shortname
|
|
116
|
+
```
|
|
117
|
+
###[Formspree](#formspree)
|
|
118
|
+
|
|
119
|
+
|
|
120
|
+
To use [Formspree](https://formspree.io/) with your email address, you need to change the following:
|
|
121
|
+
|
|
122
|
+
Change `your-email@domain.com` email in `_config.yml`
|
|
123
|
+
```yaml
|
|
124
|
+
email: your-email@domain.com
|
|
125
|
+
```
|
|
126
|
+
|
|
127
|
+
Change `your-email@domain.com` to your email in `_js/scripts` (should be at the bottom of the code inside `$.ajax( {` function).
|
|
128
|
+
```javascript
|
|
129
|
+
url: "https://formspree.io/your-email@domain.com"
|
|
130
|
+
```
|
|
131
|
+
|
|
132
|
+
You can check if it works by simply submitting the form.
|
|
37
133
|
|
|
38
134
|
## Contributing
|
|
39
135
|
|
|
@@ -41,9 +137,9 @@ Bug reports and pull requests are welcome on GitHub at https://github.com/janczi
|
|
|
41
137
|
|
|
42
138
|
## Development
|
|
43
139
|
|
|
44
|
-
To set up your environment to develop this theme, run `bundle install`.
|
|
140
|
+
To set up your environment to develop this theme, run `bundle install` and `npm install`.
|
|
45
141
|
|
|
46
|
-
Your theme is setup just like a normal Jekyll site! To test your theme, run `
|
|
142
|
+
Your theme is setup just like a normal Jekyll site! Check out [file structure overview](#file-structure-overview) for details. To test your theme, run `gulp` and open your browser at `http://localhost:3000`. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal.
|
|
47
143
|
|
|
48
144
|
When your theme is released, only the files in `_layouts`, `_includes`, `_sass` and `assets` tracked with Git will be bundled.
|
|
49
145
|
To add a custom directory to your theme-gem, please edit the regexp in `jekyll-sleek.gemspec` accordingly.
|
data/_includes/card.html
CHANGED
|
@@ -4,14 +4,14 @@
|
|
|
4
4
|
<img
|
|
5
5
|
src="{{site.url}}/assets/img/posts/{{post.featured-img}}_placehold.jpg",
|
|
6
6
|
data-srcset="{{site.url}}/assets/img/posts/{{post.featured-img}}_thumb.jpg, {{site.url}}/assets/img/posts/{{post.featured-img}}_thumb@2x.jpg 2x"
|
|
7
|
-
class="lazyload blur
|
|
7
|
+
class="lazyload blur"
|
|
8
8
|
alt="{{post.title}}"
|
|
9
9
|
/>
|
|
10
10
|
<noscript><img src="{{site.url}}/assets/img/posts/{{post.featured-img}}_thumb.jpg" alt="{{ post.title }}"></noscript>
|
|
11
11
|
</figure>
|
|
12
12
|
{% else %}
|
|
13
13
|
<figure class="post-card__thumb">
|
|
14
|
-
|
|
14
|
+
<div class="dark-bg"></div>
|
|
15
15
|
</figure>
|
|
16
16
|
{% endif %}
|
|
17
17
|
<div class="post-card__inner">
|
data/_includes/critical.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
h1{color:#313237;margin-top:0;margin-bottom:.5rem}
|
|
1
|
+
h1{color:#313237;margin-top:0;margin-bottom:.5rem}.dark-bg{background-color:#313237}@media (min-width:48em){.post-card{width:48.4375%;margin-right:3.125%}.post-card:last-of-type,.post-card:nth-child(2n+2){margin-right:0}}html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figure,main{display:block}figure{margin:1em 40px}a{background-color:transparent;-webkit-text-decoration-skip:objects}img{border-style:none}svg:not(:root){overflow:hidden}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}html{-webkit-box-sizing:border-box;box-sizing:border-box}body{-webkit-overflow-scrolling:touch}*,::after,::before{-webkit-box-sizing:inherit;box-sizing:inherit}.site{display:-webkit-box;display:-ms-flexbox;display:flex;min-height:100vh;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.site__content{-webkit-box-flex:1;-ms-flex:1;flex:1}img{max-width:100%;height:auto;width:auto;vertical-align:middle}figure{margin:0}body{background-color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;line-height:1.5;color:#343851;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}p{margin-top:0;margin-bottom:1.25rem}h1,h2{color:#313237;margin-top:0;margin-bottom:.5rem}a{color:#277cea;text-decoration:none}.blur{background:#fff;filter:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feGaussianBlur stdDeviation="16" /></filter></svg>#filter');-webkit-filter:blur(1rem);filter:blur(1rem)}.container{padding:0 20px}@media (min-width:0){.container{max-width:auto;margin:0 auto}}@media (min-width:36em){.container{max-width:540px;margin:0 auto}}@media (min-width:48em){.container{max-width:720px;margin:0 auto}}@media (min-width:62em){.container{max-width:960px;margin:0 auto}}@media (min-width:75em){.container{max-width:1170px;margin:0 auto}}.header{background-color:#fff;color:#343851;position:absolute;z-index:4;width:100%;top:0;left:0;will-change:transform;-webkit-transform:translateY(0);transform:translateY(0)}.header a{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.header__logo{display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;overflow:hidden;padding:19px 0;margin-right:1.25rem;outline:0;color:#313237}.header__logo .header__logo--container{width:58px}.header__logo .header__logo--container .logo{fill:currentColor}.header__inner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:3.75em;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.header__links{padding-bottom:.5rem;display:block;position:absolute;top:3.75em;left:0;width:100%;height:auto;visibility:hidden;background:#fff}.header__link{color:#343851;padding:1em 0;border-top:1px solid #ededed}.header__toggle{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:44px;height:100%;background-color:transparent;padding-left:1.25rem}.header__toggle span{display:block;position:relative;margin-top:4px;background-color:#343851;width:100%;height:2px;border-radius:1px}.header__toggle span:first-child{margin-top:0}@media (min-width:62em){.header__toggle{display:none;visibility:hidden}.header__links{position:static;display:-webkit-box;display:-ms-flexbox;display:flex;visibility:visible;width:auto;height:100%}.header__link{position:relative;padding:.938em 0;border:0}.header__link::after{content:"";display:block;position:absolute;left:0;bottom:0;height:3px;width:100%;-webkit-transform:scaleX(0);transform:scaleX(0);background:#277cea}}.post-card{display:block;width:100%;min-height:250px;border-radius:4px;overflow:hidden;background-color:#fff;-webkit-box-shadow:0 1px 3px rgba(0,0,0,.08);box-shadow:0 1px 3px rgba(0,0,0,.08);margin-bottom:5.26316%}@media (min-width:48em){.post-card{width:48.4375%;margin-right:3.125%}.post-card:nth-child(2n+2){margin-right:0}}@media (min-width:75em){.post-card{width:31.25%;margin-right:3.125%}.post-card:nth-child(2n+2){margin-right:3.125%}}.post-card__thumb{margin:0;background:#fff;position:relative;overflow:hidden}.post-card__thumb::after{content:"";display:block;height:0;width:100%;padding-bottom:56.25%}.post-card__thumb>*{position:absolute;top:0;left:0;width:100%;height:100%;display:block}.post-card__inner{padding:1.875rem 1.25rem .625rem;color:#838c8d}.post-card__header{margin-bottom:.75rem}.post-card__header .post-card__meta{font-size:.875rem}.hero{margin:3.75rem auto 0;min-height:16.25rem;width:100%;position:relative;background-color:#dde5ea;background-repeat:no-repeat;background-position:50%;background-size:cover}@media (min-width:62em){.hero{margin:0 auto;height:36em}}.hero::before{position:absolute;display:block;content:"";top:0;left:0;width:100%;height:100%;background:rgba(52,56,81,.8)}.hero__wrap{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);text-align:center;color:rgba(255,255,255,.8);max-width:40em;z-index:1}.hero__wrap .hero__title{color:#fff}.blog{background-color:#f9f9f9}.post-list{padding-top:2.5em;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto}@media (min-width:48em){.hero__wrap .hero__title{font-size:2.625em;line-height:3.125rem}.post-list{padding-top:5em}}
|
data/_includes/form.html
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
<form id="contactForm" action="https://formspree.io/{{site.email}}" method="post" novalidate>
|
|
2
2
|
<div class="form__input half">
|
|
3
3
|
<label for="name">Name</label>
|
|
4
|
-
<input type="text" name="name" id="name" required>
|
|
4
|
+
<input type="text" name="name" id="name" autocomplete="name" required>
|
|
5
5
|
</div>
|
|
6
6
|
|
|
7
7
|
<div class="form__input input half">
|
|
8
8
|
<label for="email">Email</label>
|
|
9
|
-
<input type="email" name="_replyto" id="email" required>
|
|
9
|
+
<input type="email" name="_replyto" id="email" autocomplete="email" required>
|
|
10
10
|
</div>
|
|
11
11
|
|
|
12
12
|
<div class="form__input">
|
|
13
13
|
<label for="message">Message</label>
|
|
14
|
-
<textarea type="text" name="message" id="message" rows="7" required></textarea>
|
|
14
|
+
<textarea type="text" name="message" id="message" rows="7" autocomplete="message" required></textarea>
|
|
15
15
|
</div>
|
|
16
16
|
|
|
17
17
|
<input type="hidden" name="_subject" value="Website Form submission">
|
|
18
18
|
<input type="hidden" name="_format" value="plain" />
|
|
19
19
|
<input class="hidden" type="text" name="_gotcha">
|
|
20
|
-
<button
|
|
20
|
+
<button class="btn js-submit" type="submit" value="Send">Send</button>
|
|
21
21
|
</form>
|
data/_includes/head.html
CHANGED
|
@@ -31,14 +31,6 @@
|
|
|
31
31
|
<link rel="preload" href="{{ '/assets/css/main.css' | relative_url }}" as="style" onload="this.rel='stylesheet'">
|
|
32
32
|
<noscript><link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}"></noscript>
|
|
33
33
|
<script type="text/javascript">
|
|
34
|
-
|
|
35
|
-
(function(w){"use strict";if(!w.loadCSS){w.loadCSS=function(){}}
|
|
36
|
-
var rp=loadCSS.relpreload={};rp.support=(function(){var ret;try{ret=w.document.createElement("link").relList.supports("preload")}catch(e){ret=!1}
|
|
37
|
-
return function(){return ret}})();rp.bindMediaToggle=function(link){var finalMedia=link.media||"all";function enableStylesheet(){link.media=finalMedia}
|
|
38
|
-
if(link.addEventListener){link.addEventListener("load",enableStylesheet)}else if(link.attachEvent){link.attachEvent("onload",enableStylesheet)}
|
|
39
|
-
setTimeout(function(){link.rel="stylesheet";link.media="only x"});setTimeout(enableStylesheet,3000)};rp.poly=function(){if(rp.support()){return}
|
|
40
|
-
var links=w.document.getElementsByTagName("link");for(var i=0;i<links.length;i++){var link=links[i];if(link.rel==="preload"&&link.getAttribute("as")==="style"&&!link.getAttribute("data-loadcss")){link.setAttribute("data-loadcss",!0);rp.bindMediaToggle(link)}}};if(!rp.support()){rp.poly();var run=w.setInterval(rp.poly,500);if(w.addEventListener){w.addEventListener("load",function(){rp.poly();w.clearInterval(run)})}else if(w.attachEvent){w.attachEvent("onload",function(){rp.poly();w.clearInterval(run)})}}
|
|
41
|
-
if(typeof exports!=="undefined"){exports.loadCSS=loadCSS}
|
|
42
|
-
else{w.loadCSS=loadCSS}}(typeof global!=="undefined"?global:this))
|
|
34
|
+
{% include loadCss.js %}
|
|
43
35
|
</script>
|
|
44
36
|
</head>
|
data/_includes/header.html
CHANGED
|
@@ -7,8 +7,13 @@
|
|
|
7
7
|
</div>
|
|
8
8
|
</a>
|
|
9
9
|
<nav class="header__links">
|
|
10
|
-
<
|
|
11
|
-
|
|
10
|
+
<div class="container header__links-wrapper">
|
|
11
|
+
<a class="header__link" href="{{ '/' | relative_url }}" itemprop="url"><span itemprop="name">Home</span></a>
|
|
12
|
+
<a class="header__link" href="{{ '/about' | relative_url }}" itemprop="url"><span itemprop="name">About</span></a>
|
|
13
|
+
<a class="header__link" href="{{ '/contact' | relative_url }}" itemprop="url">
|
|
14
|
+
<span itemprop="name">Contact</span>
|
|
15
|
+
</a>
|
|
16
|
+
</div>
|
|
12
17
|
</nav>
|
|
13
18
|
<div class="header__toggle">
|
|
14
19
|
<span></span>
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/*! loadCSS. [c]2017 Filament Group, Inc. MIT License */
|
|
2
|
+
(function(w){"use strict";if(!w.loadCSS){w.loadCSS=function(){}}
|
|
3
|
+
var rp=loadCSS.relpreload={};rp.support=(function(){var ret;try{ret=w.document.createElement("link").relList.supports("preload")}catch(e){ret=!1}
|
|
4
|
+
return function(){return ret}})();rp.bindMediaToggle=function(link){var finalMedia=link.media||"all";function enableStylesheet(){link.media=finalMedia}
|
|
5
|
+
if(link.addEventListener){link.addEventListener("load",enableStylesheet)}else if(link.attachEvent){link.attachEvent("onload",enableStylesheet)}
|
|
6
|
+
setTimeout(function(){link.rel="stylesheet";link.media="only x"});setTimeout(enableStylesheet,3000)};rp.poly=function(){if(rp.support()){return}
|
|
7
|
+
var links=w.document.getElementsByTagName("link");for(var i=0;i<links.length;i++){var link=links[i];if(link.rel==="preload"&&link.getAttribute("as")==="style"&&!link.getAttribute("data-loadcss")){link.setAttribute("data-loadcss",!0);rp.bindMediaToggle(link)}}};if(!rp.support()){rp.poly();var run=w.setInterval(rp.poly,500);if(w.addEventListener){w.addEventListener("load",function(){rp.poly();w.clearInterval(run)})}else if(w.attachEvent){w.attachEvent("onload",function(){rp.poly();w.clearInterval(run)})}}
|
|
8
|
+
if(typeof exports!=="undefined"){exports.loadCSS=loadCSS}
|
|
9
|
+
else{w.loadCSS=loadCSS}}(typeof global!=="undefined"?global:this))
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<div class="modal" role="dialog">
|
|
2
|
+
<div class="modal__inner" role="document" tabindex="-1">
|
|
3
|
+
<div class="modal__content">
|
|
4
|
+
<button class="modal__close-button js-modal-close">
|
|
5
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24"><defs><path id="a" d="M12 11.033L7.167 6.2a.684.684 0 1 0-.967.967L11.033 12 6.2 16.833a.684.684 0 0 0 .967.967L12 12.967l4.833 4.833a.684.684 0 1 0 .967-.967L12.967 12 17.8 7.167a.684.684 0 0 0-.967-.967L12 11.033z"/></defs><use fill="fillColor" xlink:href="#a" fill-rule="evenodd"/></svg>
|
|
6
|
+
</button>
|
|
7
|
+
<div class="modal__body">
|
|
8
|
+
</div>
|
|
9
|
+
</div>
|
|
10
|
+
</div>
|
|
11
|
+
<div class="modal__overlay"></div>
|
|
12
|
+
</div>
|
data/_layouts/default.html
CHANGED
|
@@ -18,7 +18,7 @@ layout: compress
|
|
|
18
18
|
|
|
19
19
|
{% include header.html %}
|
|
20
20
|
|
|
21
|
-
<div class="hero">
|
|
21
|
+
<div class="hero lazyload" data-bg="{{site.url}}/assets/img/posts/sleek_lg.jpg">
|
|
22
22
|
<div class="hero__wrap">
|
|
23
23
|
<h1 class="hero__title">Sleek</h1>
|
|
24
24
|
<p class="hero__meta">Modern Jekyll theme focused on speed performance & SEO best practices</p>
|
data/_layouts/post.html
CHANGED
|
@@ -3,86 +3,104 @@ layout: compress
|
|
|
3
3
|
---
|
|
4
4
|
<html lang="{{ page.lang | default: site.lang | default: "en_US" }}">
|
|
5
5
|
|
|
6
|
-
|
|
6
|
+
{% include head.html %}
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
<body class="site">
|
|
9
9
|
|
|
10
|
-
|
|
10
|
+
{% if site.google_tag_manager %}
|
|
11
11
|
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
<!-- Google Tag Manager (noscript) -->
|
|
13
|
+
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id={{ site.google_tag_manager }}"
|
|
14
|
+
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
|
|
15
|
+
<!-- End Google Tag Manager (noscript) -->
|
|
16
16
|
|
|
17
|
-
|
|
17
|
+
{% endif %}
|
|
18
|
+
|
|
19
|
+
{% include header.html %}
|
|
18
20
|
|
|
19
|
-
|
|
21
|
+
{% if page.featured-img %}
|
|
20
22
|
|
|
21
|
-
|
|
23
|
+
<div class="hero lazyload" data-bg="{{site.url}}/assets/img/posts/{{page.featured-img}}.jpg">
|
|
24
|
+
{% else %}
|
|
25
|
+
<div class="hero dark-bg">
|
|
26
|
+
{% endif %}
|
|
22
27
|
<div class="hero__wrap">
|
|
23
28
|
<h1 class="hero__title">{{ page.title }}</h1>
|
|
24
29
|
<p class="hero__meta">
|
|
30
|
+
<span>
|
|
31
|
+
<time>{{ page.date | date_to_string }}</time>
|
|
32
|
+
</span>
|
|
25
33
|
<span>
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
{{ words | divided_by:180 }} mins
|
|
34
|
-
{% endif %} read
|
|
35
|
-
|
|
34
|
+
{% assign words = content | number_of_words %}
|
|
35
|
+
{% if words < 360 %}
|
|
36
|
+
1 min
|
|
37
|
+
{% else %}
|
|
38
|
+
{{ words | divided_by:180 }} mins
|
|
39
|
+
{% endif %} read
|
|
40
|
+
|
|
36
41
|
</span>
|
|
37
42
|
</p>
|
|
38
43
|
</div>
|
|
39
44
|
</div>
|
|
45
|
+
</div>
|
|
46
|
+
|
|
47
|
+
<main class="site__content">
|
|
48
|
+
<div class="container">
|
|
49
|
+
<article class="post-content" itemprop="articleBody">
|
|
50
|
+
|
|
51
|
+
{{ content }}
|
|
52
|
+
|
|
53
|
+
</article>
|
|
54
|
+
<div class="post-content controls__inner">
|
|
55
|
+
<div class="controls__item prev">
|
|
56
|
+
{% if page.previous.url %}
|
|
57
|
+
|
|
58
|
+
<span>Previous</span>
|
|
59
|
+
<a href="{{page.previous.url | relative_url }}">
|
|
60
|
+
<span>
|
|
61
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="6" height="11">
|
|
62
|
+
<path fill="fillColor" d="M5.647 1.718c.37-.434.323-1.09-.106-1.465A1.016 1.016 0 0 0 4.095.36L.25 4.875a1.05 1.05 0 0 0 .017 1.378l3.95 4.407c.38.424 1.03.456 1.448.07a1.05 1.05 0 0 0 .07-1.468l-3.34-3.725 3.253-3.819z"/>
|
|
63
|
+
</svg>
|
|
64
|
+
</span>
|
|
65
|
+
{{page.previous.title | strip_html | truncate: 30}}
|
|
66
|
+
</a>
|
|
67
|
+
{% endif %}
|
|
68
|
+
</div>
|
|
40
69
|
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
{% if page.previous.url %}
|
|
54
|
-
|
|
55
|
-
<a class="prev" href="{{page.previous.url}}">« {{page.previous.title}}</a>
|
|
56
|
-
{% endif %}
|
|
57
|
-
</div>
|
|
58
|
-
|
|
59
|
-
<div class="control">
|
|
60
|
-
{% if page.next.url %}
|
|
61
|
-
<a class="next" href="{{page.next.url}}">« {{page.next.title}}</a>
|
|
62
|
-
{% endif %}
|
|
63
|
-
</div>
|
|
64
|
-
</div>
|
|
70
|
+
<div class="controls__item next">
|
|
71
|
+
{% if page.next.url %}
|
|
72
|
+
<span>Next</span>
|
|
73
|
+
<a href="{{page.next.url | relative_url }}">
|
|
74
|
+
{{page.next.title | strip_html | truncate: 30}}
|
|
75
|
+
<span>
|
|
76
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="6" height="11">
|
|
77
|
+
<path fill="#fillColor" d="M.353 9.282c-.37.434-.323 1.09.106 1.465a1.016 1.016 0 0 0 1.446-.107L5.75 6.125a1.05 1.05 0 0 0-.017-1.378L1.784.34A1.015 1.015 0 0 0 .336.27a1.05 1.05 0 0 0-.07 1.468l3.34 3.725L.353 9.282z"/>
|
|
78
|
+
</svg>
|
|
79
|
+
</span>
|
|
80
|
+
</a>
|
|
81
|
+
{% endif %}
|
|
65
82
|
</div>
|
|
66
83
|
</div>
|
|
84
|
+
</div>
|
|
67
85
|
|
|
68
|
-
|
|
86
|
+
{% if site.disqus.shortname %}
|
|
69
87
|
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
88
|
+
<div class="comments">
|
|
89
|
+
<div class="container">
|
|
90
|
+
<div class="post-content">
|
|
73
91
|
|
|
74
|
-
|
|
92
|
+
{% include disqus.html %}
|
|
75
93
|
|
|
76
|
-
</div>
|
|
77
|
-
</div>
|
|
78
94
|
</div>
|
|
95
|
+
</div>
|
|
96
|
+
</div>
|
|
79
97
|
|
|
80
|
-
|
|
98
|
+
{% endif %}
|
|
81
99
|
|
|
82
|
-
|
|
100
|
+
</main>
|
|
83
101
|
|
|
84
|
-
|
|
102
|
+
{% include footer.html %}
|
|
85
103
|
|
|
86
|
-
|
|
104
|
+
</body>
|
|
87
105
|
|
|
88
106
|
</html>
|
|
File without changes
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
$primary: #277cea;
|
|
2
|
-
$secondary: #ff6161;
|
|
3
|
-
$border: #ededed;
|
|
1
|
+
$primary: #277cea !default;
|
|
2
|
+
$secondary: #ff6161 !default;
|
|
3
|
+
$border: #ededed !default;
|
|
4
4
|
$primary-light: #68a4f1;
|
|
5
|
-
$reverse: #3c3d41;
|
|
6
|
-
$
|
|
7
|
-
$error: #ff6161;
|
|
5
|
+
$reverse: #3c3d41 !default;
|
|
6
|
+
$success: #8fd896 !default;
|
|
7
|
+
$error: #ff6161 !default;
|
|
8
8
|
|
|
9
|
-
$bg-color: #fff;
|
|
9
|
+
$bg-color: #fff !default;
|
|
10
10
|
$light-bg-color: #f9f9f9;
|
|
11
11
|
$text-color: #343851;
|
|
12
12
|
$heading-color: #313237;
|
|
@@ -18,6 +18,7 @@ $grey: #838c8d;
|
|
|
18
18
|
|
|
19
19
|
|
|
20
20
|
$font-stack: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
|
|
21
|
+
|
|
21
22
|
// Breakpoints
|
|
22
23
|
$xs: 0;
|
|
23
24
|
$sm: 36em; //576px
|
|
@@ -26,9 +27,8 @@ $lg: 62em; //992px
|
|
|
26
27
|
$xl: 75em; //1200px
|
|
27
28
|
|
|
28
29
|
// Code
|
|
29
|
-
$code-bg-color: #
|
|
30
|
-
$code-text-color: #
|
|
30
|
+
$code-bg-color: #f6f8fa !default;
|
|
31
|
+
$code-text-color: #25292e !default;
|
|
31
32
|
|
|
32
33
|
// Borders
|
|
33
34
|
$border-color: #dce6f0 !default;
|
|
34
|
-
$hr-border-color: #eff0f1 !default;
|