quiet-comic 0.2.5 → 0.2.6
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +21 -3
- data/_config.yml +2 -1
- data/_includes/footer.html +56 -53
- data/_includes/header.html +17 -7
- data/_layouts/artwork.html +36 -26
- data/_layouts/autopage_collection.html +2 -1
- data/_layouts/home.html +1 -1
- data/_layouts/page.html +29 -25
- data/_sass/quiet_comic/components.scss +45 -34
- data/setup_files/assets/main.scss +11 -0
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 1814bbb89cdaa2065f9779d45189438a0f8289b1
|
|
4
|
+
data.tar.gz: fa298d088f771dc9e5f15e1c017e19a33e7dc5f4
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 0e5468f14a02e2e5a3904a1db52c43a6589fa5baa18ca1019227aab5fb390e200e4f21d567379eddf520e72b708d142b99532da8d316c44ce97f0b8d77da29ea
|
|
7
|
+
data.tar.gz: 6086133e30967c00d9d263e6821437a4a3d06eab3b7f925af68d1313a3abff54a9283e39f1b4dff6182f90978336a136c1a4b0ab71144f92f0799184a7c5783c
|
data/README.md
CHANGED
|
@@ -44,7 +44,20 @@ This will give you a base config file to work out from, the necessary folders (w
|
|
|
44
44
|
You probably only want to run this script on a fresh project, because it may override any existing files and folders with the same name, that you may have modified/worked on, if you let it. But the script will prompt you before copying each file, so you can feel free to skip some files while copying over others, should you want to 'reset' any file after messing something up.
|
|
45
45
|
|
|
46
46
|
### Configuration
|
|
47
|
-
Please copy and paste the [theme's default `_config.yml` file](https://github.com/tjjjwxzq/quiet-comic/blob/master/_config.yml) into your own and customize any of the variables you wish.
|
|
47
|
+
Please copy and paste the [theme's default `_config.yml` file](https://github.com/tjjjwxzq/quiet-comic/blob/master/_config.yml) into your own and customize any of the variables you wish (best to use the setup script as detailed in the previous section).
|
|
48
|
+
|
|
49
|
+
### Home Page
|
|
50
|
+
The home page of this theme expects a main image that will cover the whole screen (set by the `main_image` key in `_config.yml`). You can also a specify a mobile-optimized main image with the `mobile-main-image` key. If you leave it out it will default to whatever was set for `main_image`.
|
|
51
|
+
|
|
52
|
+
By default the header for this theme will include a brand image which links to the home page (if you set it in the `brand_image` key in `_config.yml`) on every page. If you don't want this to show up on the home page, set the following in the frontmatter of `index.md`:
|
|
53
|
+
|
|
54
|
+
```
|
|
55
|
+
---
|
|
56
|
+
is_home: true
|
|
57
|
+
---
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
If you don't set the `brand_image` key, a text link to the homepage will be rendered in the header.
|
|
48
61
|
|
|
49
62
|
### Layouts
|
|
50
63
|
|
|
@@ -93,8 +106,6 @@ image: 'path/to/comic/strip/image'
|
|
|
93
106
|
|
|
94
107
|
Your pages will be sorted on the paginated index page (`/pages`) by the `page_number` variable so it must be included. Also, jekyll seems to set the `page.next` and `page-previous` using a default ordering based on date, is not configurable at the moment, so you should add a date if you want your next and prev links to work properly.
|
|
95
108
|
|
|
96
|
-
The `page_number` will be displayed on the page itself, and, depending on your config, in the pages index on the thumbnail for that page (see how to generate your thumbnail images [here](#thumbnails)).
|
|
97
|
-
|
|
98
109
|
The `image` should be the path to the comic strip file itself, relative to the base image directory. The base image directory for comic pages is `<base_image_dir>/pages`. Since the default base image directory is `assets/images`, this will be `assets/images/pages`. If you would like to change the base directory name, you can set the following in your config:
|
|
99
110
|
|
|
100
111
|
```yaml
|
|
@@ -170,6 +181,13 @@ This theme uses [rouge](https://github.com/jneen/rouge) for syntax highlighting
|
|
|
170
181
|
### SEO
|
|
171
182
|
A set of meta tags for SEO are included in `<head></head>`. To see what's included, check out the source file `_includes/seo.html` (Do `bundle open quiet-comic` to open the gem source). Config that affects the output of these SEO tags can be found in `_config.yml`.
|
|
172
183
|
|
|
184
|
+
### Analytics
|
|
185
|
+
If you have a google analytics tracking ID, add it to your config, and then build your site in production to ensure the google analytics script is generated on your pages:
|
|
186
|
+
|
|
187
|
+
```
|
|
188
|
+
JEKYLL_ENV=production bundle exec jekyll build
|
|
189
|
+
```
|
|
190
|
+
|
|
173
191
|
## Contributing
|
|
174
192
|
|
|
175
193
|
Bug reports and pull requests are welcome on GitHub at https://github.com/[USERNAME]/hello. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct.
|
data/_config.yml
CHANGED
|
@@ -11,10 +11,11 @@ title: "My quiet webcomic"
|
|
|
11
11
|
name: "Your Name"
|
|
12
12
|
description: "A quiet webcomic"
|
|
13
13
|
url: # the base hostname and protocol (eg. http://example.com)
|
|
14
|
-
baseurl: # the subpath of your site eg. /mycomic
|
|
14
|
+
baseurl: "/quiet-comic" # the subpath of your site eg. /mycomic
|
|
15
15
|
repository: # Github username/repo-name
|
|
16
16
|
brand_image: "assets/images/placeholder-brand-image.png" # path to brand image in the `assets/images` folder
|
|
17
17
|
main_image: "assets/images/placeholder-main-image.png" # path to main image on home page
|
|
18
|
+
mobile_main_image: "assets/images/placeholder-mobile-main-image.png" # path to main image on home page
|
|
18
19
|
base_image_dir: "assets/images/" # default image directory. Ensure the trailing slash is there
|
|
19
20
|
thumbnail_label: "page_number" # either "title" or "page_number"
|
|
20
21
|
feed_label: "page_number" # either "title" or "page_number"
|
data/_includes/footer.html
CHANGED
|
@@ -1,54 +1,57 @@
|
|
|
1
|
-
<footer>
|
|
2
|
-
<div class="
|
|
3
|
-
<
|
|
4
|
-
<
|
|
5
|
-
<
|
|
6
|
-
|
|
7
|
-
</h5>
|
|
8
|
-
<p><strong>{{ site.author.name }}</strong> · {{ site.author.bio }}</p>
|
|
9
|
-
</div>
|
|
10
|
-
<ul class="social-links">
|
|
11
|
-
{% if site.author.github %}
|
|
12
|
-
<li>
|
|
13
|
-
<a href="{{ site.author.github }}">
|
|
14
|
-
<img src="{{ site.base_image_dir | append: 'github-icon.svg' | relative_url }}" />
|
|
15
|
-
</a>
|
|
16
|
-
</li>
|
|
17
|
-
{% endif %}
|
|
18
|
-
{% if site.author.deviant_art %}
|
|
19
|
-
<li>
|
|
20
|
-
<a href="{{ site.author.deviant_art }}">
|
|
21
|
-
<img src="{{ site.base_image_dir | append: 'da-icon.svg' | relative_url}}" />
|
|
22
|
-
</a>
|
|
23
|
-
</li>
|
|
24
|
-
{% endif %}
|
|
25
|
-
{% if site.author.facebook %}
|
|
26
|
-
<li>
|
|
27
|
-
<a href="{{ site.author.facebook }}">
|
|
28
|
-
<img src="{{ site.base_image_dir | append: 'fb-icon.svg' | relative_url }}" />
|
|
29
|
-
</a>
|
|
30
|
-
</li>
|
|
31
|
-
{% endif %}
|
|
32
|
-
{% if site.author.instagram %}
|
|
33
|
-
<li>
|
|
34
|
-
<a href="{{ site.author.instagram }}">
|
|
35
|
-
<img src="{{ site.base_image_dir | append: 'instagram-icon.svg' | relative_url }}" />
|
|
1
|
+
<footer class="Container--fluid">
|
|
2
|
+
<div class="Grid Grid--gutters sm-Grid--1of1 md-Grid--fit">
|
|
3
|
+
<div class="Grid-cell bio-container">
|
|
4
|
+
<h5>{{ site.title }}
|
|
5
|
+
<a href="{{ "combined_feed.xml" | relative_url }}" class="main-feed-link">
|
|
6
|
+
<img src="{{ site.base_image_dir | append: "feed-icon.svg" | relative_url }}">
|
|
36
7
|
</a>
|
|
37
|
-
</
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
</
|
|
8
|
+
</h5>
|
|
9
|
+
<p><strong>{{ site.author.name }}</strong> · {{ site.author.bio }}</p>
|
|
10
|
+
</div>
|
|
11
|
+
|
|
12
|
+
<ul class="Grid-cell social-links">
|
|
13
|
+
{% if site.author.github %}
|
|
14
|
+
<li>
|
|
15
|
+
<a href="{{ site.author.github }}">
|
|
16
|
+
<img src="{{ site.base_image_dir | append: 'github-icon.svg' | relative_url }}" />
|
|
17
|
+
</a>
|
|
18
|
+
</li>
|
|
19
|
+
{% endif %}
|
|
20
|
+
{% if site.author.deviant_art %}
|
|
21
|
+
<li>
|
|
22
|
+
<a href="{{ site.author.deviant_art }}">
|
|
23
|
+
<img src="{{ site.base_image_dir | append: 'da-icon.svg' | relative_url}}" />
|
|
24
|
+
</a>
|
|
25
|
+
</li>
|
|
26
|
+
{% endif %}
|
|
27
|
+
{% if site.author.facebook %}
|
|
28
|
+
<li>
|
|
29
|
+
<a href="{{ site.author.facebook }}">
|
|
30
|
+
<img src="{{ site.base_image_dir | append: 'fb-icon.svg' | relative_url }}" />
|
|
31
|
+
</a>
|
|
32
|
+
</li>
|
|
33
|
+
{% endif %}
|
|
34
|
+
{% if site.author.instagram %}
|
|
35
|
+
<li>
|
|
36
|
+
<a href="{{ site.author.instagram }}">
|
|
37
|
+
<img src="{{ site.base_image_dir | append: 'instagram-icon.svg' | relative_url }}" />
|
|
38
|
+
</a>
|
|
39
|
+
</li>
|
|
40
|
+
{% endif %}
|
|
41
|
+
{% if site.author.twitter %}
|
|
42
|
+
<li>
|
|
43
|
+
<a href="{{ site.author.twitter }}">
|
|
44
|
+
<img src="{{ site.base_image_dir | append: 'twitter-icon.svg' | relative_url }}" />
|
|
45
|
+
</a>
|
|
46
|
+
</li>
|
|
47
|
+
{% endif %}
|
|
48
|
+
{% if site.author.youtube %}
|
|
49
|
+
<li>
|
|
50
|
+
<a href="{{ site.author.youtube }}">
|
|
51
|
+
<img src="{{ site.base_image_dir | append: 'youtube-icon.svg' | relative_url }}" />
|
|
52
|
+
</a>
|
|
53
|
+
</li>
|
|
54
|
+
{% endif %}
|
|
55
|
+
</ul>
|
|
56
|
+
</div>
|
|
57
|
+
</footer>
|
data/_includes/header.html
CHANGED
|
@@ -1,14 +1,21 @@
|
|
|
1
1
|
<header>
|
|
2
2
|
<nav>
|
|
3
|
-
<ul>
|
|
3
|
+
<ul class="Grid sm-Grid--1of1 md-Grid--1of2">
|
|
4
4
|
{% unless page.is_home %}
|
|
5
|
-
<li class="nav-home-button">
|
|
5
|
+
<li class="Grid-cell nav-home-button">
|
|
6
6
|
<a href="{{ "/" | relative_url }}">
|
|
7
|
-
|
|
7
|
+
{% if site.brand_image %}
|
|
8
|
+
<img src={{ site.brand_image | relative_url }} />
|
|
9
|
+
{% else %}
|
|
10
|
+
{{ site.title }}
|
|
11
|
+
{% endif %}
|
|
8
12
|
</a>
|
|
9
13
|
</li>
|
|
10
14
|
{% endunless %}
|
|
11
|
-
<
|
|
15
|
+
<div class="Grid-cell basic-nav">
|
|
16
|
+
|
|
17
|
+
<div class="Grid Grid--fit">
|
|
18
|
+
<li class="Grid-cell">
|
|
12
19
|
{% assign last_page = (site.pages | sort: 'page_number' | last) %}
|
|
13
20
|
{% if page.url == last_page.url %}
|
|
14
21
|
<a href="{{ last_page.url | relative_url }}" class="active">Latest</a>
|
|
@@ -16,7 +23,7 @@
|
|
|
16
23
|
<a href="{{ last_page.url | relative_url }}">Latest</a>
|
|
17
24
|
{% endif %}
|
|
18
25
|
</li>
|
|
19
|
-
<li>
|
|
26
|
+
<li class="Grid-cell">
|
|
20
27
|
{% assign first_page = (site.pages | sort: 'page_number' | first) %}
|
|
21
28
|
{% if page.url == first_page.url %}
|
|
22
29
|
<a href="{{ first_page.url | relative_url }}" class="active">First</a>
|
|
@@ -24,20 +31,23 @@
|
|
|
24
31
|
<a href="{{ first_page.url | relative_url }}">First</a>
|
|
25
32
|
{% endif %}
|
|
26
33
|
</li>
|
|
27
|
-
<li>
|
|
34
|
+
<li class="Grid-cell">
|
|
28
35
|
{% if page.url == "/pages/index.html" %}
|
|
29
36
|
<a href="{{ "pages" | relative_url }}" class="active">All</a>
|
|
30
37
|
{% else %}
|
|
31
38
|
<a href="{{ "pages" | relative_url }}">All</a>
|
|
32
39
|
{% endif %}
|
|
33
40
|
</li>
|
|
34
|
-
<li>
|
|
41
|
+
<li class="Grid-cell">
|
|
35
42
|
{% if page.url == "/artworks/index.html" %}
|
|
36
43
|
<a href="{{ "artworks" | relative_url }}" class="active">Gallery</a>
|
|
37
44
|
{% else %}
|
|
38
45
|
<a href="{{ "artworks" | relative_url }}">Gallery</a>
|
|
39
46
|
{% endif %}
|
|
40
47
|
</li>
|
|
48
|
+
|
|
49
|
+
</div>
|
|
50
|
+
</div>
|
|
41
51
|
</ul>
|
|
42
52
|
</nav>
|
|
43
53
|
</header>
|
data/_layouts/artwork.html
CHANGED
|
@@ -4,33 +4,43 @@ layout: default
|
|
|
4
4
|
|
|
5
5
|
<div class="Container--fixed">
|
|
6
6
|
<div class="Grid Grid--1of1">
|
|
7
|
-
<h3 class="Grid-cell artwork-header">
|
|
8
|
-
{{ page.title }}
|
|
9
|
-
<small class="header-date">
|
|
10
|
-
{{ page.date | date: '%B %d %Y' }}
|
|
11
|
-
</small>
|
|
12
|
-
|
|
13
|
-
<small class="size-buttons-container">
|
|
14
|
-
Zoom -
|
|
15
|
-
<a href="#width-100">100%</a> ·
|
|
16
|
-
<a href="#width-75">75%</a> ·
|
|
17
|
-
<a href="#width-50">50%</a>
|
|
18
|
-
</small>
|
|
19
|
-
<small class="pager-container">
|
|
20
|
-
{% if page.previous %}
|
|
21
|
-
<a href="{{ page.previous.url | relative_url}}">< Prev</a>
|
|
22
|
-
{% endif %}
|
|
23
|
-
{% if page.next %}
|
|
24
|
-
<a href="{{ page.next.url | relative_url}}">Next ></a>
|
|
25
|
-
{% endif %}
|
|
26
|
-
</small>
|
|
27
|
-
</h3>
|
|
28
|
-
|
|
29
|
-
<img id="width-50" src="{{ site.base_image_dir | relative_url }}artworks/{{ page.image }}" alt="{{ page.title }}" class="Grid-cell">
|
|
30
|
-
|
|
31
|
-
<img id="width-75" src="{{ site.base_image_dir | relative_url }}artworks/{{ page.image }}" alt="{{ page.title }}" class="Grid-cell">
|
|
32
7
|
|
|
33
|
-
<
|
|
8
|
+
<div class="Grid-cell">
|
|
9
|
+
<h3>
|
|
10
|
+
{{ page.title }}
|
|
11
|
+
<time class="header-date">
|
|
12
|
+
{{ page.date | date: '%B %d %Y' }}
|
|
13
|
+
</time>
|
|
14
|
+
</h3>
|
|
15
|
+
</div>
|
|
16
|
+
|
|
17
|
+
<div class="Grid-cell pager-and-size">
|
|
18
|
+
<div class="Grid sm-Grid--1of1 md-Grid--1of2">
|
|
19
|
+
<ul class="Grid-cell pager">
|
|
20
|
+
{% if page.previous %}
|
|
21
|
+
<li><a href="{{ page.previous.url | relative_url}}">< Prev</a></li>
|
|
22
|
+
{% endif %}
|
|
23
|
+
{% if page.next %}
|
|
24
|
+
<li><a href="{{ page.next.url | relative_url}}">Next ></a></li>
|
|
25
|
+
{% endif %}
|
|
26
|
+
</ul>
|
|
27
|
+
|
|
28
|
+
<ul class="Grid-cell size-buttons">
|
|
29
|
+
Zoom -
|
|
30
|
+
<li><a href="#width-100">100%</a></li> ·
|
|
31
|
+
<li><a href="#width-75">75%</a></li> ·
|
|
32
|
+
<li><a href="#width-50">50%</a></li>
|
|
33
|
+
</ul>
|
|
34
|
+
</div>
|
|
35
|
+
</div>
|
|
36
|
+
|
|
37
|
+
<div class="Grid-cell">
|
|
38
|
+
<img id="width-50" src="{{ site.base_image_dir | relative_url }}artworks/{{ page.image }}" alt="{{ page.title }}" class="Grid-cell">
|
|
39
|
+
|
|
40
|
+
<img id="width-75" src="{{ site.base_image_dir | relative_url }}artworks/{{ page.image }}" alt="{{ page.title }}" class="Grid-cell">
|
|
41
|
+
|
|
42
|
+
<img id="width-100" src="{{ site.base_image_dir | relative_url }}artworks/{{ page.image }}" alt="{{ page.title }}" class="Grid-cell">
|
|
43
|
+
</div>
|
|
34
44
|
|
|
35
45
|
<ul class="Grid-cell pager">
|
|
36
46
|
{% if page.previous %}
|
|
@@ -3,6 +3,8 @@ layout: default
|
|
|
3
3
|
---
|
|
4
4
|
|
|
5
5
|
<div class="pages-layout Container--fluid">
|
|
6
|
+
{% assign collection = paginator.posts.first.collection %}
|
|
7
|
+
<h1>All {{collection}}</h1>
|
|
6
8
|
<div class="
|
|
7
9
|
Grid
|
|
8
10
|
Grid--gutters
|
|
@@ -11,7 +13,6 @@ layout: default
|
|
|
11
13
|
md-Grid--1of4
|
|
12
14
|
lg-Grid--1of6">
|
|
13
15
|
|
|
14
|
-
{% assign collection = paginator.posts.first.collection %}
|
|
15
16
|
{% if collection == "pages" %}
|
|
16
17
|
{% assign items = paginator.posts | sort: 'page_number' | reverse %}
|
|
17
18
|
{% else %}
|
data/_layouts/home.html
CHANGED
|
@@ -4,7 +4,7 @@ layout: "default"
|
|
|
4
4
|
|
|
5
5
|
<div class="Grid Grid--gutters">
|
|
6
6
|
<div class="Grid-cell">
|
|
7
|
-
<div class="Home-img"
|
|
7
|
+
<div class="Home-img">
|
|
8
8
|
<a href="{{ "combined_feed.xml" | relative_url }}" class="main-feed-link">
|
|
9
9
|
<img src="{{ site.base_image_dir | append: "feed-icon.svg" | relative_url }}">
|
|
10
10
|
</a>
|
data/_layouts/page.html
CHANGED
|
@@ -4,39 +4,43 @@ layout: default
|
|
|
4
4
|
|
|
5
5
|
<div class="Container--fixed">
|
|
6
6
|
<div class="Grid Grid--1of1">
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
<
|
|
10
|
-
{{ page.
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
<ul class="pager">
|
|
7
|
+
|
|
8
|
+
<div class="Grid-cell">
|
|
9
|
+
<h3>
|
|
10
|
+
{{ page.title }}
|
|
11
|
+
<time class="header-date">
|
|
12
|
+
{{ page.date | date: '%B %d %Y' }}
|
|
13
|
+
</time>
|
|
14
|
+
</h3>
|
|
15
|
+
</div>
|
|
16
|
+
|
|
17
|
+
<div class="Grid-cell pager-and-size">
|
|
18
|
+
<div class="Grid sm-Grid--1of1 md-Grid--1of2">
|
|
19
|
+
<ul class="Grid-cell pager">
|
|
21
20
|
{% if page.previous %}
|
|
22
|
-
<li
|
|
23
|
-
<a href="{{ page.previous.url | relative_url}}">< Prev</a>
|
|
24
|
-
</li>
|
|
21
|
+
<li><a href="{{ page.previous.url | relative_url}}">< Prev</a></li>
|
|
25
22
|
{% endif %}
|
|
26
23
|
{% if page.next %}
|
|
27
|
-
<li
|
|
28
|
-
<a href="{{ page.next.url | relative_url}}">Next ></a>
|
|
29
|
-
</li>
|
|
24
|
+
<li><a href="{{ page.next.url | relative_url}}">Next ></a></li>
|
|
30
25
|
{% endif %}
|
|
31
26
|
</ul>
|
|
32
|
-
</small>
|
|
33
|
-
</h3>
|
|
34
27
|
|
|
35
|
-
|
|
28
|
+
<ul class="Grid-cell size-buttons">
|
|
29
|
+
Zoom -
|
|
30
|
+
<li><a href="#width-100">100%</a></li> ·
|
|
31
|
+
<li><a href="#width-75">75%</a></li> ·
|
|
32
|
+
<li><a href="#width-50">50%</a></li>
|
|
33
|
+
</ul>
|
|
34
|
+
</div>
|
|
35
|
+
</div>
|
|
36
|
+
|
|
37
|
+
<div class="Grid-cell">
|
|
38
|
+
<img id="width-50" src="{{ site.base_image_dir | relative_url }}pages/{{ page.image }}" alt="{{ page.title }}" class="Grid-cell main-image">
|
|
36
39
|
|
|
37
|
-
|
|
40
|
+
<img id="width-75" src="{{ site.base_image_dir | relative_url }}pages/{{ page.image }}" alt="{{ page.title }}" class="Grid-cell main-image">
|
|
38
41
|
|
|
39
|
-
|
|
42
|
+
<img id="width-100" src="{{ site.base_image_dir | relative_url }}pages/{{ page.image }}" alt="{{ page.title }}" class="Grid-cell main-image">
|
|
43
|
+
</div>
|
|
40
44
|
|
|
41
45
|
<ul class="Grid-cell pager">
|
|
42
46
|
{% if page.previous %}
|
|
@@ -3,14 +3,16 @@ header {
|
|
|
3
3
|
list-style: none;
|
|
4
4
|
position: relative;
|
|
5
5
|
z-index: 1;
|
|
6
|
+
mix-blend-mode: multiply;
|
|
7
|
+
|
|
8
|
+
nav {
|
|
9
|
+
width: 90%;
|
|
10
|
+
margin: auto;
|
|
11
|
+
}
|
|
6
12
|
|
|
7
13
|
ul {
|
|
8
14
|
margin: 0 1rem;
|
|
9
15
|
min-height: $min-header-height;
|
|
10
|
-
display: flex;
|
|
11
|
-
flex-wrap: wrap;
|
|
12
|
-
justify-content: flex-end;
|
|
13
|
-
align-items: center;
|
|
14
16
|
}
|
|
15
17
|
|
|
16
18
|
li {
|
|
@@ -23,7 +25,8 @@ header {
|
|
|
23
25
|
}
|
|
24
26
|
|
|
25
27
|
.nav-home-button {
|
|
26
|
-
|
|
28
|
+
display: flex;
|
|
29
|
+
align-items: center;
|
|
27
30
|
|
|
28
31
|
a {
|
|
29
32
|
transition: opacity 0.4s ease-in-out;
|
|
@@ -41,16 +44,27 @@ header {
|
|
|
41
44
|
height: 70px;
|
|
42
45
|
}
|
|
43
46
|
}
|
|
47
|
+
|
|
48
|
+
.basic-nav {
|
|
49
|
+
margin-left: auto;
|
|
50
|
+
display: flex;
|
|
51
|
+
align-items: center;
|
|
52
|
+
justify-content: flex-end;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
@media (max-width: $break-md) {
|
|
56
|
+
.nav-home-button {
|
|
57
|
+
justify-content: center;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.basic-nav {
|
|
61
|
+
justify-content: center;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
44
64
|
}
|
|
45
65
|
|
|
46
66
|
// footer
|
|
47
67
|
footer {
|
|
48
|
-
display: flex;
|
|
49
|
-
align-items: center;
|
|
50
|
-
justify-content: left;
|
|
51
|
-
margin: 5em 3em;
|
|
52
|
-
margin-bottom: 1em;
|
|
53
|
-
|
|
54
68
|
.bio-container {
|
|
55
69
|
h5 {
|
|
56
70
|
margin-bottom: 0;
|
|
@@ -59,7 +73,8 @@ footer {
|
|
|
59
73
|
|
|
60
74
|
.social-links {
|
|
61
75
|
display: flex;
|
|
62
|
-
|
|
76
|
+
flex-wrap: wrap;
|
|
77
|
+
justify-content: center;
|
|
63
78
|
|
|
64
79
|
li {
|
|
65
80
|
display: inline-block;
|
|
@@ -89,8 +104,6 @@ footer {
|
|
|
89
104
|
// home page
|
|
90
105
|
.Home-img {
|
|
91
106
|
min-height: 100vh;
|
|
92
|
-
// temporary color
|
|
93
|
-
background-color: hsla(31, 15%, 50%, 0.1);
|
|
94
107
|
background-size: cover;
|
|
95
108
|
margin-top: -$min-header-height;
|
|
96
109
|
|
|
@@ -100,7 +113,6 @@ footer {
|
|
|
100
113
|
bottom: 3rem;
|
|
101
114
|
right: 3rem;
|
|
102
115
|
}
|
|
103
|
-
|
|
104
116
|
}
|
|
105
117
|
|
|
106
118
|
.main-feed-link {
|
|
@@ -153,24 +165,24 @@ footer {
|
|
|
153
165
|
transition: opacity 0.4s ease-in-out;
|
|
154
166
|
}
|
|
155
167
|
|
|
156
|
-
// page and artwork
|
|
157
|
-
.page-header, .artwork-header {
|
|
158
|
-
display: flex;
|
|
159
|
-
align-items: stretch;
|
|
160
|
-
}
|
|
161
|
-
|
|
162
168
|
.header-date {
|
|
163
169
|
color: $text-color-light;
|
|
164
170
|
font-size: 0.7em;
|
|
165
|
-
align-self: center;
|
|
166
171
|
margin-left: 1em;
|
|
167
|
-
margin-right: 1.5em;
|
|
168
172
|
}
|
|
169
173
|
|
|
170
|
-
.
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
+
.size-buttons{
|
|
175
|
+
list-style: none;
|
|
176
|
+
|
|
177
|
+
li {
|
|
178
|
+
display: inline-block;
|
|
179
|
+
}
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
@media (min-width: $break-md) {
|
|
183
|
+
.size-buttons {
|
|
184
|
+
text-align: right;
|
|
185
|
+
}
|
|
174
186
|
}
|
|
175
187
|
|
|
176
188
|
.pager {
|
|
@@ -186,18 +198,17 @@ footer {
|
|
|
186
198
|
}
|
|
187
199
|
}
|
|
188
200
|
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
margin-left: auto;
|
|
192
|
-
margin-right: 2em;
|
|
201
|
+
.pager-and-size ul {
|
|
202
|
+
margin-top: 0;
|
|
193
203
|
}
|
|
194
204
|
|
|
205
|
+
|
|
195
206
|
#width-50, #width-75, #width-100 {
|
|
196
207
|
margin: 0 auto;
|
|
197
208
|
}
|
|
198
209
|
|
|
199
210
|
#width-50 {
|
|
200
|
-
|
|
211
|
+
width: 50%;
|
|
201
212
|
display: none;
|
|
202
213
|
|
|
203
214
|
&:target {
|
|
@@ -210,7 +221,7 @@ footer {
|
|
|
210
221
|
}
|
|
211
222
|
|
|
212
223
|
#width-75 {
|
|
213
|
-
|
|
224
|
+
width: 75%;
|
|
214
225
|
display: none;
|
|
215
226
|
|
|
216
227
|
&:target {
|
|
@@ -223,7 +234,7 @@ footer {
|
|
|
223
234
|
}
|
|
224
235
|
|
|
225
236
|
#width-100 {
|
|
226
|
-
|
|
237
|
+
width: 100%;
|
|
227
238
|
|
|
228
239
|
&:target {
|
|
229
240
|
display: block;
|
|
@@ -4,3 +4,14 @@
|
|
|
4
4
|
---
|
|
5
5
|
|
|
6
6
|
@import "quiet_comic";
|
|
7
|
+
|
|
8
|
+
// Home page image
|
|
9
|
+
.Home-img {
|
|
10
|
+
background-image: url(../{{ site.main_image}});
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
@media (max-width: $break-md) {
|
|
14
|
+
.Home-img {
|
|
15
|
+
background-image: url(../{{ site.mobile_main_image | default: site.main_image }});
|
|
16
|
+
}
|
|
17
|
+
}
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: quiet-comic
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.2.
|
|
4
|
+
version: 0.2.6
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- tjjjwxzq
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2017-12-
|
|
11
|
+
date: 2017-12-25 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: jekyll
|