mirror of
https://github.com/thangisme/notes.git
synced 2025-01-02 18:06:38 -05:00
Merge branch 'v0.2.7-release' into mathjax
This commit is contained in:
Patrick Marsceill
GitHub
commit
b44ebe6cb3
@ -21,9 +21,15 @@ url: "https://pmarsceill.github.io" # the base hostname & protocol for your site
|
||||
permalink: pretty
|
||||
exclude: ["node_modules/", "*.gemspec", "*.gem", "Gemfile", "Gemfile.lock", "package.json", "package-lock.json", "script/", "LICENSE.txt", "lib/", "bin/", "README.md", "Rakefile"]
|
||||
|
||||
# Set a path/url to a logo that will be displayed instead of the title
|
||||
#logo: "/assets/images/just-the-docs.png"
|
||||
|
||||
# Enable or disable the site search
|
||||
search_enabled: true
|
||||
|
||||
# Set the search token separator for hyphenated-word search:
|
||||
search_tokenizer_separator: /[\s/]+/
|
||||
|
||||
# Enable or disable heading anchors
|
||||
heading_anchors: true
|
||||
|
||||
|
||||
@ -1 +1,5 @@
|
||||
{{ site.title }}
|
||||
{% if site.logo %}
|
||||
<div class="site-logo"></div>
|
||||
{% else %}
|
||||
{{ site.title }}
|
||||
{% endif %}
|
||||
|
||||
@ -7,6 +7,12 @@ layout: table_wrappers
|
||||
<html lang="{{ site.lang | default: "en-US" }}">
|
||||
{% include head.html %}
|
||||
<body>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
|
||||
<symbol id="link" viewBox="0 0 16 16">
|
||||
<title>Link</title>
|
||||
<path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path>
|
||||
</symbol>
|
||||
</svg>
|
||||
|
||||
<div class="page-wrap">
|
||||
<div class="side-bar">
|
||||
@ -60,7 +66,7 @@ layout: table_wrappers
|
||||
{% endunless %}
|
||||
<div id="main-content" class="page-content" role="main">
|
||||
{% if site.heading_anchors != false %}
|
||||
{% include vendor/anchor_headings.html html=content beforeHeading = "true" anchorBody="<svg class=\"d-inline-block v-align-middle\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"18\" height=\"18\" aria-hidden=\"true\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg>" anchorClass="anchor-heading" %}
|
||||
{% include vendor/anchor_headings.html html=content beforeHeading="true" anchorBody="<svg viewBox=\"0 0 16 16\" aria-hidden=\"true\"><use xlink:href=\"#link\"></use></svg>" anchorClass="anchor-heading" %}
|
||||
{% else %}
|
||||
{{ content }}
|
||||
{% endif %}
|
||||
@ -73,7 +79,7 @@ layout: table_wrappers
|
||||
{% for child in children_list %}
|
||||
{% if child.parent == page.title and child.title != page.title %}
|
||||
<li>
|
||||
<a href="{{ child.url | absolute_url }}">{{ child.title }}</a>
|
||||
<a href="{{ child.url | absolute_url }}">{{ child.title }}</a>{% if child.summary %} - {{ child.summary }}{% endif %}
|
||||
</li>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
@ -116,26 +116,37 @@
|
||||
|
||||
.anchor-heading {
|
||||
position: absolute;
|
||||
right: -$sp-3;
|
||||
right: -$sp-4;
|
||||
width: $sp-5;
|
||||
height: 100%;
|
||||
padding-right: $sp-1;
|
||||
padding-left: $sp-1;
|
||||
overflow: visible;
|
||||
fill: $link-color;
|
||||
visibility: hidden;
|
||||
|
||||
@include mq(md) {
|
||||
right: auto;
|
||||
left: -$sp-5;
|
||||
}
|
||||
|
||||
svg {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
fill: $link-color;
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.anchor-heading:hover,
|
||||
h1:hover > .anchor-heading,
|
||||
h2:hover > .anchor-heading,
|
||||
h3:hover > .anchor-heading,
|
||||
h4:hover > .anchor-heading,
|
||||
h5:hover > .anchor-heading,
|
||||
h6:hover > .anchor-heading {
|
||||
visibility: visible;
|
||||
svg {
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
|
||||
h1,
|
||||
|
||||
@ -125,12 +125,12 @@
|
||||
|
||||
.site-header {
|
||||
display: flex;
|
||||
min-height: $header-height;
|
||||
align-items: center;
|
||||
|
||||
@include mq(md) {
|
||||
z-index: 101;
|
||||
height: $header-height;
|
||||
min-height: $header-height;
|
||||
max-height: $header-height;
|
||||
border-bottom: $border $border-color;
|
||||
}
|
||||
@ -142,10 +142,26 @@
|
||||
display: flex;
|
||||
height: 100%;
|
||||
align-items: center;
|
||||
padding-top: $gutter-spacing-sm;
|
||||
padding-bottom: $gutter-spacing-sm;
|
||||
padding-top: $sp-3;
|
||||
padding-bottom: $sp-3;
|
||||
color: $body-heading-color;
|
||||
@include fs-6;
|
||||
|
||||
@include mq(md) {
|
||||
padding-top: $sp-2;
|
||||
padding-bottom: $sp-2;
|
||||
}
|
||||
}
|
||||
|
||||
@if variable-exists(logo) {
|
||||
.site-logo {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url($logo);
|
||||
background-repeat: no-repeat;
|
||||
background-position: left center;
|
||||
background-size: contain;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-button {
|
||||
|
||||
3
_sass/overrides.scss
Normal file
3
_sass/overrides.scss
Normal file
@ -0,0 +1,3 @@
|
||||
//
|
||||
// Custom overrides from a user.
|
||||
//
|
||||
@ -3,6 +3,10 @@
|
||||
# only Main files contain this front matter, not partials.
|
||||
---
|
||||
|
||||
{% if site.logo %}
|
||||
$logo: "{{ site.logo | absolute_url }}";
|
||||
{% endif %}
|
||||
|
||||
//
|
||||
// Import external dependencies
|
||||
//
|
||||
|
||||
@ -3,6 +3,10 @@
|
||||
# only Main files contain this front matter, not partials.
|
||||
---
|
||||
|
||||
{% if site.logo %}
|
||||
$logo: "{{ site.logo | absolute_url }}";
|
||||
{% endif %}
|
||||
|
||||
//
|
||||
// Import external dependencies
|
||||
//
|
||||
@ -42,3 +46,4 @@
|
||||
@import "./tables";
|
||||
@import "./code";
|
||||
@import "./utilities/utilities";
|
||||
@import "./overrides";
|
||||
|
||||
23
assets/js/dark-mode-preview.js
Normal file
23
assets/js/dark-mode-preview.js
Normal file
@ -0,0 +1,23 @@
|
||||
document.addEventListener("DOMContentLoaded", function(){
|
||||
|
||||
const toggleDarkMode = document.querySelector('.js-toggle-dark-mode')
|
||||
const cssFile = document.querySelector('[rel="stylesheet"]')
|
||||
const originalCssRef = cssFile.getAttribute('href')
|
||||
const darkModeCssRef = originalCssRef.replace('just-the-docs.css', 'dark-mode-preview.css')
|
||||
const buttonCopy = ['Return to the light side', 'Preview dark color scheme']
|
||||
const updateButtonText = function(toggleDarkMode) {
|
||||
toggleDarkMode.textContent === buttonCopy[0] ?
|
||||
toggleDarkMode.textContent = buttonCopy[1] :
|
||||
toggleDarkMode.textContent = buttonCopy[0]
|
||||
}
|
||||
|
||||
addEvent(toggleDarkMode, 'click', function(){
|
||||
if (cssFile.getAttribute('href') === originalCssRef) {
|
||||
cssFile.setAttribute('href', darkModeCssRef)
|
||||
updateButtonText(toggleDarkMode)
|
||||
} else {
|
||||
cssFile.setAttribute('href', originalCssRef)
|
||||
updateButtonText(toggleDarkMode)
|
||||
}
|
||||
})
|
||||
})
|
||||
@ -52,8 +52,13 @@ function initSearch() {
|
||||
if (request.status >= 200 && request.status < 400) {
|
||||
// Success!
|
||||
var data = JSON.parse(request.responseText);
|
||||
|
||||
|
||||
{% if site.search_tokenizer_separator != nil %}
|
||||
lunr.tokenizer.separator = {{ site.search_tokenizer_separator }}
|
||||
{% else %}
|
||||
lunr.tokenizer.separator = /[\s\-/]+/
|
||||
{% endif %}
|
||||
|
||||
var index = lunr(function () {
|
||||
this.ref('id');
|
||||
this.field('title', { boost: 200 });
|
||||
|
||||
@ -1,11 +1,12 @@
|
||||
---
|
||||
---
|
||||
{
|
||||
{% for page in site.html_pages %}{% if page.search_exclude != true %}"{{ forloop.index0 }}": {
|
||||
{% assign comma = false %}
|
||||
{% for page in site.html_pages %}{% if page.search_exclude != true %}{% if comma == true%},{% endif %}"{{ forloop.index0 }}": {
|
||||
"title": "{{ page.title | replace: '&', '&' }}",
|
||||
"content": "{{ page.content | markdownify | replace: '</h', ' . </h' | replace: '<hr', ' . <hr' | replace: '</p', ' . </p' | replace: '</ul', ' . </ul' | replace: '</tr', ' . </tr' | replace: '</li', ' | </li' | replace: '</td', ' | </td' | strip_html | escape_once | remove: 'Table of contents' | remove: '```' | remove: '---' | replace: '\', ' ' | replace: ' . . . ', ' . ' | replace: ' . . ', ' . ' | normalize_whitespace }}",
|
||||
"url": "{{ page.url | absolute_url }}",
|
||||
"relUrl": "{{ page.url }}"
|
||||
}{% unless forloop.last %},{% endunless %}
|
||||
}{% assign comma = true %}
|
||||
{% endif %}{% endfor %}
|
||||
}
|
||||
}
|
||||
@ -22,12 +22,23 @@ Just the Docs has some specific configuration parameters that can be defined in
|
||||
|
||||
View this site's [_config.yml](https://github.com/pmarsceill/just-the-docs/tree/master/_config.yml) file as an example.
|
||||
|
||||
## Search enabled
|
||||
## Site logo
|
||||
|
||||
```yaml
|
||||
# Set a path/url to a logo that will be displayed instead of the title
|
||||
logo: "/assets/images/just-the-docs.png"
|
||||
```
|
||||
|
||||
## Search
|
||||
|
||||
```yaml
|
||||
# Enable or disable the site search
|
||||
# Support true (default) or false
|
||||
# Supports true (default) or false
|
||||
search_enabled: true
|
||||
|
||||
# Enable support for hyphenated search words:
|
||||
search_tokenizer_separator: /[\s/]+/
|
||||
|
||||
```
|
||||
|
||||
## Aux links
|
||||
@ -35,18 +46,17 @@ search_enabled: true
|
||||
```yaml
|
||||
# Aux links for the upper right navigation
|
||||
aux_links:
|
||||
"Just the Docs on GitHub":
|
||||
- "//github.com/pmarsceill/just-the-docs"
|
||||
"Just the Docs on GitHub":
|
||||
- "//github.com/pmarsceill/just-the-docs"
|
||||
```
|
||||
|
||||
## Heading anchor links
|
||||
|
||||
```yaml
|
||||
# Heading anchor links appear on hover over h1-h6 tags
|
||||
# in page content allowing users to deep link to a particular
|
||||
# heading on a page.
|
||||
# Heading anchor links appear on hover over h1-h6 tags in page content
|
||||
# allowing users to deep link to a particular heading on a page.
|
||||
#
|
||||
# Supprts true (default) or false/nil
|
||||
# Supports true (default) or false/nil
|
||||
heading_anchors: true
|
||||
```
|
||||
|
||||
@ -65,20 +75,7 @@ color_scheme: "dark"
|
||||
```
|
||||
<button class="btn js-toggle-dark-mode">Preview dark color scheme</button>
|
||||
|
||||
<script>
|
||||
const toggleDarkMode = document.querySelector('.js-toggle-dark-mode');
|
||||
const cssFile = document.querySelector('[rel="stylesheet"]');
|
||||
const originalCssRef = cssFile.getAttribute('href');
|
||||
const darkModeCssRef = originalCssRef.replace('just-the-docs.css', 'dark-mode-preview.css');
|
||||
|
||||
jtd.addEvent(toggleDarkMode, 'click', function(){
|
||||
if (cssFile.getAttribute('href') === originalCssRef) {
|
||||
cssFile.setAttribute('href', darkModeCssRef);
|
||||
} else {
|
||||
cssFile.setAttribute('href', originalCssRef);
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<script type="text/javascript" src="{{ "/assets/js/dark-mode-preview.js" | absolute_url }}"></script>
|
||||
|
||||
See [Customization]({{ site.baseurl }}{% link docs/customization.md %}) for more information.
|
||||
|
||||
|
||||
@ -34,20 +34,7 @@ color_scheme: "dark"
|
||||
```
|
||||
<button class="btn js-toggle-dark-mode">Preview dark color scheme</button>
|
||||
|
||||
<script>
|
||||
const toggleDarkMode = document.querySelector('.js-toggle-dark-mode');
|
||||
const cssFile = document.querySelector('[rel="stylesheet"]');
|
||||
const originalCssRef = cssFile.getAttribute('href');
|
||||
const darkModeCssRef = originalCssRef.replace('just-the-docs.css', 'dark-mode-preview.css');
|
||||
|
||||
jtd.addEvent(toggleDarkMode, 'click', function(){
|
||||
if (cssFile.getAttribute('href') === originalCssRef) {
|
||||
cssFile.setAttribute('href', darkModeCssRef);
|
||||
} else {
|
||||
cssFile.setAttribute('href', originalCssRef);
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<script type="text/javascript" src="{{ "/assets/js/dark-mode-preview.js" | absolute_url }}"></script>
|
||||
|
||||
## Specific visual customization
|
||||
|
||||
@ -69,3 +56,20 @@ $link-color: $blue-000;
|
||||
```
|
||||
|
||||
_Note:_ Editing the variables directly in `_sass/support/variables.scss` is not recommended and can cause other dependencies to fail.
|
||||
|
||||
## Override styles
|
||||
|
||||
To add your own CSS at the end of the cascade, edit `_sass/overrides.scss` to add in your own custom CSS. This will allow for all overrides to be kept in a single file, and allow for any upstream changes to still be allowed.
|
||||
|
||||
For example, if you'd like to add your own styles for printing a page, you could add the following styles.
|
||||
|
||||
#### Example
|
||||
{: .no_toc }
|
||||
|
||||
```scss
|
||||
// Print-only styles.
|
||||
@media print {
|
||||
.side-bar, .page-header { display: none; }
|
||||
.main-content { max-width: auto; margin: 1em;}
|
||||
}
|
||||
```
|
||||
|
||||
@ -67,7 +67,7 @@ Sometimes you will want to create a page with many children (a section). First,
|
||||
|
|
||||
|-- docs
|
||||
| |-- ui-components
|
||||
| | |-- ui-components.md (parent page)
|
||||
| | |-- index.md (parent page)
|
||||
| | |-- buttons.md
|
||||
| | |-- code.md
|
||||
| | |-- labels.md
|
||||
@ -75,7 +75,7 @@ Sometimes you will want to create a page with many children (a section). First,
|
||||
| | +-- typography.md
|
||||
| |
|
||||
| |-- utilities
|
||||
| | |-- utilities.md (parent page)
|
||||
| | |-- index.md (parent page)
|
||||
| | |-- color.md
|
||||
| | |-- layout.md
|
||||
| | |-- responsive-modifiers.md
|
||||
@ -88,9 +88,8 @@ Sometimes you will want to create a page with many children (a section). First,
|
||||
+-- ..
|
||||
```
|
||||
|
||||
On the parent pages, add 2 YAML front matter parameters:
|
||||
On the parent pages, add this YAML front matter parameter:
|
||||
- `has_children: true` (tells us that this is a parent page)
|
||||
- `permalink:` set this to the site directory that contains the child pages
|
||||
|
||||
#### Example
|
||||
{: .no_toc }
|
||||
@ -101,7 +100,6 @@ layout: default
|
||||
title: UI Components
|
||||
nav_order: 2
|
||||
has_children: true
|
||||
permalink: /docs/ui-components
|
||||
---
|
||||
```
|
||||
|
||||
@ -140,7 +138,6 @@ title: UI Components
|
||||
nav_order: 2
|
||||
has_children: true
|
||||
has_toc: false
|
||||
permalink: /docs/ui-components
|
||||
---
|
||||
```
|
||||
|
||||
|
||||
16
package-lock.json
generated
16
package-lock.json
generated
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "just-the-docs",
|
||||
"version": "0.2.5",
|
||||
"version": "0.2.6",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
@ -177,11 +177,11 @@
|
||||
"dev": true
|
||||
},
|
||||
"@primer/css": {
|
||||
"version": "12.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@primer/css/-/css-12.6.0.tgz",
|
||||
"integrity": "sha512-GzQr/MPCbTlgvAd4bEXy4RA5cZvz7k/wkCzG7sOmjB9g9EtGnkzmLz6aS58EBRJsxfe6QU/iZ2/N/66/Bn5eZA==",
|
||||
"version": "12.7.0",
|
||||
"resolved": "https://registry.npmjs.org/@primer/css/-/css-12.7.0.tgz",
|
||||
"integrity": "sha512-EVqfwX1jxKWQoV9IxxCJQG7HlyKefdkYTJdnDV43Rr1cyidUTkQN9W0uMuN+RD9cmAzip/40b2E+7gsvsFDmBA==",
|
||||
"requires": {
|
||||
"@primer/octicons": "9.1.1"
|
||||
"@primer/octicons": "^9.1.1"
|
||||
}
|
||||
},
|
||||
"@primer/octicons": {
|
||||
@ -2776,9 +2776,9 @@
|
||||
}
|
||||
},
|
||||
"mixin-deep": {
|
||||
"version": "1.3.1",
|
||||
"resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.3.1.tgz",
|
||||
"integrity": "sha512-8ZItLHeEgaqEvd5lYBXfm4EZSFCX29Jb9K+lAHhDKzReKBQKj3R+7NOF6tjqYi9t4oI8VUfaWITJQm86wnXGNQ==",
|
||||
"version": "1.3.2",
|
||||
"resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.3.2.tgz",
|
||||
"integrity": "sha512-WRoDn//mXBiJ1H40rqa3vH0toePwSsGb45iInWlTySa+Uu4k3tYUSxa2v1KqAiLtvlrSzaExqS1gtk96A9zvEA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"for-in": "^1.0.2",
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
"stylelint-selector-no-utility": "^4.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@primer/css": "^12.6.0"
|
||||
"@primer/css": "^12.7.0"
|
||||
},
|
||||
"scripts": {
|
||||
"test": "stylelint '**/*.scss'"
|
||||
|
||||
Loading…
Reference in New Issue
Block a user