minimal-mistakes-jekyll 4.5.1 → 4.5.2

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 509bfab6197655e8082b667f3587247fc813c553
4
- data.tar.gz: d53e66700aa96e1c1c11c5864e02f65edf9cf9fd
3
+ metadata.gz: ac1a070680ed6bb3eaf203d965d6edf796292021
4
+ data.tar.gz: eeb4177b21445dcdb76c519c4cd57b7f607fe323
5
5
  SHA512:
6
- metadata.gz: 4649d24384b4c2aac3ec929775d16f7998ef22a321896086702ced76419a62d6e1fba5d3124adc2bf9bacf993b7bb03ec7374ae38ed7dcd8d308ea9f1d7d28d6
7
- data.tar.gz: 3d598ea89c6640a37cac15fab8798211163831da5dcee71c4fe0787bd4f4ed519434f02c84010573f186e6e2f548c0022010aff6ecf9582da8f84ef09f87b899
6
+ metadata.gz: adff024cee58c4172058b1a2803056cec3824e93e5a147e47271eee448a4485cf007b8565a9755fd680a3d6e7b1cd4200f82457432cfa9891931f16f8ab5b0ec
7
+ data.tar.gz: 4717e2acb3bf939e064e05faea917aa1670dc44621615f5fcde944bba309dc9a4b6cf641409b7e098fc507cac123da412d02e7cf64ae6a86834aa17634b8bb22
data/CHANGELOG.md CHANGED
@@ -1,3 +1,28 @@
1
+ ## [4.5.2](https://github.com/mmistakes/minimal-mistakes/releases/tag/4.5.2)
2
+
3
+ ### Enhancements
4
+
5
+ - Add `.page__comments-form` to "non-printing" selectors in print styles. [#1195](https://github.com/mmistakes/minimal-mistakes/pull/1195)
6
+ - Add LinkedIn and Steam author sidebar examples to `_config.yml`. [#1203](https://github.com/mmistakes/minimal-mistakes/pull/1203) [#1204](https://github.com/mmistakes/minimal-mistakes/pull/1204)
7
+ - Remove the http-equiv="cleartype" meta tag. [#1087](https://github.com/mmistakes/minimal-mistakes/pull/1087)
8
+ - Clarify documentation for `jekyll-archives` plugin and how to install. [#1206](https://github.com/mmistakes/minimal-mistakes/pull/1206)
9
+ - Clarify documentation around taxonomy page and index generation. [#1207](https://github.com/mmistakes/minimal-mistakes/pull/1207)
10
+ - Fix "Posts by tag" grammar in documentation. [#1209](https://github.com/mmistakes/minimal-mistakes/pull/1209)
11
+ - Improve Chinese `date_label` and `minute_read` translations in `ui-text.yml`. [#1205](https://github.com/mmistakes/minimal-mistakes/pull/1205) [#1211](https://github.com/mmistakes/minimal-mistakes/pull/1211)
12
+ - Add note to Quick-Start Guide about GitHub Pages hosting alternatives that allow 3rd party gem themes and Jekyll plugins.
13
+ - Add note to configuration documentation about Cloudflare minification as an alternative to `layout: compress`. [#1217](https://github.com/mmistakes/minimal-mistakes/pull/1217)
14
+ - Show 4 latest posts in "You May Also Enjoy" module when `related: true` and no related posts are found due to `lsi` ([latent semantic indexing](https://en.wikipedia.org/wiki/Latent_semantic_analysis#Latent_semantic_indexing)) being disabled on GitHub Pages. [#554](https://github.com/mmistakes/minimal-mistakes/issues/554)
15
+ - Truncate archive item titles' that overflow with an ellipsis. [#1213]
16
+
17
+ ### Bug Fixes
18
+
19
+ - Fix license URL in README file. [#1189](https://github.com/mmistakes/minimal-mistakes/pull/1189)
20
+ - Reduce amount of blank pages when printing in Chrome. [#1196](https://github.com/mmistakes/minimal-mistakes/issues/1196)
21
+ - Remove `#disqus_thread` duplicate from `comments-providers/disqus.html` as it is already in `comments.html` include. [#1199](https://github.com/mmistakes/minimal-mistakes/issues/1199)
22
+ - Fix Liquid syntax errors in `tag-list.html` and `category-list.html` includes by removing parenthesis in `assign`s. [#1223](https://github.com/mmistakes/minimal-mistakes/issues/1223)
23
+ - Fix Liquid syntax error: "Expected id but found open_square in `"{{page.[include.id] }}"`" in `gallery` and `feature_row` includes.
24
+ - Fix Liquid syntax error: "Expected end_of_string but found pipe in `"name in __names | sort"`" in `group-by-array` include.
25
+
1
26
  ## [4.5.1](https://github.com/mmistakes/minimal-mistakes/releases/tag/4.5.1)
2
27
 
3
28
  ### Enhancements
@@ -11,7 +36,7 @@
11
36
  - URL encode title and page URL in social share links. [#1177](https://github.com/mmistakes/minimal-mistakes/pull/1177)
12
37
  - Replace old Disqus script with new Universal Embed Code. [#1179](https://github.com/mmistakes/minimal-mistakes/pull/1179)
13
38
 
14
- ## Bug Fixes
39
+ ### Bug Fixes
15
40
 
16
41
  - Fix positioning of sidebar table of contents when using `layout: splash`. [#1169](https://github.com/mmistakes/minimal-mistakes/issues/1169)
17
42
  - Fix "follow" links `z-index` order to avoid overlapping issues. [#1167](https://github.com/mmistakes/minimal-mistakes/issues/1167)
@@ -852,4 +877,4 @@
852
877
 
853
878
  - Google Analytics, Google Authorship, webmaster verifies, and Twitter card meta are now optional.
854
879
 
855
- ## [1.0.1](https://github.com/mmistakes/minimal-mistakes/releases/tag/v1.0.1)
880
+ ## [1.0.1](https://github.com/mmistakes/minimal-mistakes/releases/tag/v1.0.1)
data/README.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # [Minimal Mistakes Jekyll Theme](https://mmistakes.github.io/minimal-mistakes/)
2
2
 
3
- [![GitHub release](https://img.shields.io/gem/v/minimal-mistakes-jekyll.svg)](https://github.com/mmistakes/minimal-mistakes/releases) [![GitHub license](https://img.shields.io/badge/license-MIT-lightgrey.svg)](https://raw.githubusercontent.com/mmistakes/minimal-mistakes/master/LICENSE)
3
+ [![GitHub release](https://img.shields.io/gem/v/minimal-mistakes-jekyll.svg)](https://github.com/mmistakes/minimal-mistakes/releases) [![GitHub license](https://img.shields.io/badge/license-MIT-lightgrey.svg)](https://raw.githubusercontent.com/mmistakes/minimal-mistakes/master/LICENSE.txt)
4
4
 
5
5
  Minimal Mistakes is a flexible two-column Jekyll theme. Perfect for hosting your personal site, blog, or portfolio on GitHub or self-hosting on your own server. As the name implies --- styling is purposely minimalistic to be enhanced and customized by you :smile:.
6
6
 
@@ -18,7 +18,7 @@ See what's new in the [CHANGELOG](CHANGELOG.md).
18
18
  ## Notable Features
19
19
 
20
20
  - "Gemified" for easier install/upgrading
21
- - Compatible with Jekyll 3.x and GitHub Pages
21
+ - Compatible with Jekyll 3.5 and GitHub Pages
22
22
  - Support for Jekyll's built-in Sass/SCSS preprocessor
23
23
  - Several responsive layout options (single, archive index, splash, and paginated home page)
24
24
  - SEO optimized with support for [Twitter Cards](https://dev.twitter.com/cards/overview) and [Open Graph](http://ogp.me/) data
@@ -37,7 +37,7 @@ See what's new in the [CHANGELOG](CHANGELOG.md).
37
37
  | [Post with a Gallery][gallery-post] | A post showing several images wrapped in `<figure>` elements. |
38
38
  | [Sample Collection Page][sample-collection] | Single page from a collection. |
39
39
  | [Categories Archive][categories-archive] | Posts grouped by category. |
40
- | [Tags Archive][tags-archive] | Posts grouped by tags. |
40
+ | [Tags Archive][tags-archive] | Posts grouped by tag. |
41
41
 
42
42
  Additional sample posts are available under [posts archive][year-archive] on the demo site. Source files for these (and the entire demo site) can be found in [`/docs`](docs).
43
43
 
data/_data/ui-text.yml CHANGED
@@ -322,12 +322,12 @@ zh: &DEFAULT_ZH
322
322
  toc_label : "在本页上"
323
323
  ext_link_label : "直接链接"
324
324
  less_than : "少于"
325
- minute_read : "分钟 阅读"
325
+ minute_read : "分钟读完"
326
326
  share_on_label : "分享"
327
327
  meta_label :
328
328
  tags_label : "标签:"
329
329
  categories_label : "分类:"
330
- date_label : "最新的:"
330
+ date_label : "更新时间:"
331
331
  comments_label : "留下评论"
332
332
  comments_title : "评论"
333
333
  more_label : "了解更多"
@@ -11,7 +11,7 @@
11
11
  <!-- modified from http://www.codeofclimber.ru/2015/sorting-site-tags-in-jekyll/ -->
12
12
  {% endcomment %}
13
13
  {% capture page_categories %}{% for category in page.categories %}{{ category | downcase }}#{{ category }}{% unless forloop.last %},{% endunless %}{% endfor %}{% endcapture %}
14
- {% assign category_hashes = (page_categories | split: ',' | sort:0) %}
14
+ {% assign category_hashes = page_categories | split: ',' | sort %}
15
15
 
16
16
  <p class="page__taxonomy">
17
17
  <strong><i class="fa fa-fw fa-folder-open" aria-hidden="true"></i> {{ site.data.ui-text[site.locale].categories_label | default: "Categories:" }} </strong>
@@ -1,16 +1,15 @@
1
- {% if site.comments.disqus.shortname %}
2
- <div id="disqus_thread"></div>
3
- <script>
4
- var disqus_config = function () {
5
- this.page.url = "{{ page.url | absolute_url }}"; // Replace PAGE_URL with your page's canonical URL variable
6
- this.page.identifier = "{{ page.id }}"; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
7
- };
8
- (function() { // DON'T EDIT BELOW THIS LINE
9
- var d = document, s = d.createElement('script');
10
- s.src = 'https://{{ site.comments.disqus.shortname }}.disqus.com/embed.js';
11
- s.setAttribute('data-timestamp', +new Date());
12
- (d.head || d.body).appendChild(s);
13
- })();
14
- </script>
15
- <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
16
- {% endif %}
1
+ {% if site.comments.disqus.shortname %}
2
+ <script>
3
+ var disqus_config = function () {
4
+ this.page.url = "{{ page.url | absolute_url }}"; // Replace PAGE_URL with your page's canonical URL variable
5
+ this.page.identifier = "{{ page.id }}"; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
6
+ };
7
+ (function() { // DON'T EDIT BELOW THIS LINE
8
+ var d = document, s = d.createElement('script');
9
+ s.src = 'https://{{ site.comments.disqus.shortname }}.disqus.com/embed.js';
10
+ s.setAttribute('data-timestamp', +new Date());
11
+ (d.head || d.body).appendChild(s);
12
+ })();
13
+ </script>
14
+ <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
15
+ {% endif %}
@@ -47,49 +47,51 @@
47
47
  <!-- End static comments -->
48
48
 
49
49
  <!-- Start new comment form -->
50
- <h4 class="page__comments-title">{{ site.data.ui-text[site.locale].comments_label | default: "Leave a Comment" }}</h4>
51
- <p class="small">{{ site.data.ui-text[site.locale].comment_form_info | default: "Your email address will not be published. Required fields are marked" }} <span class="required">*</span></p>
52
- <form id="new_comment" class="page__comments-form js-form form" method="post" action="https://api.staticman.net/v1/entry/{{ site.repository }}/{{ site.staticman.branch }}">
53
- <div class="form__spinner">
54
- <i class="fa fa-spinner fa-spin fa-3x fa-fw"></i>
55
- <span class="sr-only">{{ site.data.ui-text[site.locale].loading_label | default: "Loading..." }}</span>
56
- </div>
50
+ <div class="page__comments-form">
51
+ <h4 class="page__comments-title">{{ site.data.ui-text[site.locale].comments_label | default: "Leave a Comment" }}</h4>
52
+ <p class="small">{{ site.data.ui-text[site.locale].comment_form_info | default: "Your email address will not be published. Required fields are marked" }} <span class="required">*</span></p>
53
+ <form id="new_comment" class="page__comments-form js-form form" method="post" action="https://api.staticman.net/v1/entry/{{ site.repository }}/{{ site.staticman.branch }}">
54
+ <div class="form__spinner">
55
+ <i class="fa fa-spinner fa-spin fa-3x fa-fw"></i>
56
+ <span class="sr-only">{{ site.data.ui-text[site.locale].loading_label | default: "Loading..." }}</span>
57
+ </div>
57
58
 
58
- <fieldset>
59
- <label for="comment-form-message">{{ site.data.ui-text[site.locale].comment_form_comment_label | default: "Comment" }} <small class="required">*</small></label>
60
- <textarea type="text" rows="3" id="comment-form-message" name="fields[message]" tabindex="1"></textarea>
61
- <div class="small help-block"><a href="https://daringfireball.net/projects/markdown/">{{ site.data.ui-text[site.locale].comment_form_md_info | default: "Markdown is supported." }}</a></div>
62
- </fieldset>
63
- <fieldset>
64
- <label for="comment-form-name">{{ site.data.ui-text[site.locale].comment_form_name_label | default: "Name" }} <small class="required">*</small></label>
65
- <input type="text" id="comment-form-name" name="fields[name]" tabindex="2" />
66
- </fieldset>
67
- <fieldset>
68
- <label for="comment-form-email">{{ site.data.ui-text[site.locale].comment_form_email_label | default: "Email address" }} <small class="required">*</small></label>
69
- <input type="email" id="comment-form-email" name="fields[email]" tabindex="3" />
70
- </fieldset>
71
- <fieldset>
72
- <label for="comment-form-url">{{ site.data.ui-text[site.locale].comment_form_website_label | default: "Website (optional)" }}</label>
73
- <input type="url" id="comment-form-url" name="fields[url]" tabindex="4"/>
74
- </fieldset>
75
- <fieldset class="hidden" style="display: none;">
76
- <input type="hidden" name="options[slug]" value="{{ page.slug }}">
77
- <label for="comment-form-location">Not used. Leave blank if you are a human.</label>
78
- <input type="text" id="comment-form-location" name="fields[hidden]" autocomplete="off"/>
79
- </fieldset>
80
- <!-- Start comment form alert messaging -->
81
- <p class="hidden js-notice">
82
- <strong class="js-notice-text"></strong>
83
- </p>
84
- <!-- End comment form alert messaging -->
85
- <fieldset>
86
- <button type="submit" id="comment-form-submit" tabindex="5" class="btn btn--large">{{ site.data.ui-text[site.locale].comment_btn_submit | default: "Submit Comment" }}</button>
87
- </fieldset>
88
- </form>
59
+ <fieldset>
60
+ <label for="comment-form-message">{{ site.data.ui-text[site.locale].comment_form_comment_label | default: "Comment" }} <small class="required">*</small></label>
61
+ <textarea type="text" rows="3" id="comment-form-message" name="fields[message]" tabindex="1"></textarea>
62
+ <div class="small help-block"><a href="https://daringfireball.net/projects/markdown/">{{ site.data.ui-text[site.locale].comment_form_md_info | default: "Markdown is supported." }}</a></div>
63
+ </fieldset>
64
+ <fieldset>
65
+ <label for="comment-form-name">{{ site.data.ui-text[site.locale].comment_form_name_label | default: "Name" }} <small class="required">*</small></label>
66
+ <input type="text" id="comment-form-name" name="fields[name]" tabindex="2" />
67
+ </fieldset>
68
+ <fieldset>
69
+ <label for="comment-form-email">{{ site.data.ui-text[site.locale].comment_form_email_label | default: "Email address" }} <small class="required">*</small></label>
70
+ <input type="email" id="comment-form-email" name="fields[email]" tabindex="3" />
71
+ </fieldset>
72
+ <fieldset>
73
+ <label for="comment-form-url">{{ site.data.ui-text[site.locale].comment_form_website_label | default: "Website (optional)" }}</label>
74
+ <input type="url" id="comment-form-url" name="fields[url]" tabindex="4"/>
75
+ </fieldset>
76
+ <fieldset class="hidden" style="display: none;">
77
+ <input type="hidden" name="options[slug]" value="{{ page.slug }}">
78
+ <label for="comment-form-location">Not used. Leave blank if you are a human.</label>
79
+ <input type="text" id="comment-form-location" name="fields[hidden]" autocomplete="off"/>
80
+ </fieldset>
81
+ <!-- Start comment form alert messaging -->
82
+ <p class="hidden js-notice">
83
+ <strong class="js-notice-text"></strong>
84
+ </p>
85
+ <!-- End comment form alert messaging -->
86
+ <fieldset>
87
+ <button type="submit" id="comment-form-submit" tabindex="5" class="btn btn--large">{{ site.data.ui-text[site.locale].comment_btn_submit | default: "Submit Comment" }}</button>
88
+ </fieldset>
89
+ </form>
90
+ </div>
89
91
  <!-- End new comment form -->
90
92
  {% endif %}
91
93
  </section>
92
94
  {% when "custom" %}
93
95
  <section id="custom-comments"></section>
94
96
  {% endcase %}
95
- </div>
97
+ </div>
@@ -1,5 +1,5 @@
1
1
  {% if include.id %}
2
- {% assign feature_row = page.[include.id] %}
2
+ {% assign feature_row = page[include.id] %}
3
3
  {% else %}
4
4
  {% assign feature_row = page.feature_row %}
5
5
  {% endif %}
data/_includes/gallery CHANGED
@@ -1,5 +1,5 @@
1
1
  {% if include.id %}
2
- {% assign gallery = page.[include.id] %}
2
+ {% assign gallery = page[include.id] %}
3
3
  {% else %}
4
4
  {% assign gallery = page.gallery %}
5
5
  {% endif %}
@@ -18,7 +18,7 @@
18
18
 
19
19
  <!-- Uniq -->
20
20
  {% assign __names = __names | sort %}
21
- {% for name in __names | sort %}
21
+ {% for name in __names %}
22
22
 
23
23
  <!-- If not equal to previous then it must be unique as sorted -->
24
24
  {% unless name == previous %}
data/_includes/head.html CHANGED
@@ -1,34 +1,32 @@
1
- <meta charset="utf-8">
2
-
3
- {% include seo.html %}
4
-
5
- <link href="{% if site.atom_feed.path %}{{ site.atom_feed.path }}{% else %}{{ '/feed.xml' | absolute_url }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ site.title }} Feed">
6
-
7
- <!-- http://t.co/dKP3o1e -->
8
- <meta name="HandheldFriendly" content="True">
9
- <meta name="MobileOptimized" content="320">
10
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
11
-
12
- <script>
13
- document.documentElement.className = document.documentElement.className.replace(/\bno-js\b/g, '') + ' js ';
14
- </script>
15
-
16
- <!-- For all browsers -->
17
- <link rel="stylesheet" href="{{ '/assets/css/main.css' | absolute_url }}">
18
-
19
- <!--[if lte IE 9]>
20
- <style>
21
- /* old IE unsupported flexbox fixes */
22
- .greedy-nav .site-title {
23
- padding-right: 3em;
24
- }
25
- .greedy-nav button {
26
- position: absolute;
27
- top: 0;
28
- right: 0;
29
- height: 100%;
30
- }
31
- </style>
32
- <![endif]-->
33
-
34
- <meta http-equiv="cleartype" content="on">
1
+ <meta charset="utf-8">
2
+
3
+ {% include seo.html %}
4
+
5
+ <link href="{% if site.atom_feed.path %}{{ site.atom_feed.path }}{% else %}{{ '/feed.xml' | absolute_url }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ site.title }} Feed">
6
+
7
+ <!-- http://t.co/dKP3o1e -->
8
+ <meta name="HandheldFriendly" content="True">
9
+ <meta name="MobileOptimized" content="320">
10
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
11
+
12
+ <script>
13
+ document.documentElement.className = document.documentElement.className.replace(/\bno-js\b/g, '') + ' js ';
14
+ </script>
15
+
16
+ <!-- For all browsers -->
17
+ <link rel="stylesheet" href="{{ '/assets/css/main.css' | absolute_url }}">
18
+
19
+ <!--[if lte IE 9]>
20
+ <style>
21
+ /* old IE unsupported flexbox fixes */
22
+ .greedy-nav .site-title {
23
+ padding-right: 3em;
24
+ }
25
+ .greedy-nav button {
26
+ position: absolute;
27
+ top: 0;
28
+ right: 0;
29
+ height: 100%;
30
+ }
31
+ </style>
32
+ <![endif]-->
@@ -11,7 +11,7 @@
11
11
  <!-- modified from http://www.codeofclimber.ru/2015/sorting-site-tags-in-jekyll/ -->
12
12
  {% endcomment %}
13
13
  {% capture page_tags %}{% for tag in page.tags %}{{ tag | downcase }}#{{ tag }}{% unless forloop.last %},{% endunless %}{% endfor %}{% endcapture %}
14
- {% assign tag_hashes = (page_tags | split: ',' | sort:0) %}
14
+ {% assign tag_hashes = page_tags | split: ',' | sort %}
15
15
 
16
16
  <p class="page__taxonomy">
17
17
  <strong><i class="fa fa-fw fa-tags" aria-hidden="true"></i> {{ site.data.ui-text[site.locale].tags_label | default: "Tags:" }} </strong>
@@ -3,7 +3,7 @@
3
3
 
4
4
  <!doctype html>
5
5
  <!--
6
- Minimal Mistakes Jekyll Theme 4.5.1 by Michael Rose
6
+ Minimal Mistakes Jekyll Theme 4.5.2 by Michael Rose
7
7
  Copyright 2017 Michael Rose - mademistakes.com | @mmistakes
8
8
  Free for personal and commercial use under the MIT license
9
9
  https://github.com/mmistakes/minimal-mistakes/blob/master/LICENSE.txt
@@ -31,4 +31,4 @@
31
31
  {% include scripts.html %}
32
32
 
33
33
  </body>
34
- </html>
34
+ </html>
data/_layouts/single.html CHANGED
@@ -60,7 +60,7 @@ layout: default
60
60
  {% endif %}
61
61
  </article>
62
62
 
63
- {% comment %}<!-- only show related on a post page when not disabled -->{% endcomment %}
63
+ {% comment %}<!-- only show related on a post page when `related: true` -->{% endcomment %}
64
64
  {% if page.id and page.related and site.related_posts.size > 0 %}
65
65
  <div class="page__related">
66
66
  <h4 class="page__related-title">{{ site.data.ui-text[site.locale].related_label | default: "You May Also Enjoy" }}</h4>
@@ -70,5 +70,15 @@ layout: default
70
70
  {% endfor %}
71
71
  </div>
72
72
  </div>
73
+ {% comment %}<!-- otherwise show recent posts if no related when `related: true` -->{% endcomment %}
74
+ {% elsif page.id and page.related %}
75
+ <div class="page__related">
76
+ <h4 class="page__related-title">{{ site.data.ui-text[site.locale].related_label | default: "You May Also Enjoy" }}</h4>
77
+ <div class="grid__wrapper">
78
+ {% for post in site.posts limit:4 %}
79
+ {% include archive-single.html type="grid" %}
80
+ {% endfor %}
81
+ </div>
82
+ </div>
73
83
  {% endif %}
74
84
  </div>
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * Minimal Mistakes Jekyll Theme 4.5.1 by Michael Rose
2
+ * Minimal Mistakes Jekyll Theme 4.5.2 by Michael Rose
3
3
  * Copyright 2017 Michael Rose - mademistakes.com | @mmistakes
4
4
  * Licensed under MIT (https://github.com/mmistakes/minimal-mistakes/blob/master/LICENSE.txt)
5
5
  */
@@ -37,6 +37,8 @@
37
37
  .archive__item-title {
38
38
  margin-bottom: 0.25em;
39
39
  font-family: $sans-serif-narrow;
40
+ overflow: hidden;
41
+ text-overflow: ellipsis;
40
42
 
41
43
  a + a {
42
44
  opacity: 0.5;
@@ -1,552 +1,552 @@
1
- /* ==========================================================================
2
- NAVIGATION
3
- ========================================================================== */
4
-
5
- /*
6
- Breadcrumb navigation links
7
- ========================================================================== */
8
-
9
- .breadcrumbs {
10
- @include clearfix;
11
- margin: 0 auto;
12
- max-width: 100%;
13
- padding-left: 2em;
14
- padding-right: 2em;
15
- font-family: $sans-serif;
16
- -webkit-animation: $intro-transition;
17
- animation: $intro-transition;
18
- -webkit-animation-delay: 0.30s;
19
- animation-delay: 0.30s;
20
-
21
- @include breakpoint($large) {
22
- padding-left: 1em;
23
- padding-right: 1em;
24
- }
25
-
26
- @include breakpoint($x-large) {
27
- max-width: $x-large;
28
- }
29
-
30
- ol {
31
- padding: 0;
32
- list-style: none;
33
- font-size: $type-size-6;
34
-
35
- @include breakpoint($large) {
36
- float: right;
37
- width: span(10 of 12);
38
- }
39
-
40
- @include breakpoint($x-large) {
41
- padding-left: gutter(0.5 of 12);
42
- }
43
- }
44
-
45
- li {
46
- display: inline;
47
- }
48
-
49
- .current {
50
- font-weight: bold;
51
- }
52
- }
53
-
54
-
55
- /*
56
- Post pagination navigation links
57
- ========================================================================== */
58
-
59
- .pagination {
60
- @include clearfix();
61
- float: left;
62
- margin-top: 1em;
63
- padding-top: 1em;
64
- width: 100%;
65
-
66
- ul {
67
- margin: 0;
68
- padding: 0;
69
- list-style-type: none;
70
- font-family: $sans-serif;
71
- }
72
-
73
- li {
74
- display: block;
75
- float: left;
76
- margin-left: -1px;
77
-
78
- a {
79
- display: block;
80
- margin-bottom: 0.25em;
81
- padding: 0.5em 1em;
82
- font-family: $sans-serif;
83
- font-size: 14px;
84
- font-weight: bold;
85
- line-height: 1.5;
86
- text-align: center;
87
- text-decoration: none;
88
- color: mix(#fff, $gray, 25%);
89
- border: 1px solid $light-gray;
90
- border-radius: 0;
91
-
92
- &:hover {
93
- color: $link-color-hover;
94
- }
95
-
96
- &.current {
97
- color: #fff;
98
- background: $primary-color;
99
- }
100
-
101
- &.disabled {
102
- color: mix(#fff, $gray, 75%);
103
- pointer-events: none;
104
- cursor: not-allowed;
105
- }
106
- }
107
-
108
- &:first-child {
109
- margin-left: 0;
110
-
111
- a {
112
- border-top-left-radius: $border-radius;
113
- border-bottom-left-radius: $border-radius;
114
- }
115
- }
116
-
117
- &:last-child {
118
- a {
119
- border-top-right-radius: $border-radius;
120
- border-bottom-right-radius: $border-radius;
121
- }
122
- }
123
- }
124
-
125
- /* next/previous buttons */
126
- &--pager {
127
- display: block;
128
- padding: 1em 2em;
129
- float: left;
130
- width: 50%;
131
- font-family: $sans-serif;
132
- font-size: $type-size-5;
133
- font-weight: bold;
134
- text-align: center;
135
- text-decoration: none;
136
- color: $link-color;
137
- border: 1px solid $light-gray;
138
- border-radius: $border-radius;
139
-
140
- &:hover {
141
- color: $link-color-hover;
142
- }
143
-
144
- &:first-child {
145
- border-top-right-radius: 0;
146
- border-bottom-right-radius: 0;
147
- }
148
-
149
- &:last-child {
150
- margin-left: -1px;
151
- border-top-left-radius: 0;
152
- border-bottom-left-radius: 0;
153
- }
154
-
155
- &.disabled {
156
- color: mix(#fff, $gray, 75%);
157
- pointer-events: none;
158
- cursor: not-allowed;
159
- }
160
- }
161
- }
162
-
163
- .page__content + .pagination,
164
- .page__meta + .pagination,
165
- .page__share + .pagination,
166
- .page__comments + .pagination {
167
- margin-top: 2em;
168
- padding-top: 2em;
169
- border-top: 1px solid $border-color;
170
- }
171
-
172
-
173
- /*
174
- Priority plus navigation
175
- ========================================================================== */
176
-
177
- .greedy-nav {
178
- position: relative;
179
- display: -webkit-box;
180
- display: flex;
181
- -webkit-box-align: center;
182
- align-items: center;
183
- background: $background-color;
184
-
185
- a {
186
- display: block;
187
- margin: 0 1rem;
188
- padding: 0.5rem 0;
189
- color: $masthead-link-color;
190
- text-decoration: none;
191
-
192
- &:hover {
193
- color: $masthead-link-color-hover;
194
- }
195
-
196
- &.site-title {
197
- margin-left: 0;
198
- }
199
- }
200
-
201
- button {
202
- padding: 0 0.5rem;
203
- align-self: stretch;
204
- border: 0;
205
- outline: none;
206
- color: #fff;
207
- background-color: $primary-color;
208
- cursor: pointer;
209
- }
210
-
211
- .visible-links {
212
- display: -webkit-box;
213
- display: flex;
214
- -webkit-box-pack: end;
215
- justify-content: flex-end;
216
- -webkit-box-flex: 1;
217
- flex: 1;
218
- padding-right: 2rem;
219
- overflow: hidden;
220
-
221
- li {
222
- -webkit-box-flex: 0;
223
- flex: none;
224
-
225
- &:last-child {
226
- a {
227
- margin-right: 0;
228
- }
229
- }
230
- }
231
-
232
- a {
233
- position: relative;
234
-
235
- &:before {
236
- content: "";
237
- position: absolute;
238
- left: 0;
239
- bottom: 0;
240
- height: 4px;
241
- background: mix(#fff, $primary-color, 50%);
242
- width: 100%;
243
- -webkit-transition: $global-transition;
244
- transition: $global-transition;
245
- -webkit-transform: scaleX(0) translate3d(0, 0 , 0);
246
- transform: scaleX(0) translate3d(0, 0 , 0); /* hide*/
247
- }
248
-
249
- &:hover:before {
250
- -webkit-transform: scaleX(1);
251
- -ms-transform: scaleX(1);
252
- transform: scaleX(1); /* reveal*/
253
- }
254
- }
255
- }
256
-
257
- .hidden-links {
258
- position: absolute;
259
- top: 100%;
260
- right: 0;
261
- margin-top: 15px;
262
- padding: 5px;
263
- border: 1px solid $border-color;
264
- border-radius: $border-radius;
265
- background: #fff;
266
- box-shadow: 0 2px 4px 0 rgba(#000, 0.16), 0 2px 10px 0 rgba(#000, 0.12);
267
-
268
- &.hidden {
269
- display: none;
270
- }
271
-
272
- a {
273
- margin: 0;
274
- padding: 10px 20px;
275
- font-size: $type-size-5;
276
-
277
- &:hover {
278
- color: $masthead-link-color-hover;
279
- background: $navicon-link-color-hover;
280
- }
281
- }
282
-
283
- &:before {
284
- content: "";
285
- position: absolute;
286
- top: -11px;
287
- right: 10px;
288
- width: 0;
289
- border-style: solid;
290
- border-width: 0 10px 10px;
291
- border-color: $border-color transparent;
292
- display: block;
293
- z-index: 0;
294
- }
295
-
296
- &:after {
297
- content: "";
298
- position: absolute;
299
- top: -10px;
300
- right: 10px;
301
- width: 0;
302
- border-style: solid;
303
- border-width: 0 10px 10px;
304
- border-color: #fff transparent;
305
- display: block;
306
- z-index: 1;
307
- }
308
-
309
- li {
310
- display: block;
311
- border-bottom: 1px solid $border-color;
312
-
313
- &:last-child {
314
- border-bottom: none;
315
- }
316
- }
317
- }
318
- }
319
-
320
-
321
- /*
322
- Navigation list
323
- ========================================================================== */
324
-
325
- .nav__list {
326
- margin-bottom: 1.5em;
327
-
328
- input[type="checkbox"],
329
- label {
330
- display: none;
331
- }
332
-
333
- @include breakpoint(max-width ($large - 1px)) {
334
-
335
- label {
336
- position: relative;
337
- display: inline-block;
338
- padding: 0.5em 2.5em 0.5em 1em;
339
- color: $gray;
340
- font-size: $type-size-6;
341
- font-weight: bold;
342
- border: 1px solid $light-gray;
343
- border-radius: $border-radius;
344
- z-index: 20;
345
- -webkit-transition: 0.2s ease-out;
346
- transition: 0.2s ease-out;
347
- cursor: pointer;
348
-
349
- &:before,
350
- &:after {
351
- content: '';
352
- position: absolute;
353
- right: 1em;
354
- top: 1.25em;
355
- width: 0.75em;
356
- height: 0.125em;
357
- line-height: 1;
358
- background-color: $gray;
359
- -webkit-transition: 0.2s ease-out;
360
- transition: 0.2s ease-out;
361
- }
362
-
363
- &:after {
364
- -webkit-transform: rotate(90deg);
365
- -ms-transform: rotate(90deg);
366
- transform: rotate(90deg);
367
- }
368
-
369
- &:hover {
370
- color: #fff;
371
- border-color: $gray;
372
- background-color: mix(white, #000, 20%);
373
-
374
- &:before,
375
- &:after {
376
- background-color: #fff;
377
- }
378
- }
379
- }
380
-
381
- /* selected*/
382
- input:checked + label {
383
- color: white;
384
- background-color: mix(white, #000, 20%);
385
-
386
- &:before,
387
- &:after {
388
- background-color: #fff;
389
- }
390
- }
391
-
392
- /* on hover show expand*/
393
- label:hover:after {
394
- -webkit-transform: rotate(90deg);
395
- -ms-transform: rotate(90deg);
396
- transform: rotate(90deg);
397
- }
398
-
399
- input:checked + label:hover:after {
400
- -webkit-transform: rotate(0);
401
- -ms-transform: rotate(0);
402
- transform: rotate(0);
403
- }
404
-
405
- ul {
406
- margin-bottom: 1em;
407
- }
408
-
409
- a {
410
- display: block;
411
- padding: 0.25em 0;
412
-
413
- @include breakpoint($large) {
414
- padding-top: 0.125em;
415
- padding-bottom: 0.125em;
416
- }
417
-
418
- &:hover {
419
- text-decoration: underline;
420
- }
421
- }
422
- }
423
- }
424
-
425
- .nav__list .nav__items {
426
- margin: 0;
427
- font-size: 1.25rem;
428
-
429
- a {
430
- color: inherit;
431
- }
432
-
433
- .active {
434
- margin-left: -0.5em;
435
- padding-left: 0.5em;
436
- padding-right: 0.5em;
437
- font-weight: bold;
438
- }
439
-
440
- @include breakpoint(max-width ($large - 1px)) {
441
- position: relative;
442
- max-height: 0;
443
- opacity: 0%;
444
- overflow: hidden;
445
- z-index: 10;
446
- -webkit-transition: 0.3s ease-in-out;
447
- transition: 0.3s ease-in-out;
448
- -webkit-transform: translate(0, 10%);
449
- -ms-transform: translate(0, 10%);
450
- transform: translate(0, 10%);
451
- }
452
- }
453
-
454
- @include breakpoint(max-width ($large - 1px)) {
455
- .nav__list input:checked ~ .nav__items {
456
- -webkit-transition: 0.5s ease-in-out;
457
- transition: 0.5s ease-in-out;
458
- max-height: 9999px; /* exaggerate max-height to accommodate tall lists*/
459
- overflow: visible;
460
- opacity: 1;
461
- margin-top: 1em;
462
- -webkit-transform: translate(0, 0);
463
- -ms-transform: translate(0, 0);
464
- transform: translate(0, 0);
465
- }
466
- }
467
-
468
- .nav__title {
469
- margin: 0;
470
- padding: 0.5rem 1rem;
471
- font-family: $sans-serif-narrow;
472
- font-size: $type-size-5;
473
- font-weight: bold;
474
- }
475
-
476
- .nav__sub-title {
477
- display: block;
478
- margin: 0.5rem 0;
479
- padding: 0.5rem 0;
480
- font-family: $sans-serif-narrow;
481
- font-size: $type-size-6;
482
- font-weight: bold;
483
- text-transform: uppercase;
484
- border-bottom: 1px solid $border-color;
485
- }
486
-
487
-
488
- /*
489
- Table of contents navigation
490
- ========================================================================== */
491
-
492
- .toc {
493
- font-family: $sans-serif-narrow;
494
- color: $gray;
495
- text-transform: uppercase;
496
- letter-spacing: 1px;
497
- background-color: #fff;
498
- border: 1px solid $border-color;
499
- border-radius: $border-radius;
500
- box-shadow: $box-shadow;
501
-
502
- .nav__title {
503
- color: #fff;
504
- font-size: $type-size-6;
505
- background: $primary-color;
506
- border-top-left-radius: $border-radius;
507
- border-top-right-radius: $border-radius;
508
- }
509
- }
510
-
511
- .toc__menu {
512
- margin: 0;
513
- padding: 0;
514
- width: 100%;
515
- list-style: none;
516
- font-size: 0.8rem;
517
-
518
- a {
519
- display: block;
520
- padding: 0.5rem 1rem;
521
- color: $gray;
522
- font-size: $type-size-7;
523
- font-weight: bold;
524
- line-height: 1.5;
525
- border-bottom: 1px solid $border-color;
526
-
527
- &:hover {
528
- color: #000;
529
- background: $lighter-gray;
530
- }
531
- }
532
-
533
- > li:last-child {
534
- a {
535
- border-bottom: none;
536
- }
537
- }
538
-
539
- li ul > li a {
540
- padding-left: 1.75rem;
541
- font-weight: normal;
542
- }
543
-
544
- /* hide sub sub links on small screens*/
545
- li > ul li {
546
- display: none;
547
-
548
- @include breakpoint($medium) {
549
- display: block;
550
- }
551
- }
552
- }
1
+ /* ==========================================================================
2
+ NAVIGATION
3
+ ========================================================================== */
4
+
5
+ /*
6
+ Breadcrumb navigation links
7
+ ========================================================================== */
8
+
9
+ .breadcrumbs {
10
+ @include clearfix;
11
+ margin: 0 auto;
12
+ max-width: 100%;
13
+ padding-left: 2em;
14
+ padding-right: 2em;
15
+ font-family: $sans-serif;
16
+ -webkit-animation: $intro-transition;
17
+ animation: $intro-transition;
18
+ -webkit-animation-delay: 0.30s;
19
+ animation-delay: 0.30s;
20
+
21
+ @include breakpoint($large) {
22
+ padding-left: 1em;
23
+ padding-right: 1em;
24
+ }
25
+
26
+ @include breakpoint($x-large) {
27
+ max-width: $x-large;
28
+ }
29
+
30
+ ol {
31
+ padding: 0;
32
+ list-style: none;
33
+ font-size: $type-size-6;
34
+
35
+ @include breakpoint($large) {
36
+ float: right;
37
+ width: span(10 of 12);
38
+ }
39
+
40
+ @include breakpoint($x-large) {
41
+ padding-left: gutter(0.5 of 12);
42
+ }
43
+ }
44
+
45
+ li {
46
+ display: inline;
47
+ }
48
+
49
+ .current {
50
+ font-weight: bold;
51
+ }
52
+ }
53
+
54
+
55
+ /*
56
+ Post pagination navigation links
57
+ ========================================================================== */
58
+
59
+ .pagination {
60
+ @include clearfix();
61
+ float: left;
62
+ margin-top: 1em;
63
+ padding-top: 1em;
64
+ width: 100%;
65
+
66
+ ul {
67
+ margin: 0;
68
+ padding: 0;
69
+ list-style-type: none;
70
+ font-family: $sans-serif;
71
+ }
72
+
73
+ li {
74
+ display: block;
75
+ float: left;
76
+ margin-left: -1px;
77
+
78
+ a {
79
+ display: block;
80
+ margin-bottom: 0.25em;
81
+ padding: 0.5em 1em;
82
+ font-family: $sans-serif;
83
+ font-size: 14px;
84
+ font-weight: bold;
85
+ line-height: 1.5;
86
+ text-align: center;
87
+ text-decoration: none;
88
+ color: mix(#fff, $gray, 25%);
89
+ border: 1px solid $light-gray;
90
+ border-radius: 0;
91
+
92
+ &:hover {
93
+ color: $link-color-hover;
94
+ }
95
+
96
+ &.current {
97
+ color: #fff;
98
+ background: $primary-color;
99
+ }
100
+
101
+ &.disabled {
102
+ color: mix(#fff, $gray, 75%);
103
+ pointer-events: none;
104
+ cursor: not-allowed;
105
+ }
106
+ }
107
+
108
+ &:first-child {
109
+ margin-left: 0;
110
+
111
+ a {
112
+ border-top-left-radius: $border-radius;
113
+ border-bottom-left-radius: $border-radius;
114
+ }
115
+ }
116
+
117
+ &:last-child {
118
+ a {
119
+ border-top-right-radius: $border-radius;
120
+ border-bottom-right-radius: $border-radius;
121
+ }
122
+ }
123
+ }
124
+
125
+ /* next/previous buttons */
126
+ &--pager {
127
+ display: block;
128
+ padding: 1em 2em;
129
+ float: left;
130
+ width: 50%;
131
+ font-family: $sans-serif;
132
+ font-size: $type-size-5;
133
+ font-weight: bold;
134
+ text-align: center;
135
+ text-decoration: none;
136
+ color: $link-color;
137
+ border: 1px solid $light-gray;
138
+ border-radius: $border-radius;
139
+
140
+ &:hover {
141
+ color: $link-color-hover;
142
+ }
143
+
144
+ &:first-child {
145
+ border-top-right-radius: 0;
146
+ border-bottom-right-radius: 0;
147
+ }
148
+
149
+ &:last-child {
150
+ margin-left: -1px;
151
+ border-top-left-radius: 0;
152
+ border-bottom-left-radius: 0;
153
+ }
154
+
155
+ &.disabled {
156
+ color: mix(#fff, $gray, 75%);
157
+ pointer-events: none;
158
+ cursor: not-allowed;
159
+ }
160
+ }
161
+ }
162
+
163
+ .page__content + .pagination,
164
+ .page__meta + .pagination,
165
+ .page__share + .pagination,
166
+ .page__comments + .pagination {
167
+ margin-top: 2em;
168
+ padding-top: 2em;
169
+ border-top: 1px solid $border-color;
170
+ }
171
+
172
+
173
+ /*
174
+ Priority plus navigation
175
+ ========================================================================== */
176
+
177
+ .greedy-nav {
178
+ position: relative;
179
+ display: -webkit-box;
180
+ display: flex;
181
+ -webkit-box-align: center;
182
+ align-items: center;
183
+ background: $background-color;
184
+
185
+ a {
186
+ display: block;
187
+ margin: 0 1rem;
188
+ padding: 0.5rem 0;
189
+ color: $masthead-link-color;
190
+ text-decoration: none;
191
+
192
+ &:hover {
193
+ color: $masthead-link-color-hover;
194
+ }
195
+
196
+ &.site-title {
197
+ margin-left: 0;
198
+ }
199
+ }
200
+
201
+ button {
202
+ padding: 0 0.5rem;
203
+ align-self: stretch;
204
+ border: 0;
205
+ outline: none;
206
+ color: #fff;
207
+ background-color: $primary-color;
208
+ cursor: pointer;
209
+ }
210
+
211
+ .visible-links {
212
+ display: -webkit-box;
213
+ display: flex;
214
+ -webkit-box-pack: end;
215
+ justify-content: flex-end;
216
+ -webkit-box-flex: 1;
217
+ flex: 1;
218
+ padding-right: 2rem;
219
+ overflow: hidden;
220
+
221
+ li {
222
+ -webkit-box-flex: 0;
223
+ flex: none;
224
+
225
+ &:last-child {
226
+ a {
227
+ margin-right: 0;
228
+ }
229
+ }
230
+ }
231
+
232
+ a {
233
+ position: relative;
234
+
235
+ &:before {
236
+ content: "";
237
+ position: absolute;
238
+ left: 0;
239
+ bottom: 0;
240
+ height: 4px;
241
+ background: mix(#fff, $primary-color, 50%);
242
+ width: 100%;
243
+ -webkit-transition: $global-transition;
244
+ transition: $global-transition;
245
+ -webkit-transform: scaleX(0) translate3d(0, 0 , 0);
246
+ transform: scaleX(0) translate3d(0, 0 , 0); /* hide*/
247
+ }
248
+
249
+ &:hover:before {
250
+ -webkit-transform: scaleX(1);
251
+ -ms-transform: scaleX(1);
252
+ transform: scaleX(1); /* reveal*/
253
+ }
254
+ }
255
+ }
256
+
257
+ .hidden-links {
258
+ position: absolute;
259
+ top: 100%;
260
+ right: 0;
261
+ margin-top: 15px;
262
+ padding: 5px;
263
+ border: 1px solid $border-color;
264
+ border-radius: $border-radius;
265
+ background: #fff;
266
+ box-shadow: 0 2px 4px 0 rgba(#000, 0.16), 0 2px 10px 0 rgba(#000, 0.12);
267
+
268
+ &.hidden {
269
+ display: none;
270
+ }
271
+
272
+ a {
273
+ margin: 0;
274
+ padding: 10px 20px;
275
+ font-size: $type-size-5;
276
+
277
+ &:hover {
278
+ color: $masthead-link-color-hover;
279
+ background: $navicon-link-color-hover;
280
+ }
281
+ }
282
+
283
+ &:before {
284
+ content: "";
285
+ position: absolute;
286
+ top: -11px;
287
+ right: 10px;
288
+ width: 0;
289
+ border-style: solid;
290
+ border-width: 0 10px 10px;
291
+ border-color: $border-color transparent;
292
+ display: block;
293
+ z-index: 0;
294
+ }
295
+
296
+ &:after {
297
+ content: "";
298
+ position: absolute;
299
+ top: -10px;
300
+ right: 10px;
301
+ width: 0;
302
+ border-style: solid;
303
+ border-width: 0 10px 10px;
304
+ border-color: #fff transparent;
305
+ display: block;
306
+ z-index: 1;
307
+ }
308
+
309
+ li {
310
+ display: block;
311
+ border-bottom: 1px solid $border-color;
312
+
313
+ &:last-child {
314
+ border-bottom: none;
315
+ }
316
+ }
317
+ }
318
+ }
319
+
320
+
321
+ /*
322
+ Navigation list
323
+ ========================================================================== */
324
+
325
+ .nav__list {
326
+ margin-bottom: 1.5em;
327
+
328
+ input[type="checkbox"],
329
+ label {
330
+ display: none;
331
+ }
332
+
333
+ @include breakpoint(max-width ($large - 1px)) {
334
+
335
+ label {
336
+ position: relative;
337
+ display: inline-block;
338
+ padding: 0.5em 2.5em 0.5em 1em;
339
+ color: $gray;
340
+ font-size: $type-size-6;
341
+ font-weight: bold;
342
+ border: 1px solid $light-gray;
343
+ border-radius: $border-radius;
344
+ z-index: 20;
345
+ -webkit-transition: 0.2s ease-out;
346
+ transition: 0.2s ease-out;
347
+ cursor: pointer;
348
+
349
+ &:before,
350
+ &:after {
351
+ content: '';
352
+ position: absolute;
353
+ right: 1em;
354
+ top: 1.25em;
355
+ width: 0.75em;
356
+ height: 0.125em;
357
+ line-height: 1;
358
+ background-color: $gray;
359
+ -webkit-transition: 0.2s ease-out;
360
+ transition: 0.2s ease-out;
361
+ }
362
+
363
+ &:after {
364
+ -webkit-transform: rotate(90deg);
365
+ -ms-transform: rotate(90deg);
366
+ transform: rotate(90deg);
367
+ }
368
+
369
+ &:hover {
370
+ color: #fff;
371
+ border-color: $gray;
372
+ background-color: mix(white, #000, 20%);
373
+
374
+ &:before,
375
+ &:after {
376
+ background-color: #fff;
377
+ }
378
+ }
379
+ }
380
+
381
+ /* selected*/
382
+ input:checked + label {
383
+ color: white;
384
+ background-color: mix(white, #000, 20%);
385
+
386
+ &:before,
387
+ &:after {
388
+ background-color: #fff;
389
+ }
390
+ }
391
+
392
+ /* on hover show expand*/
393
+ label:hover:after {
394
+ -webkit-transform: rotate(90deg);
395
+ -ms-transform: rotate(90deg);
396
+ transform: rotate(90deg);
397
+ }
398
+
399
+ input:checked + label:hover:after {
400
+ -webkit-transform: rotate(0);
401
+ -ms-transform: rotate(0);
402
+ transform: rotate(0);
403
+ }
404
+
405
+ ul {
406
+ margin-bottom: 1em;
407
+ }
408
+
409
+ a {
410
+ display: block;
411
+ padding: 0.25em 0;
412
+
413
+ @include breakpoint($large) {
414
+ padding-top: 0.125em;
415
+ padding-bottom: 0.125em;
416
+ }
417
+
418
+ &:hover {
419
+ text-decoration: underline;
420
+ }
421
+ }
422
+ }
423
+ }
424
+
425
+ .nav__list .nav__items {
426
+ margin: 0;
427
+ font-size: 1.25rem;
428
+
429
+ a {
430
+ color: inherit;
431
+ }
432
+
433
+ .active {
434
+ margin-left: -0.5em;
435
+ padding-left: 0.5em;
436
+ padding-right: 0.5em;
437
+ font-weight: bold;
438
+ }
439
+
440
+ @include breakpoint(max-width ($large - 1px)) {
441
+ position: relative;
442
+ max-height: 0;
443
+ opacity: 0%;
444
+ overflow: hidden;
445
+ z-index: 10;
446
+ -webkit-transition: 0.3s ease-in-out;
447
+ transition: 0.3s ease-in-out;
448
+ -webkit-transform: translate(0, 10%);
449
+ -ms-transform: translate(0, 10%);
450
+ transform: translate(0, 10%);
451
+ }
452
+ }
453
+
454
+ @include breakpoint(max-width ($large - 1px)) {
455
+ .nav__list input:checked ~ .nav__items {
456
+ -webkit-transition: 0.5s ease-in-out;
457
+ transition: 0.5s ease-in-out;
458
+ max-height: 9999px; /* exaggerate max-height to accommodate tall lists*/
459
+ overflow: visible;
460
+ opacity: 1;
461
+ margin-top: 1em;
462
+ -webkit-transform: translate(0, 0);
463
+ -ms-transform: translate(0, 0);
464
+ transform: translate(0, 0);
465
+ }
466
+ }
467
+
468
+ .nav__title {
469
+ margin: 0;
470
+ padding: 0.5rem 1rem;
471
+ font-family: $sans-serif-narrow;
472
+ font-size: $type-size-5;
473
+ font-weight: bold;
474
+ }
475
+
476
+ .nav__sub-title {
477
+ display: block;
478
+ margin: 0.5rem 0;
479
+ padding: 0.5rem 0;
480
+ font-family: $sans-serif-narrow;
481
+ font-size: $type-size-6;
482
+ font-weight: bold;
483
+ text-transform: uppercase;
484
+ border-bottom: 1px solid $border-color;
485
+ }
486
+
487
+
488
+ /*
489
+ Table of contents navigation
490
+ ========================================================================== */
491
+
492
+ .toc {
493
+ font-family: $sans-serif-narrow;
494
+ color: $gray;
495
+ text-transform: uppercase;
496
+ letter-spacing: 1px;
497
+ background-color: #fff;
498
+ border: 1px solid $border-color;
499
+ border-radius: $border-radius;
500
+ box-shadow: $box-shadow;
501
+
502
+ .nav__title {
503
+ color: #fff;
504
+ font-size: $type-size-6;
505
+ background: $primary-color;
506
+ border-top-left-radius: $border-radius;
507
+ border-top-right-radius: $border-radius;
508
+ }
509
+ }
510
+
511
+ .toc__menu {
512
+ margin: 0;
513
+ padding: 0;
514
+ width: 100%;
515
+ list-style: none;
516
+ font-size: 0.8rem;
517
+
518
+ a {
519
+ display: block;
520
+ padding: 0.5rem 1rem;
521
+ color: $gray;
522
+ font-size: $type-size-7;
523
+ font-weight: bold;
524
+ line-height: 1.5;
525
+ border-bottom: 1px solid $border-color;
526
+
527
+ &:hover {
528
+ color: #000;
529
+ background: $lighter-gray;
530
+ }
531
+ }
532
+
533
+ > li:last-child {
534
+ a {
535
+ border-bottom: none;
536
+ }
537
+ }
538
+
539
+ li ul > li a {
540
+ padding-left: 1.75rem;
541
+ font-weight: normal;
542
+ }
543
+
544
+ /* hide sub sub links on small screens*/
545
+ li > ul li {
546
+ display: none;
547
+
548
+ @include breakpoint($medium) {
549
+ display: block;
550
+ }
551
+ }
552
+ }