GPG Key ID:
24116ED85666780A
9 changed files with 137 additions and 551 deletions
@ -1,86 +1,105 @@
|
||||
{% capture headingsWorkspace %} |
||||
{% comment %} |
||||
Version 1.0.0 |
||||
https://github.com/allejo/jekyll-anchor-headings |
||||
|
||||
"Be the pull request you wish to see in the world." ~Ben Balter |
||||
|
||||
Usage: |
||||
{% include anchor_headings.html html=content %} |
||||
|
||||
Parameters: |
||||
* html (string) - the HTML of compiled markdown generated by kramdown in Jekyll |
||||
|
||||
Optional Parameters: |
||||
* beforeHeading (bool) : false - Set to true if the anchor should be placed _before_ the heading's content |
||||
* anchorBody (string) : '' - The content that will be placed inside the anchor; the `%heading%` placeholder is available |
||||
* anchorClass (string) : '' - The class(es) that will be used for each anchor. Separate multiple classes with a space |
||||
* anchorTitle (string) : '' - The `title` attribute that will be used for anchors |
||||
* h_min (int) : 1 - The minimum header level to build an anchor for; any header lower than this value will be ignored |
||||
* h_max (int) : 6 - The maximum header level to build an anchor for; any header greater than this value will be ignored |
||||
|
||||
Output: |
||||
The original HTML with the addition of anchors inside of all of the h1-h6 headings. |
||||
{% endcomment %} |
||||
|
||||
{% assign minHeader = include.h_min | default: 1 %} |
||||
{% assign maxHeader = include.h_max | default: 6 %} |
||||
{% assign beforeHeading = include.beforeHeading %} |
||||
{% assign nodes = include.html | split: '<h' %} |
||||
|
||||
{% capture edited_headings %}{% endcapture %} |
||||
|
||||
{% for node in nodes %} |
||||
{% if node == "" %} |
||||
{% continue %} |
||||
{% endif %} |
||||
|
||||
{% assign headerLevel = node | replace: '"', '' | slice: 0, 1 | times: 1 %} |
||||
|
||||
<!-- If the node doesn't have a header, then it's content before the first heading; don't discard it --> |
||||
{% if headerLevel < 1 or headerLevel > 6 %} |
||||
{% capture edited_headings %}{{ edited_headings }}{{ node }}{% endcapture %} |
||||
{% continue %} |
||||
{% endif %} |
||||
|
||||
{% assign _workspace = node | split: '</h' %} |
||||
{% assign _idWorkspace = _workspace[0] | split: 'id="' %} |
||||
{% assign _idWorkspace = _idWorkspace[1] | split: '"' %} |
||||
{% assign html_id = _idWorkspace[0] %} |
||||
|
||||
{% capture _hAttrToStrip %}{{ _workspace[0] | split: '>' | first }}>{% endcapture %} |
||||
{% assign header = _workspace[0] | replace: _hAttrToStrip, '' %} |
||||
|
||||
<!-- Build the anchor to inject for our heading --> |
||||
{% capture anchor %}{% endcapture %} |
||||
|
||||
{% if html_id and headerLevel >= minHeader and headerLevel <= maxHeader %} |
||||
{% capture anchor %}href="#{{ html_id}}"{% endcapture %} |
||||
|
||||
{% if include.anchorClass %} |
||||
{% capture anchor %}{{ anchor }} class="{{ include.anchorClass }}"{% endcapture %} |
||||
{% endif %} |
||||
|
||||
{% if include.anchorTitle %} |
||||
{% capture anchor %}{{ anchor }} title="{{ include.anchorTitle | replace: '%heading%', header }}"{% endcapture %} |
||||
{% endif %} |
||||
|
||||
{% capture anchor %}<a {{ anchor }}>{{ include.anchorBody | replace: '%heading%', header | default: '' | raw }}</a>{% endcapture %} |
||||
|
||||
{% if beforeHeading %} |
||||
{% capture anchor %}{{ anchor }} {% endcapture %} |
||||
{% else %} |
||||
{% capture anchor %} {{ anchor }}{% endcapture %} |
||||
{% endif %} |
||||
{% endif %} |
||||
|
||||
<!-- The placement of our anchor, before the heading content or after --> |
||||
{% comment %} |
||||
Version 1.0.4 |
||||
https://github.com/allejo/jekyll-anchor-headings |
||||
|
||||
"Be the pull request you wish to see in the world." ~Ben Balter |
||||
|
||||
Usage: |
||||
{% include anchor_headings.html html=content %} |
||||
|
||||
Parameters: |
||||
* html (string) - the HTML of compiled markdown generated by kramdown in Jekyll |
||||
|
||||
Optional Parameters: |
||||
* beforeHeading (bool) : false - Set to true if the anchor should be placed _before_ the heading's content |
||||
* anchorAttrs (string) : '' - Any custom HTML attributes that will be added to the `<a>` tag; you may NOT use `href`, `class` or `title` |
||||
* anchorBody (string) : '' - The content that will be placed inside the anchor; the `%heading%` placeholder is available |
||||
* anchorClass (string) : '' - The class(es) that will be used for each anchor. Separate multiple classes with a space |
||||
* anchorTitle (string) : '' - The `title` attribute that will be used for anchors |
||||
* h_min (int) : 1 - The minimum header level to build an anchor for; any header lower than this value will be ignored |
||||
* h_max (int) : 6 - The maximum header level to build an anchor for; any header greater than this value will be ignored |
||||
* bodyPrefix (string) : '' - Anything that should be inserted inside of the heading tag _before_ its anchor and content |
||||
* bodySuffix (string) : '' - Anything that should be inserted inside of the heading tag _after_ its anchor and content |
||||
|
||||
Output: |
||||
The original HTML with the addition of anchors inside of all of the h1-h6 headings. |
||||
{% endcomment %} |
||||
|
||||
{% assign minHeader = include.h_min | default: 1 %} |
||||
{% assign maxHeader = include.h_max | default: 6 %} |
||||
{% assign beforeHeading = include.beforeHeading %} |
||||
{% assign nodes = include.html | split: '<h' %} |
||||
|
||||
{% capture edited_headings %}{% endcapture %} |
||||
|
||||
{% for _node in nodes %} |
||||
{% capture node %}{{ _node | strip }}{% endcapture %} |
||||
|
||||
{% if node == "" %} |
||||
{% continue %} |
||||
{% endif %} |
||||
|
||||
{% assign nextChar = node | replace: '"', '' | strip | slice: 0, 1 %} |
||||
{% assign headerLevel = nextChar | times: 1 %} |
||||
|
||||
<!-- If the level is cast to 0, it means it's not a h1-h6 tag, so let's try to fix it --> |
||||
{% if headerLevel == 0 %} |
||||
{% if nextChar != '<' and nextChar != '' %} |
||||
{% capture node %}<h{{ node }}{% endcapture %} |
||||
{% endif %} |
||||
|
||||
{% capture edited_headings %}{{ edited_headings }}{{ node }}{% endcapture %} |
||||
{% continue %} |
||||
{% endif %} |
||||
|
||||
{% assign _workspace = node | split: '</h' %} |
||||
{% assign _idWorkspace = _workspace[0] | split: 'id="' %} |
||||
{% assign _idWorkspace = _idWorkspace[1] | split: '"' %} |
||||
{% assign html_id = _idWorkspace[0] %} |
||||
|
||||
{% capture _hAttrToStrip %}{{ _workspace[0] | split: '>' | first }}>{% endcapture %} |
||||
{% assign header = _workspace[0] | replace: _hAttrToStrip, '' %} |
||||
|
||||
<!-- Build the anchor to inject for our heading --> |
||||
{% capture anchor %}{% endcapture %} |
||||
|
||||
{% if html_id and headerLevel >= minHeader and headerLevel <= maxHeader %} |
||||
{% capture anchor %}href="#{{ html_id }}"{% endcapture %} |
||||
|
||||
{% if include.anchorClass %} |
||||
{% capture anchor %}{{ anchor }} class="{{ include.anchorClass }}"{% endcapture %} |
||||
{% endif %} |
||||
|
||||
{% if include.anchorTitle %} |
||||
{% capture anchor %}{{ anchor }} title="{{ include.anchorTitle | replace: '%heading%', header }}"{% endcapture %} |
||||
{% endif %} |
||||
|
||||
{% if include.anchorAttrs %} |
||||
{% capture anchor %}{{ anchor }} {{ include.anchorAttrs }}{% endcapture %} |
||||
{% endif %} |
||||
|
||||
{% capture anchor %}<a {{ anchor }}>{{ include.anchorBody | replace: '%heading%', header | default: '' }}</a>{% endcapture %} |
||||
|
||||
<!-- In order to prevent adding extra space after a heading, we'll let the 'anchor' value contain it --> |
||||
{% if beforeHeading %} |
||||
{% capture anchor %}{{ anchor }} {% endcapture %} |
||||
{% else %} |
||||
{% capture anchor %} {{ anchor }}{% endcapture %} |
||||
{% endif %} |
||||
{% endif %} |
||||
|
||||
{% capture new_heading %} |
||||
<h{{ _hAttrToStrip }} |
||||
{{ include.bodyPrefix }} |
||||
{% if beforeHeading %} |
||||
{% capture _current %}<h{{ _hAttrToStrip | raw }}{{ anchor }}{% endcapture %} |
||||
{% capture edited_headings %}{{ edited_headings }}{{ node | replace: _hAttrToStrip, _current | raw }}{% endcapture %} |
||||
{{ anchor }}{{ header }} |
||||
{% else %} |
||||
{% capture _current %}<h{{ _workspace | first }}{{ anchor }}</h{{ _workspace | last }}{% endcapture %} |
||||
{% capture edited_headings %}{{ edited_headings }}{{ _current }}{% endcapture %} |
||||
{{ header }}{{ anchor }} |
||||
{% endif %} |
||||
{% endfor %} |
||||
{{ include.bodySuffix }} |
||||
</h{{ _workspace | last }} |
||||
{% endcapture %} |
||||
{% capture edited_headings %}{{ edited_headings }}{{ new_heading }}{% endcapture %} |
||||
{% endfor %} |
||||
{% endcapture %}{% assign headingsWorkspace = '' %}{{ edited_headings | strip }} |
||||
@ -1,457 +1,11 @@
|
||||
/* For mobile phones */ |
||||
@media only screen and (max-width: 700px) { |
||||
body { |
||||
margin-left: 0.40625em; |
||||
margin-right: 0.40625em; |
||||
} |
||||
|
||||
.post { |
||||
pre { |
||||
font-size:0.8125em; |
||||
line-height: 2em; |
||||
|
||||
padding-left: 0.8125em; |
||||
padding-right: 0.8125em; |
||||
} |
||||
} |
||||
p code { |
||||
font-size:0.8125em; |
||||
line-height: 2em; |
||||
|
||||
padding-left: 0.40625em; |
||||
padding-right: 0.40625em; |
||||
} |
||||
} |
||||
|
||||
/* For desktops */ |
||||
@media only screen and (min-width: 700px) { |
||||
body { |
||||
margin-left: 5%; |
||||
margin-right: 5%; |
||||
@media only screen and (max-width: 1375px) { |
||||
margin-left: 10%; |
||||
margin-right: 10%; |
||||
} |
||||
@media only screen and (min-width: 1920px) { |
||||
margin-left: 25%; |
||||
margin-right: 25%; |
||||
} |
||||
} |
||||
|
||||
.post { |
||||
pre { |
||||
font-size: 1.1375em; |
||||
line-height: 2em; |
||||
|
||||
padding-left: 1.625em; |
||||
padding-right: 1.625em; |
||||
} |
||||
} |
||||
p code { |
||||
font-size:1.1375em; |
||||
line-height: 2em; |
||||
|
||||
padding-left: 0.8125em; |
||||
padding-right: 0.8125em; |
||||
} |
||||
} |
||||
|
||||
body { |
||||
text-align: left; |
||||
text-rendering: optimizeLegibility; |
||||
background-color: #dadada; |
||||
line-height: 1.625em; |
||||
font-family: "Arial Black", Gadget, sans-serif; |
||||
font-size: 1.080625em; |
||||
word-spacing: 0em; |
||||
} |
||||
|
||||
p { |
||||
code { |
||||
font-weight: bold; |
||||
border: none; |
||||
border-radius: 0.8125em; |
||||
box-shadow: inset 0 0 0.8125em grey; |
||||
background-color: #e6e6e6; |
||||
white-space: pre-wrap; |
||||
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ |
||||
white-space: -pre-wrap; /* Opera 4-6 */ |
||||
white-space: -o-pre-wrap; /* Opera 7 */ |
||||
word-wrap: break-word; /* Internet Explorer 5.5+ */ |
||||
} |
||||
} |
||||
|
||||
a:hover { |
||||
transition: 0.2s; |
||||
} |
||||
|
||||
/* Use for abbreviations only. */ |
||||
abbr { |
||||
letter-spacing: 0.1em; |
||||
} |
||||
|
||||
blockquote { |
||||
font-size: 1.08625em; |
||||
line-height: 1.08625em; |
||||
font-family: "Comic Sans MS", cursive, serif; |
||||
background-color: #ffffff; |
||||
box-shadow: inset 0 0 0.40625em grey; |
||||
border-radius: 0.8125em; |
||||
padding-left: 1.625em; |
||||
padding-top: 0.8125em; |
||||
padding-bottom: 0.8125em; |
||||
margin: 0; |
||||
} |
||||
|
||||
h1 { |
||||
line-height: 1.625em; |
||||
margin-top: 0.40625em; |
||||
margin-bottom: 0.40625em; |
||||
} |
||||
|
||||
h2 { |
||||
line-height: 1.263157em; |
||||
margin-top: 1.263157em; |
||||
margin-bottom: 1.263157em; |
||||
} |
||||
|
||||
p { |
||||
text-indent: 0; |
||||
line-height: 1.625em; |
||||
margin-top: 1.625em; |
||||
margin-bottom: 1.625em; |
||||
} |
||||
|
||||
a { |
||||
text-decoration: underline; |
||||
text-decoration-color: #d9d9d9; |
||||
text-align: center; |
||||
color: #666666; |
||||
text-decoration: none; |
||||
} |
||||
|
||||
a:hover { |
||||
text-decoration: underline; |
||||
} |
||||
|
||||
ul { |
||||
list-style-type: circle; |
||||
} |
||||
|
||||
.post { |
||||
pre { |
||||
border: none; |
||||
border-radius: 1.625em; |
||||
box-shadow: inset 0 0 0.8125em grey; |
||||
background-color: #e6e6e6; |
||||
white-space: pre-wrap; |
||||
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ |
||||
white-space: -pre-wrap; /* Opera 4-6 */ |
||||
white-space: -o-pre-wrap; /* Opera 7 */ |
||||
word-wrap: break-word; /* Internet Explorer 5.5+ */ |
||||
} |
||||
} |
||||
|
||||
.post-list { |
||||
margin: 0; |
||||
padding: 0; |
||||
list-style-type: none; |
||||
-webkit-padding-start: 0; |
||||
} |
||||
|
||||
.post-list-metadata, .post-list-div, .post-list-excerpt { |
||||
display: block; |
||||
} |
||||
|
||||
.post-metadata, .page-metadata, .footer, .comment { |
||||
box-shadow: inset 0 0 0.40625em grey; |
||||
background-color: #ffffff; |
||||
} |
||||
|
||||
.post-metadata, .page-metadata, .footer, .comment, .index .post-list-metadata { |
||||
border-radius: 1.625em; |
||||
padding-left: 1.625em; |
||||
padding-bottom: 0.40625em; |
||||
} |
||||
|
||||
.post-metadata, .page-metadata, .footer, .comment, .comment-content, .index .post-list-metadata { |
||||
margin-bottom: 1.625em; |
||||
} |
||||
|
||||
.page-metadata, .footer, .comment, .index .post-list-metadata { |
||||
padding-top: 0.40625em; |
||||
} |
||||
|
||||
.post-metadata, .page-metadata, .footer, .comment, .index .post-list-metadata { |
||||
padding-right: 1.625em; |
||||
} |
||||
|
||||
|
||||
.top, .page-navigation, .tag-list { |
||||
ul { |
||||
margin: 0; |
||||
padding: 0; |
||||
overflow: hidden; |
||||
} |
||||
|
||||
li { |
||||
display: block; |
||||
float: left; |
||||
} |
||||
|
||||
a { |
||||
text-decoration: none; |
||||
} |
||||
} |
||||
|
||||
.badges { |
||||
ul { |
||||
margin-top: 0.203125em; |
||||
margin-bottom: 0.203125em; |
||||
margin-left: 0em; |
||||
padding: 0; |
||||
overflow: hidden; |
||||
display: flex; |
||||
} |
||||
|
||||
li { |
||||
display: block; |
||||
float: left; |
||||
margin-left: 0.203125em; |
||||
} |
||||
|
||||
img { |
||||
padding: 0; |
||||
margin: 0; |
||||
} |
||||
} |
||||
|
||||
.top, .page-navigation { |
||||
ul { |
||||
font-size: 0.8125em; |
||||
margin-bottom: 1.625em; |
||||
background-color: #666666; |
||||
border-radius: 0.8125em; |
||||
} |
||||
|
||||
li { |
||||
border-right: 0.05em solid #ffffff; |
||||
} |
||||
|
||||
a { |
||||
display: block; |
||||
color: #ffffff; |
||||
text-align: center; |
||||
padding: 0.8125em 0.8125em; |
||||
} |
||||
|
||||
li a:hover { |
||||
background-color: #000000; |
||||
} |
||||
|
||||
.rss { |
||||
border-left: 0.05em solid #ffffff; |
||||
border-right: none; |
||||
float:right |
||||
} |
||||
} |
||||
|
||||
.index { |
||||
.post-list-div { |
||||
margin-top: 0.8125em; |
||||
margin-bottom: 0.8125em; |
||||
} |
||||
|
||||
.post-list-date { |
||||
float: right; |
||||
} |
||||
|
||||
.post-list-excerpt { |
||||
font-family: serif; |
||||
font-size: 0.8125em; |
||||
} |
||||
|
||||
a { |
||||
text-decoration: none; |
||||
text-align: left; |
||||
color: #000000; |
||||
} |
||||
|
||||
.post-list-metadata { |
||||
background-color: #ffffff; |
||||
box-shadow: 0 0.203125em 0.203125em 0 grey, 0 0.203125em 0.203125em 0 grey; |
||||
} |
||||
|
||||
.post-list-metadata:hover { |
||||
background-color: #404040; |
||||
transition: 0.2s; |
||||
color: #ffffff; |
||||
} |
||||
} |
||||
|
||||
.tag-list { |
||||
ul { |
||||
margin-top: 0em; |
||||
margin-bottom: 0.40625em; |
||||
} |
||||
|
||||
li { |
||||
margin-top: 0.203125em; |
||||
margin-bottom: 0.40625em; |
||||
} |
||||
|
||||
a { |
||||
margin-top: 0em; |
||||
margin-left: 0.8125em; |
||||
padding: 0.40625em; |
||||
font-size: 0.8125em; |
||||
background-color: #ffffff; |
||||
border-radius: 0.8125em; |
||||
} |
||||
|
||||
li a:hover { |
||||
background-color: #404040; |
||||
color: #ffffff; |
||||
} |
||||
} |
||||
|
||||
.comment-content, .tag-list { |
||||
a { |
||||
box-shadow: 0 0.203125em 0.203125em 0 grey, 0 0.203125em 0.203125em 0 grey; |
||||
} |
||||
} |
||||
|
||||
.comment-content { |
||||
font-size: 0.8125em; |
||||
|
||||
a.odd { |
||||
background-color: #cccccc; |
||||
} |
||||
|
||||
a.even { |
||||
background-color: #e6e6e6; |
||||
} |
||||
|
||||
a:hover { |
||||
background-color: #f2f2f2; |
||||
} |
||||
|
||||
a { |
||||
display: block; |
||||
margin-top: 1.625em; |
||||
text-decoration: none; |
||||
text-decoration-color: #000000; |
||||
text-align: left; |
||||
border-radius: 0.8125em; |
||||
color: #000000; |
||||
} |
||||
|
||||
.text { |
||||
padding: 0.8125em; |
||||
} |
||||
|
||||
.hr { |
||||
border: 0.1015625em inset #808080; |
||||
color: #ffffff; |
||||
} |
||||
|
||||
.from { |
||||
overflow: hidden; |
||||
} |
||||
|
||||
.date { |
||||
font-style: italic; |
||||
} |
||||
} |
||||
|
||||
.footer { |
||||
font-size: 0.8125em; |
||||
} |
||||
|
||||
img { |
||||
max-width: 100%; |
||||
height: auto; |
||||
display: block; |
||||
margin-right: auto; |
||||
margin-left: auto; |
||||
margin-bottom: 0.8125em; |
||||
} |
||||
|
||||
.img img, .figure { |
||||
box-shadow: 0 0.203125em 0.203125em 0 grey, 0 0.203125em 0.203125em 0 grey; |
||||
border-radius: 0.8125em; |
||||
} |
||||
|
||||
.img img:hover { |
||||
opacity: 0.5; |
||||
transition: 0.2s; |
||||
} |
||||
|
||||
.figure:hover { |
||||
background-color: #404040; |
||||
transition: 0.2s; |
||||
img { |
||||
opacity: 0.75; |
||||
} |
||||
.text { |
||||
color: #ffffff; |
||||
} |
||||
} |
||||
|
||||
.figure { |
||||
display: auto; |
||||
margin-right: auto; |
||||
margin-left: auto; |
||||
justify-content: center; |
||||
background-color: #ffffff; |
||||
margin-bottom: 0.8125em; |
||||
img { |
||||
max-width: 100%; |
||||
height: auto; |
||||
display: block; |
||||
margin-right: auto; |
||||
margin-left: auto; |
||||
border-top-left-radius: 0.8125em; |
||||
border-top-right-radius: 0.8125em; |
||||
} |
||||
.text { |
||||
text-align: center; |
||||
font-size: 0.8125em; |
||||
font-style: italic; |
||||
} |
||||
a { |
||||
text-decoration: none; |
||||
color: #000000; |
||||
} |
||||
} |
||||
|
||||
/* Tables */ |
||||
table { |
||||
border-collapse: collapse; |
||||
} |
||||
|
||||
table, th, td { |
||||
border: 0.1015625em solid black; |
||||
} |
||||
|
||||
th, td { |
||||
padding: 0.40625em; |
||||
text-align: left; |
||||
} |
||||
|
||||
th { |
||||
background-color: #f2f2f2; |
||||
} |
||||
|
||||
tr:nth-child(even) { |
||||
background-color: #f2f2f2; |
||||
} |
||||
|
||||
.hAnchor { |
||||
opacity: 0.1; |
||||
filter: alpha(opacity=50); /* For IE8 and earlier */ |
||||
} |
||||
|
||||
.hAnchor:hover { |
||||
opacity: 1; |
||||
filter: alpha(opacity=100); /* For IE8 and earlier */ |
||||
} |
||||
|
||||
Loading…
Reference in new issue