jekyll-theme-charcoal 0.0.3 → 0.0.4
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +57 -19
- data/_includes/about_image.html +7 -0
- data/_includes/footer.html +17 -0
- data/_includes/header.html +6 -2
- data/_includes/social.html +1 -0
- data/_includes/toc.html +86 -0
- data/_layouts/default.html +27 -13
- data/_layouts/home.html +2 -6
- data/_sass/fonts.scss +1 -3
- data/_sass/jekyll-theme-charcoal.scss +129 -121
- metadata +5 -3
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 8965ca5c83b22a9d32d141305dd489ba9a06808f
|
4
|
+
data.tar.gz: 53d48d44c867bfd18d57c4169954d4e1d7c4a704
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 56e4160304f965a685d392ce69fa7c39eff795d370e084acaf463a46900e0beaed0acb9398788a4be40228309cf03be751a3cfc625ab7697389b5d450f5d2e46
|
7
|
+
data.tar.gz: 8d799f0d1818fa3e6e9640952914c6dfc0d60badadce2f3c41b67ec33e749880700a0c79cd74b5bc9126afb7f0c125b7d04c08e01c6b197942a8349a4413b717
|
data/README.md
CHANGED
@@ -1,18 +1,20 @@
|
|
1
1
|
---
|
2
2
|
layout: home
|
3
|
-
title: Charcoal
|
3
|
+
title: Charcoal Theme
|
4
4
|
permalink: /index.html
|
5
5
|
---
|
6
|
-
#
|
6
|
+
# About
|
7
7
|
|
8
|
-
|
8
|
+
Charcoal is a dark theme for [jekyll](https://jekyllrb.com/).
|
9
9
|
|
10
|
-
|
10
|
+
# Usage
|
11
11
|
|
12
12
|
The theme is available as open source under the terms of the [MIT License](LICENSE.txt).
|
13
13
|
It is distributed as a [ruby gem](https://rubygems.org/gems/jekyll-theme-charcoal).
|
14
14
|
|
15
|
-
|
15
|
+
[![Gem Version](https://badge.fury.io/rb/jekyll-theme-charcoal.svg)](https://badge.fury.io/rb/jekyll-theme-charcoal)
|
16
|
+
|
17
|
+
## Installation
|
16
18
|
|
17
19
|
Add this line to your Jekyll site's `Gemfile`:
|
18
20
|
|
@@ -39,32 +41,40 @@ user@localhost ~/my-awesome-site
|
|
39
41
|
$ bundle install
|
40
42
|
```
|
41
43
|
|
42
|
-
|
44
|
+
## Layouts
|
43
45
|
|
44
46
|
* `default` is the base layout, contianing only a header and content.
|
45
47
|
* `home` is ideal for a landing page, as it includes not only the content, but also a blog roll with RSS link and social links as configured below.
|
46
48
|
* `page` is currently no more than a repackaged default.
|
47
49
|
* `post` is currently no more than a repackaged default, except that [posts](https://jekyllrb.com/docs/posts/) are indexed and listed on the `home` page.
|
48
50
|
|
49
|
-
In addition to the standard jekyll front matter, the charcoal theme
|
51
|
+
In addition to the standard jekyll front matter, the charcoal theme will use the following variables on each page:
|
50
52
|
|
51
53
|
```yaml
|
52
|
-
|
53
|
-
|
54
|
+
toc: true # Adds a table of contents to the left sidebar of the page
|
55
|
+
bare: true # Make this page by not displaying author information, and ensuring there's no table of contents
|
56
|
+
author_name: Greg Gibeling # Sets the name of the author
|
57
|
+
author_url: https://github.com/gdgib/ # An optional link to a page specific to the author
|
54
58
|
```
|
55
59
|
|
56
|
-
|
60
|
+
## 404
|
61
|
+
|
62
|
+
You should copy our [404](https://github.com/g2forge/charcoal/blob/master/404.html) page into your site.
|
63
|
+
Ours is configured to display in the most friendly manner.
|
64
|
+
|
65
|
+
## Customization
|
57
66
|
|
58
67
|
You can configure a default author for pages and posts in your `_config.yml`:
|
59
68
|
|
60
|
-
```
|
61
|
-
|
62
|
-
|
69
|
+
```yaml
|
70
|
+
toc: true # Sets whether to adds a table of contents to the left sidebar of the page by default
|
71
|
+
author_name: Greg Gibeling # Sets the name of the default author, which can be overriden on each page
|
72
|
+
author_url: https://github.com/gdgib/ # An optional link to a page specific to the default author, can be overriden on each page
|
63
73
|
```
|
64
74
|
|
65
75
|
As [in minima](https://github.com/jekyll/minima/blob/master/README.md#social-networks) you can add links to the accounts you have on other sites, with respective icon, by adding one or more of the following options in your `_config.yml`:
|
66
76
|
|
67
|
-
```
|
77
|
+
```yaml
|
68
78
|
twitter_username: jekyllrb
|
69
79
|
github_username: jekyll
|
70
80
|
dribbble_username: jekyll
|
@@ -84,7 +94,34 @@ mastodon:
|
|
84
94
|
instance: example.com
|
85
95
|
```
|
86
96
|
|
87
|
-
##
|
97
|
+
## Includes
|
98
|
+
|
99
|
+
Below is a list of the includes designed to be used manually.
|
100
|
+
The theme itself uses several includes which are automatically used that you may also wish to explore.
|
101
|
+
|
102
|
+
### About Image
|
103
|
+
|
104
|
+
The `about_image.html` include will generate a small section including a profile picture on the left and some HTML content on the right.
|
105
|
+
While intended for talking about, for example, the author of a webite we encourage you to get creative with this.
|
106
|
+
|
107
|
+
Usage:
|
108
|
+
|
109
|
+
```liquid
|
110
|
+
{% raw %}
|
111
|
+
{% capture about %}
|
112
|
+
Some content goes here
|
113
|
+
{% endcapture %}
|
114
|
+
{% include about_image.html image_src="images/Profile.jpg" image_alt="My awesome profile picture" content=about %}
|
115
|
+
{% endraw %}
|
116
|
+
```
|
117
|
+
|
118
|
+
Parameters:
|
119
|
+
|
120
|
+
* `image_src` (`string`) - The page or URL of the image to display
|
121
|
+
* `image_alt` (`string`) - The alternate text of the image
|
122
|
+
* `content` (`text`) - The content to display to the right of the image
|
123
|
+
|
124
|
+
# Contributing
|
88
125
|
|
89
126
|
Issues and pull requests are welcome on [github.com/g2forge/charcoal](https://github.com/g2forge/charcoal).
|
90
127
|
|
@@ -123,9 +160,10 @@ user@localhost ~/charcoal
|
|
123
160
|
$ gem push ./jekyll-theme-charcoal-<VERSION>.gem
|
124
161
|
```
|
125
162
|
|
126
|
-
|
163
|
+
# Inspiration
|
127
164
|
|
128
|
-
This theme is based on the following
|
165
|
+
This theme is based on the following:
|
129
166
|
|
130
|
-
* [
|
131
|
-
* [
|
167
|
+
* [midnight](https://github.com/pages-themes/midnight) by [Matt Graham](https://twitter.com/michigangraham) - design, structure, fonts, etc
|
168
|
+
* [minima](https://github.com/jekyll/minima) by [Jekyll](https://jekyllrb.com/) - including social icons and design
|
169
|
+
* [jekyll-toc](https://github.com/allejo/jekyll-toc) by [Vladimir Jimenez](https://github.com/allejo) - for the fancy table of contents
|
data/_includes/footer.html
CHANGED
@@ -0,0 +1,17 @@
|
|
1
|
+
<footer>
|
2
|
+
<div class="content">
|
3
|
+
<div class="wrapper">
|
4
|
+
<div class="footer-col footer-col-1">
|
5
|
+
<h2 class="footer-heading">{{ site.title | escape }}</h2>
|
6
|
+
</div>
|
7
|
+
<div class="footer-col footer-col-2">
|
8
|
+
{% if site.dribbble_username or site.facebook_username or site.flickr_username or site.github_username or site.instagram_username or site.linkedin_username or site.pinterest_username or site.mastodon or site.twitter_username or site.youtube_username or site.googleplus_username or site.rss %}
|
9
|
+
{% include social.html %}
|
10
|
+
{% endif %}
|
11
|
+
</div>
|
12
|
+
<div class="footer-col footer-col-3">
|
13
|
+
<p>{{ site.description | escape }}</p>
|
14
|
+
</div>
|
15
|
+
</div>
|
16
|
+
</div>
|
17
|
+
</footer>
|
data/_includes/header.html
CHANGED
@@ -1,8 +1,12 @@
|
|
1
1
|
<div id="header">
|
2
2
|
<div class="wrapper">
|
3
3
|
<div id="title">
|
4
|
-
<h1><a class="site-title" rel="project" href="{{ "/" | relative_url }}">
|
5
|
-
|
4
|
+
<h1><a class="site-title" rel="project" href="{{ "/" | relative_url }}">
|
5
|
+
{% if site.image %}
|
6
|
+
<img class="site-image" src="{{ site.image }}"/>
|
7
|
+
{% endif %}
|
8
|
+
{{ site.title | default: site.github.repository_name | escape }}
|
9
|
+
</a></h1>
|
6
10
|
<span class="credits left"><a href="{{ site.github.owner_url }}">{{ site.github.owner_name }}</a></span>
|
7
11
|
<span class="credits right">Hosted on GitHub Pages — <a href="https://github.com/g2forge/charcoal">Charcoal theme</a> inspired by <a href="https://twitter.com/michigangraham">mattgraham</a></span>
|
8
12
|
</div>
|
data/_includes/social.html
CHANGED
@@ -1,4 +1,5 @@
|
|
1
1
|
<ul class="social-media-list">
|
2
|
+
{% if site.email %}<li><a href="mailto:{{ site.email }}"><span class="username">{{ site.email| escape }}</span></a></li>{% endif %}
|
2
3
|
{% if site.dribbble_username%}<li><a href="https://dribbble.com/{{ site.dribbble_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#dribbble' | relative_url }}"></use></svg> <span class="username">{{ site.dribbble_username| escape }}</span></a></li>{% endif %}
|
3
4
|
{% if site.facebook_username%}<li><a href="https://www.facebook.com/{{ site.facebook_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#facebook' | relative_url }}"></use></svg> <span class="username">{{ site.facebook_username| escape }}</span></a></li>{% endif %}
|
4
5
|
{% if site.flickr_username%}<li><a href="https://www.flickr.com/photos/{{ site.flickr_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#flickr' | relative_url }}"></use></svg> <span class="username">{{ site.flickr_username| escape }}</span></a></li>{% endif %}
|
data/_includes/toc.html
ADDED
@@ -0,0 +1,86 @@
|
|
1
|
+
<!-- Code copied from https://github.com/allejo/jekyll-toc, under MIT license (https://github.com/allejo/jekyll-toc/blob/6d617d96e68111890d139e7d0577ae853527130b/LICENSE.MIT.md) -->
|
2
|
+
{% capture tocWorkspace %}
|
3
|
+
{% comment %}
|
4
|
+
Version 1.0.4
|
5
|
+
https://github.com/allejo/jekyll-toc
|
6
|
+
|
7
|
+
"...like all things liquid - where there's a will, and ~36 hours to spare, there's usually a/some way" ~jaybe
|
8
|
+
|
9
|
+
Usage:
|
10
|
+
{% include toc.html html=content sanitize=true class="inline_toc" id="my_toc" h_min=2 h_max=3 %}
|
11
|
+
|
12
|
+
Parameters:
|
13
|
+
* html (string) - the HTML of compiled markdown generated by kramdown in Jekyll
|
14
|
+
|
15
|
+
Optional Parameters:
|
16
|
+
* sanitize (bool) : false - when set to true, the headers will be stripped of any HTML in the TOC
|
17
|
+
* class (string) : '' - a CSS class assigned to the TOC
|
18
|
+
* id (string) : '' - an ID to assigned to the TOC
|
19
|
+
* h_min (int) : 1 - the minimum TOC header level to use; any header lower than this value will be ignored
|
20
|
+
* h_max (int) : 6 - the maximum TOC header level to use; any header greater than this value will be ignored
|
21
|
+
* ordered (bool) : false - when set to true, an ordered list will be outputted instead of an unordered list
|
22
|
+
* item_class (string) : '' - add custom class for each list item; has support for '%level%' placeholder, which is the current heading level
|
23
|
+
|
24
|
+
Output:
|
25
|
+
An ordered or unordered list representing the table of contents of a markdown block. This snippet will only generate the table of contents and will NOT output the markdown given to it
|
26
|
+
{% endcomment %}
|
27
|
+
|
28
|
+
{% capture my_toc %}{% endcapture %}
|
29
|
+
{% assign orderedList = include.ordered | default: false %}
|
30
|
+
{% assign minHeader = include.h_min | default: 1 %}
|
31
|
+
{% assign maxHeader = include.h_max | default: 6 %}
|
32
|
+
{% assign nodes = include.html | split: '<h' %}
|
33
|
+
{% assign firstHeader = true %}
|
34
|
+
|
35
|
+
{% capture listModifier %}{% if orderedList %}1.{% else %}-{% endif %}{% endcapture %}
|
36
|
+
|
37
|
+
{% for node in nodes %}
|
38
|
+
{% if node == "" %}
|
39
|
+
{% continue %}
|
40
|
+
{% endif %}
|
41
|
+
|
42
|
+
{% assign headerLevel = node | replace: '"', '' | slice: 0, 1 | times: 1 %}
|
43
|
+
|
44
|
+
{% if headerLevel < minHeader or headerLevel > maxHeader %}
|
45
|
+
{% continue %}
|
46
|
+
{% endif %}
|
47
|
+
|
48
|
+
{% if firstHeader %}
|
49
|
+
{% assign firstHeader = false %}
|
50
|
+
{% assign minHeader = headerLevel %}
|
51
|
+
{% endif %}
|
52
|
+
|
53
|
+
{% assign indentAmount = headerLevel | minus: minHeader | add: 1 %}
|
54
|
+
{% assign _workspace = node | split: '</h' %}
|
55
|
+
|
56
|
+
{% assign _idWorkspace = _workspace[0] | split: 'id="' %}
|
57
|
+
{% assign _idWorkspace = _idWorkspace[1] | split: '"' %}
|
58
|
+
{% assign html_id = _idWorkspace[0] %}
|
59
|
+
|
60
|
+
{% capture _hAttrToStrip %}{{ _workspace[0] | split: '>' | first }}>{% endcapture %}
|
61
|
+
{% assign header = _workspace[0] | replace: _hAttrToStrip, '' %}
|
62
|
+
|
63
|
+
{% assign space = '' %}
|
64
|
+
{% for i in (1..indentAmount) %}
|
65
|
+
{% assign space = space | prepend: ' ' %}
|
66
|
+
{% endfor %}
|
67
|
+
|
68
|
+
{% unless include.item_class == blank %}
|
69
|
+
{% capture listItemClass %}{:.{{ include.item_class | replace: '%level%', headerLevel }}}{% endcapture %}
|
70
|
+
{% endunless %}
|
71
|
+
|
72
|
+
{% capture my_toc %}{{ my_toc }}
|
73
|
+
{{ space }}{{ listModifier }} {{ listItemClass }} [{% if include.sanitize %}{{ header | strip_html }}{% else %}{{ header }}{% endif %}](#{{ html_id }}){% endcapture %}
|
74
|
+
|
75
|
+
{% endfor %}
|
76
|
+
|
77
|
+
{% if include.class %}
|
78
|
+
{% capture my_toc %}{:.{{ include.class }}}
|
79
|
+
{{ my_toc | lstrip }}{% endcapture %}
|
80
|
+
{% endif %}
|
81
|
+
|
82
|
+
{% if include.id %}
|
83
|
+
{% capture my_toc %}{: #{{ include.id }}}
|
84
|
+
{{ my_toc | lstrip }}{% endcapture %}
|
85
|
+
{% endif %}
|
86
|
+
{% endcapture %}{% assign tocWorkspace = '' %}{{ my_toc | markdownify | strip }}
|
data/_layouts/default.html
CHANGED
@@ -2,19 +2,33 @@
|
|
2
2
|
<html lang="{{ page.lang | default: site.lang | default: "en-US" }}">
|
3
3
|
{% include head.html %}
|
4
4
|
<body>
|
5
|
-
|
6
|
-
|
7
|
-
<
|
8
|
-
<
|
9
|
-
<
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
5
|
+
<div class="nonfooter">
|
6
|
+
{% include header.html %}
|
7
|
+
<div class="wrapper">
|
8
|
+
<section>
|
9
|
+
<div id="title">
|
10
|
+
<h1>{{ page.title }}</h1>
|
11
|
+
<hr>
|
12
|
+
{% unless page.bare %}
|
13
|
+
<span class="credits left">By <a href="{{ page.author_url | default: site.author_url }}">{{ page.author_name | default: site.author_name }}</a></span>
|
14
|
+
<span class="credits right">{{ page.date | date: date_format }}</span>
|
15
|
+
{% endunless %}
|
16
|
+
</div>
|
17
|
+
|
18
|
+
<div class="content">
|
19
|
+
{% unless page.bare %}{% assign generate_toc = page.toc | default: site.toc %}{% if generate_toc %}
|
20
|
+
<div class="sidebar">
|
21
|
+
<h1 id="contents">Contents</h1>
|
22
|
+
{% include toc.html html=content %}
|
23
|
+
</div>
|
24
|
+
{% endif %}{% endunless %}
|
25
|
+
|
26
|
+
<div class="main">
|
27
|
+
{{ content }}
|
28
|
+
</div>
|
29
|
+
</div>
|
30
|
+
</section>
|
31
|
+
</div>
|
18
32
|
</div>
|
19
33
|
{% include footer.html %}
|
20
34
|
</body>
|
data/_layouts/home.html
CHANGED
@@ -4,13 +4,13 @@ layout: default
|
|
4
4
|
{{ content }}
|
5
5
|
|
6
6
|
{% if site.posts.size > 0 %}
|
7
|
-
<h1 class="post-list-heading">{{ page.list_title | default: "Blog" }} <a href="{{ "/feed.xml" | relative_url }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#rss' | relative_url }}"></use></svg></a></h1>
|
7
|
+
<h1 class="post-list-heading" id="blog">{{ page.list_title | default: "Blog" }} <a href="{{ "/feed.xml" | relative_url }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#rss' | relative_url }}"></use></svg></a></h1>
|
8
8
|
<ul class="post-list">
|
9
9
|
{% for post in site.posts %}
|
10
10
|
<li>
|
11
11
|
{% assign date_format = site.charcoal.date_format | default: "%b %-d, %Y" %}
|
12
12
|
<span class="post-meta">{{ post.date | date: date_format }}, <a href="{{ page.author_url | default: site.author_url }}">{{ page.author_name | default: site.author_name }}</a></span>
|
13
|
-
<h2><a class="post-link" href="{{ post.url | relative_url }}">{{ post.title | escape }}</a></h2>
|
13
|
+
<h2 id="{{ post.slug | handleize }}"><a class="post-link" href="{{ post.url | relative_url }}">{{ post.title | escape }}</a></h2>
|
14
14
|
{% if site.show_excerpts %}
|
15
15
|
{{ post.excerpt }}
|
16
16
|
{% endif %}
|
@@ -18,7 +18,3 @@ layout: default
|
|
18
18
|
{% endfor %}
|
19
19
|
</ul>
|
20
20
|
{% endif %}
|
21
|
-
{% if site.dribbble_username or site.facebook_username or site.flickr_username or site.github_username or site.instagram_username or site.linkedin_username or site.pinterest_username or site.mastodon or site.twitter_username or site.youtube_username or site.googleplus_username or site.rss %}
|
22
|
-
<h1>Social</h1>
|
23
|
-
{% include social.html %}
|
24
|
-
{% endif %}
|
data/_sass/fonts.scss
CHANGED
@@ -7,7 +7,6 @@
|
|
7
7
|
url('../fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
|
8
8
|
font-weight: normal;
|
9
9
|
font-style: normal;
|
10
|
-
|
11
10
|
}
|
12
11
|
|
13
12
|
@font-face {
|
@@ -19,7 +18,6 @@
|
|
19
18
|
url('../fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg');
|
20
19
|
font-weight: normal;
|
21
20
|
font-style: normal;
|
22
|
-
|
23
21
|
}
|
24
22
|
|
25
23
|
@font-face {
|
@@ -92,4 +90,4 @@
|
|
92
90
|
font-weight: normal;
|
93
91
|
font-style: normal;
|
94
92
|
-webkit-font-smoothing:antialiased;
|
95
|
-
}
|
93
|
+
}
|
@@ -2,93 +2,79 @@
|
|
2
2
|
@import "fonts";
|
3
3
|
@import "rouge-base16-dark.scss";
|
4
4
|
|
5
|
-
$charcoal-
|
6
|
-
$charcoal-
|
7
|
-
|
5
|
+
$charcoal-color-highlight: #2288ff;
|
6
|
+
$charcoal-color-text: #d8d8d8;
|
7
|
+
$charcoal-color-background: #1c1c1e;
|
8
|
+
$charcoal-width: 1300px;
|
9
|
+
$charcoal-header-height: 60px;
|
10
|
+
$spacing-unit: 10px;
|
11
|
+
|
12
|
+
html, body { height: 100%; }
|
8
13
|
body {
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
background: linear_gradient(#2a2a29, #1c1c1c);
|
17
|
-
}
|
18
|
-
|
19
|
-
h1, h2, h3, h4, h5, h6 {
|
20
|
-
color:#e8e8e8;
|
21
|
-
margin:0 0 10px;
|
22
|
-
font-family: 'OpenSansRegular', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
14
|
+
display: flex;
|
15
|
+
flex-direction: column;
|
16
|
+
|
17
|
+
padding: 0;
|
18
|
+
margin: 0;
|
19
|
+
font: 14px/1.5 "OpenSansRegular", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
20
|
+
color: $charcoal-color-text;
|
23
21
|
font-weight: normal;
|
22
|
+
background: $charcoal-color-background;
|
24
23
|
}
|
24
|
+
.nonfooter { flex: 1 0 auto; }
|
25
25
|
|
26
|
-
p,
|
27
|
-
margin:0 0 20px;
|
28
|
-
}
|
29
|
-
|
30
|
-
h1, h2, h3 {
|
31
|
-
line-height:1.1;
|
32
|
-
|
33
|
-
}
|
34
|
-
|
35
|
-
h1 {
|
36
|
-
font-size:28px;
|
26
|
+
p, table, pre, ul, ol, dl {
|
27
|
+
margin: 0 0 20px;
|
37
28
|
}
|
38
|
-
|
39
|
-
|
40
|
-
|
29
|
+
ul, ol, dl {
|
30
|
+
ul, ol, dl {
|
31
|
+
margin: 0;
|
32
|
+
}
|
41
33
|
}
|
42
34
|
|
43
|
-
h4, h5, h6 {
|
44
|
-
|
35
|
+
h1, h2, h3, h4, h5, h6 {
|
36
|
+
position: relative;
|
37
|
+
z-index: -1;
|
38
|
+
color: lighten($charcoal-color-text, 20%);
|
39
|
+
padding-top: $charcoal-header-height + 10px;
|
40
|
+
margin: -$charcoal-header-height - 10px 0 10px;
|
41
|
+
font-family: 'OpenSansRegular', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
42
|
+
font-weight: normal;
|
45
43
|
}
|
46
|
-
|
44
|
+
h1, h2, h3 { line-height: 1.1; }
|
45
|
+
h1 { font-size: 28px; }
|
46
|
+
h2 { font-size: 24px; }
|
47
47
|
h3 {
|
48
48
|
font-size: 18px;
|
49
49
|
line-height: 24px;
|
50
50
|
font-family: 'OpenSansRegular', "Helvetica Neue", Helvetica, Arial, sans-serif !important;
|
51
51
|
font-weight: normal;
|
52
|
-
color: #b6b6b6;
|
53
52
|
}
|
54
53
|
|
55
54
|
a {
|
56
|
-
color
|
57
|
-
font-weight:400;
|
58
|
-
text-decoration:none;
|
59
|
-
|
60
|
-
&:hover {
|
61
|
-
color: #ffeb9b;
|
62
|
-
}
|
63
|
-
|
64
|
-
.social-media-list &:hover {
|
65
|
-
text-decoration: none;
|
66
|
-
|
67
|
-
.username {
|
68
|
-
text-decoration: underline;
|
69
|
-
}
|
70
|
-
}
|
55
|
+
color: $charcoal-color-highlight;
|
56
|
+
font-weight: 400;
|
57
|
+
text-decoration: none;
|
58
|
+
&:hover { color: lighten($charcoal-color-highlight, 25%); }
|
71
59
|
}
|
72
60
|
|
73
61
|
a small {
|
74
|
-
font-size:11px;
|
75
|
-
color
|
76
|
-
margin-top
|
77
|
-
display:block;
|
62
|
+
font-size: 11px;
|
63
|
+
color: #666;
|
64
|
+
margin-top: -0.6em;
|
65
|
+
display: block;
|
78
66
|
}
|
79
67
|
|
80
68
|
.social-media-list {
|
81
|
-
li + li {
|
82
|
-
padding-top: 5px;
|
83
|
-
}
|
69
|
+
li + li { padding-top: 5px; }
|
84
70
|
}
|
85
71
|
|
86
72
|
.svg-icon {
|
87
73
|
width: 16px;
|
88
74
|
height: 16px;
|
89
75
|
display: inline-block;
|
90
|
-
fill:
|
91
|
-
padding-right:
|
76
|
+
fill: $charcoal-color-highlight;
|
77
|
+
padding-right: 2px;
|
92
78
|
vertical-align: middle;
|
93
79
|
}
|
94
80
|
|
@@ -102,43 +88,39 @@ strong {
|
|
102
88
|
}
|
103
89
|
|
104
90
|
.wrapper {
|
105
|
-
max-width
|
106
|
-
margin:0 auto;
|
107
|
-
position:relative;
|
91
|
+
max-width: $charcoal-width;
|
92
|
+
margin: 0 auto;
|
93
|
+
position: relative;
|
108
94
|
padding: 0 20px;
|
109
95
|
}
|
110
96
|
|
111
|
-
section img {
|
112
|
-
max-width: 100%;
|
113
|
-
}
|
114
|
-
|
115
97
|
blockquote {
|
116
|
-
border-left:3px solid #ffcc00;
|
117
|
-
margin:0;
|
118
|
-
padding:0 0 0 20px;
|
119
|
-
font-style:italic;
|
98
|
+
border-left: 3px solid #ffcc00;
|
99
|
+
margin: 0;
|
100
|
+
padding: 0 0 0 20px;
|
101
|
+
font-style: italic;
|
120
102
|
}
|
121
103
|
|
122
104
|
code {
|
123
105
|
font-family: Monaco, Bitstream Vera Sans Mono, Lucida Console, Terminal, monospace;
|
124
|
-
color
|
125
|
-
font-size:13px;
|
126
|
-
margin: 0
|
127
|
-
padding:
|
128
|
-
border-radius:
|
106
|
+
color: darken($charcoal-color-text, 20%);
|
107
|
+
font-size: 13px;
|
108
|
+
margin: 0 1px;
|
109
|
+
padding: 1px 2px;
|
110
|
+
border-radius: 1px;
|
129
111
|
}
|
130
112
|
|
131
113
|
pre {
|
132
|
-
padding:8px 15px;
|
133
|
-
background:
|
114
|
+
padding: 8px 15px;
|
115
|
+
background: darken($charcoal-color-background, 5%);
|
134
116
|
border-radius: 2px;
|
135
|
-
border:1px solid
|
117
|
+
border: 1px solid darken($charcoal-color-background, 10%);
|
136
118
|
box-shadow: inset 0 1px 3px rgba(0,0,0,.3);
|
137
119
|
overflow: auto;
|
138
120
|
overflow-y: hidden;
|
139
121
|
|
140
122
|
code {
|
141
|
-
color:
|
123
|
+
color: darken($charcoal-color-text, 20%);
|
142
124
|
text-shadow: 0px 1px 0px #000;
|
143
125
|
margin: 0;
|
144
126
|
padding: 0;
|
@@ -160,9 +142,9 @@ th {
|
|
160
142
|
}
|
161
143
|
|
162
144
|
td {
|
163
|
-
text-align:left;
|
164
|
-
padding:5px 10px;
|
165
|
-
border-bottom:1px solid #434343;
|
145
|
+
text-align: left;
|
146
|
+
padding: 5px 10px;
|
147
|
+
border-bottom: 1px solid #434343;
|
166
148
|
}
|
167
149
|
|
168
150
|
hr {
|
@@ -181,25 +163,31 @@ dt {
|
|
181
163
|
|
182
164
|
#header {
|
183
165
|
z-index: 100;
|
184
|
-
|
166
|
+
position: fixed;
|
185
167
|
top: 0px;
|
186
168
|
height: $charcoal-header-height;
|
169
|
+
left: 0;
|
187
170
|
width: 100%;
|
188
|
-
|
189
|
-
background: url(../images/nav-bg.gif)
|
190
|
-
border-bottom: 4px solid
|
171
|
+
|
172
|
+
background: url(../images/nav-bg.gif) lighten($charcoal-color-background, 5%);
|
173
|
+
border-bottom: 4px solid lighten($charcoal-color-background, 20%);
|
191
174
|
box-shadow: 0px 1px 3px rgba(0,0,0,.25);
|
192
175
|
|
193
176
|
#title {
|
194
177
|
margin: 0 0 0 0;
|
195
178
|
|
196
179
|
h1 {
|
180
|
+
position: relative;
|
181
|
+
z-index: 100;
|
197
182
|
text-align: left;
|
198
183
|
line-height: 40px;
|
199
184
|
}
|
200
185
|
|
201
|
-
p {
|
202
|
-
|
186
|
+
p { text-align: left; }
|
187
|
+
.site-image {
|
188
|
+
width: 40px;
|
189
|
+
border-radius: 2px;
|
190
|
+
vertical-align: middle;
|
203
191
|
}
|
204
192
|
}
|
205
193
|
|
@@ -253,16 +241,21 @@ dt {
|
|
253
241
|
}
|
254
242
|
|
255
243
|
section {
|
256
|
-
max-width
|
244
|
+
max-width: $charcoal-width;
|
257
245
|
padding: 10px 0px 10px 0px;
|
258
246
|
margin: 20px 0;
|
259
247
|
margin-top: $charcoal-header-height + 10px;
|
248
|
+
|
249
|
+
img { max-width: 100%; }
|
250
|
+
|
251
|
+
.content { display: flex; }
|
252
|
+
.sidebar { flex: 20%; }
|
260
253
|
}
|
261
254
|
|
262
255
|
#title {
|
263
256
|
border: 0;
|
264
257
|
outline: none;
|
265
|
-
margin: 0 0
|
258
|
+
margin: 0 0 15px 0;
|
266
259
|
padding: 0 0 5px 0;
|
267
260
|
|
268
261
|
h1 {
|
@@ -288,47 +281,62 @@ section {
|
|
288
281
|
color: #696969;
|
289
282
|
margin-top: -10px;
|
290
283
|
|
291
|
-
&.left {
|
292
|
-
|
293
|
-
|
284
|
+
&.left { float: left; }
|
285
|
+
&.right { float: right; }
|
286
|
+
}
|
287
|
+
}
|
294
288
|
|
295
|
-
|
296
|
-
|
289
|
+
footer {
|
290
|
+
z-index: -3;
|
291
|
+
flex-shrink: 0;
|
292
|
+
padding-top: 10px;
|
293
|
+
width: 100%;
|
294
|
+
background: url(../images/nav-bg.gif) lighten($charcoal-color-background, 5%);
|
295
|
+
border-top: 4px solid lighten($charcoal-color-background, 20%);
|
296
|
+
|
297
|
+
.wrapper {
|
298
|
+
display: flex;
|
299
|
+
.footer-col-1 {
|
300
|
+
width: -webkit-calc(20% - (#{$spacing-unit} / 2));
|
301
|
+
width: calc(20% - (#{$spacing-unit} / 2));
|
302
|
+
}
|
303
|
+
.footer-col-2 {
|
304
|
+
width: -webkit-calc(35% - (#{$spacing-unit} / 2));
|
305
|
+
width: calc(35% - (#{$spacing-unit} / 2));
|
306
|
+
}
|
307
|
+
.footer-col-3 {
|
308
|
+
width: -webkit-calc(45% - (#{$spacing-unit} / 2));
|
309
|
+
width: calc(45% - (#{$spacing-unit} / 2));
|
297
310
|
}
|
298
311
|
}
|
299
312
|
}
|
300
313
|
|
301
|
-
|
302
|
-
|
303
|
-
|
304
|
-
|
305
|
-
|
306
|
-
|
307
|
-
|
308
|
-
|
309
|
-
|
310
|
-
float: none;
|
311
|
-
display: block;
|
312
|
-
}
|
313
|
-
|
314
|
-
.right {
|
315
|
-
float: none;
|
316
|
-
display: block;
|
317
|
-
}
|
318
|
-
}
|
314
|
+
.about_image {
|
315
|
+
display: flex;
|
316
|
+
align-items: center;
|
317
|
+
|
318
|
+
.about_image_col { float: left; }
|
319
|
+
.about_image_content { margin-left: 20px; }
|
320
|
+
.about_image_image {
|
321
|
+
width: 200px;
|
322
|
+
border-radius: 15px;
|
319
323
|
}
|
320
324
|
}
|
321
325
|
|
322
326
|
@media print, screen and (max-width: 480px) {
|
323
327
|
#header {
|
324
|
-
|
325
|
-
|
326
|
-
|
327
|
-
|
328
|
-
|
328
|
+
height: $charcoal-header-height - 65px;
|
329
|
+
#title {
|
330
|
+
p { display: none; }
|
331
|
+
.credits { display: none; }
|
332
|
+
}
|
329
333
|
}
|
330
|
-
|
331
|
-
nav {
|
332
|
-
|
334
|
+
section { margin-top: $charcoal-header-height - 65px; }
|
335
|
+
nav { display: none; }
|
336
|
+
footer {
|
337
|
+
.wrapper {
|
338
|
+
flex-wrap: wrap;
|
339
|
+
.footer-col { width: 100%; }
|
340
|
+
}
|
333
341
|
}
|
334
342
|
}
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: jekyll-theme-charcoal
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.4
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Greg Gibeling
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2018-03-
|
11
|
+
date: 2018-03-10 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: jekyll
|
@@ -75,11 +75,13 @@ extra_rdoc_files: []
|
|
75
75
|
files:
|
76
76
|
- LICENSE.txt
|
77
77
|
- README.md
|
78
|
+
- _includes/about_image.html
|
78
79
|
- _includes/footer.html
|
79
80
|
- _includes/google-analytics.html
|
80
81
|
- _includes/head.html
|
81
82
|
- _includes/header.html
|
82
83
|
- _includes/social.html
|
84
|
+
- _includes/toc.html
|
83
85
|
- _layouts/default.html
|
84
86
|
- _layouts/home.html
|
85
87
|
- _layouts/page.html
|
@@ -127,7 +129,7 @@ files:
|
|
127
129
|
- assets/images/nav-bg.gif
|
128
130
|
- assets/js/respond.js
|
129
131
|
- assets/minima-social-icons.svg
|
130
|
-
homepage:
|
132
|
+
homepage: http://www.g2forge.com/charcoal/
|
131
133
|
licenses:
|
132
134
|
- MIT
|
133
135
|
metadata: {}
|