OpenSourceArk/mkdocs-material
1
0
Fork 0
mirror of https://github.com/squidfunk/mkdocs-material.git synced 2024-06-14 11:52:32 +03:00
Code Issues Packages Projects Releases Wiki Activity

Added support for footnotes

Browse Source
This commit is contained in:
squidfunk 2016-09-02 22:59:14 +02:00
parent 930c206132
commit 2eed3bdb4f
28 changed files with 2178 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
Gulpfile.js
View File

@ -46,6 +46,7 @@ var plumber = require('gulp-plumber');
var postcss = require('gulp-postcss');
var rev = require('gulp-rev');
var sass = require('gulp-sass');
// var sasslint = require('gulp-sass-lint');
var sourcemaps = require('gulp-sourcemaps');
var stream = require('webpack-stream');
var uglify = require('gulp-uglify');
@ -93,6 +94,7 @@ gulp.src = function() {
*/
gulp.task('assets:stylesheets', function() {
return gulp.src('src/assets/stylesheets/*.scss')
// .pipe(gulpif(args.production, sasslint()))
.pipe(gulpif(args.sourcemaps, sourcemaps.init()))
.pipe(
sass({
@ -135,7 +137,7 @@ gulp.task('assets:javascripts', function() {
plugins: [
new webpack.NoErrorsPlugin(),
new webpack.ResolverPlugin(
new webpack.ResolverPlugin.DirectoryDescriptionFilePlugin(
new webpack.ResolverPlugin.DirectoryDescriptionFilePlugin( // TODO: remove?
'.bower.json', ['main']
)
)

54
docs/extensions/admonition.md Normal file
View File

@ -0,0 +1,54 @@
# Admonition
## Variations
!!! hint
!!! hint "Failure with custom name"
!!! hint
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at nisl ac
urna lobortis consectetur ut vitae urna. Donec eu viverra sapien. Nam
tempor auctor lacus et congue. Quisque id congue velit. Lorem ipsum dolor
sit amet, consectetur adipiscing elit.
Nunc eu odio eleifend, blandit leo a, volutpat sapien. Phasellus posuere in
sem ut cursus. Nullam sit amet tincidunt ipsum, sit amet elementum turpis.
Etiam ipsum quam, mattis in purus vitae, lacinia fermentum enim.
!!! hint ""
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at nisl ac
urna lobortis consectetur ut vitae urna. Donec eu viverra sapien. Nam
tempor auctor lacus et congue. Quisque id congue velit. Lorem ipsum dolor
sit amet, consectetur adipiscing elit.
!!! hint
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at nisl ac
urna lobortis consectetur ut vitae urna. Donec eu viverra sapien. Nam
tempor auctor lacus et congue. Quisque id congue velit. Lorem ipsum dolor
sit amet, consectetur adipiscing elit.
> Nunc eu odio eleifend, blandit leo a, volutpat sapien. Phasellus posuere
> sem ut cursus. Nullam sit amet tincidunt ipsum, sit amet elementum turpis.
Nunc eu odio eleifend, blandit leo a, volutpat sapien. Phasellus posuere in
sem ut cursus. Nullam sit amet tincidunt ipsum, sit amet elementum turpis.
Etiam ipsum quam, mattis in purus vitae, lacinia fermentum enim.
TODO: NESTED...
## Specimen
!!! hint "hint, note <small>default</small>"
!!! tip "tip, idea"
!!! success "success, check, done"
!!! warning "warning, warn"
!!! failure "failure, fail, missing"
!!! fatal "danger, fatal"
!!! bug "error, bug"

0
docs/extensions/codehilite.md Normal file
View File

46
docs/extensions/footnotes.md Normal file
View File

@ -0,0 +1,46 @@
# Footnotes
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at nisl ac
urna lobortis consectetur ut vitae urna. Donec eu viverra sapien. Nam
tempor auctor lacus et congue. Quisque id congue velit. Lorem ipsum dolor
sit amet, consectetur adipiscing elit.
#### Headline on fourth level
Footnotes[^1] have a label[^@#$%] and the footnote's content.
### 2nd Headline on fourth level
[^1]: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at nisl ac
urna lobortis consectetur ut vitae urna. Donec eu viverra sapien. Nam
tempor auctor lacus et congue. Quisque id congue velit. Lorem ipsum dolor
sit amet, consectetur adipiscing elit.
[^@#$%]: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at nisl ac
urna lobortis consectetur ut vitae urna. Donec eu viverra sapien. Nam
tempor auctor lacus et congue. Quisque id congue velit. Lorem ipsum dolor
sit amet, consectetur adipiscing elit.
[^2]: Lorem ipsum dolor sit [amet](#), consectetur adipiscing elit. Sed at nisl ac
urna lobortis consectetur ut vitae urna. **Donec** eu viverra sapien. Nam
tempor auctor lacus et congue. Quisque id congue velit. Lorem ipsum dolor
sit amet, consectetur adipiscing elit.
Nunc eu odio eleifend, blandit leo a, volutpat sapien. Phasellus posuere in
sem ut cursus. Nullam sit amet tincidunt ipsum, sit amet elementum turpis.
Etiam ipsum quam, mattis in purus vitae, lacinia fermentum enim.
## [Some headline <small>with</small> a link](http://www.google.de)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at nisl ac
urna lobortis consectetur ut vitae urna. Donec eu viverra sapien. Nam
tempor auctor lacus et congue. Quisque id congue velit. Lorem ipsum dolor
sit amet, consectetur adipiscing elit.
Nunc eu odio eleifend, blandit leo a, volutpat sapien. Phasellus posuere in
sem ut cursus. Nullam sit amet tincidunt ipsum, sit amet elementum turpis.
Etiam ipsum quam, mattis in purus vitae, lacinia fermentum enim.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at nisl ac
urna lobortis consectetur ut vitae urna. Donec eu viverra sapien. Nam
tempor auctor lacus et congue. Quisque id congue velit. Lorem ipsum dolor
sit amet, consectetur adipiscing elit.

0
docs/extensions/meta.md Normal file
View File

0
docs/extensions/permalinks.md Normal file
View File

24
docs/getting-started.md
View File

@ -1,3 +1,11 @@
Title: My Document
Summary: A brief description of my document.
Authors: Waylan Limberg
John Doe
Date: October 2, 2007
blank-value:
base_url: http://example.com
# Getting started
## Installation
@ -270,22 +278,6 @@ This will print:
More colors can be freely defined.
!!! hint "hint, note <small>default</small>"
!!! tip "tip, idea"
!!! check "check, success"
!!! warning
!!! failure "fail, failure"
!!! fatal "fatal, danger"
!!! bug "error, bug"
!!! bug
## Full example
Below is a full example configuration for a `mkdocs.yml`:

0
docs/reference/cpp/api/one.md Normal file
View File

0
docs/reference/cpp/api/two.md Normal file
View File

0
docs/reference/cpp/one.md Normal file
View File

0
docs/reference/cpp/two.md Normal file
View File

0
docs/reference/java/one.md Normal file
View File

0
docs/reference/java/two.md Normal file
View File

1
material/assets/javascripts/modernizr-31a00ebfc6.js
View File

File diff suppressed because one or more lines are too long

1841
material/assets/javascripts/modernizr-ca288b1d5b.js Normal file
View File

File diff suppressed because it is too large Load Diff

1
material/assets/stylesheets/application-28991d4685.css Normal file
View File

File diff suppressed because one or more lines are too long

1
material/assets/stylesheets/application-8e9e9d1cff.css
View File

File diff suppressed because one or more lines are too long

2
material/assets/stylesheets/application.css
View File

File diff suppressed because one or more lines are too long

12
material/base.html
View File

@ -25,14 +25,14 @@
<meta name="author" content="{{ site_author }}">
{% endif %}
{% endblock %}
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-8e9e9d1cff.css">
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-28991d4685.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,700">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
{% for path in extra_css %}
<link rel="stylesheet" href="{{ path }}">
{% endfor %}
<script src="{{ base_url }}/assets/javascripts/modernizr-31a00ebfc6.js"></script>
<script src="{{ base_url }}/assets/javascripts/modernizr-ca288b1d5b.js"></script>
</head>
<body>
<input class="md-toggle" type="checkbox" id="md-toggle-drawer">
@ -58,9 +58,13 @@
{{ copyright }} &ndash;
{% endif %}
This document was created with
<a href="http://www.mkdocs.org" target="_blank">MkDocs</a>
<a href="http://www.mkdocs.org">
MkDocs
</a>
and the
<a href="http://squidfunk.github.io/mkdocs-material/" target="_blank">Material</a>
<a href="http://squidfunk.github.io/mkdocs-material/">
Material
</a>
theme.
</small>
</article>

4
material/manifest.json
View File

@ -1,6 +1,6 @@
{
"assets/images/favicon.ico": "assets/images/favicon-e565ddfa3b.ico",
"assets/javascripts/application.js": "assets/javascripts/application-e9877e2824.js",
"assets/javascripts/modernizr.js": "assets/javascripts/modernizr-31a00ebfc6.js",
"assets/stylesheets/application.css": "assets/stylesheets/application-8e9e9d1cff.css"
"assets/javascripts/modernizr.js": "assets/javascripts/modernizr-ca288b1d5b.js",
"assets/stylesheets/application.css": "assets/stylesheets/application-28991d4685.css"
}

10
mkdocs.yml
View File

@ -48,8 +48,10 @@ extra:
# Extensions
markdown_extensions:
- codehilite
- admonition
- codehilite
- footnotes
- meta
- toc:
permalink: '¶'
@ -57,6 +59,12 @@ markdown_extensions:
pages:
- Material: index.md
- Getting started: getting-started.md
- Extensions:
- Admonition: extensions/admonition.md
- Codehilite: extensions/codehilite.md
- Footnotes: extensions/footnotes.md
- Permalinks: extensions/permalinks.md
- Meta: extensions/meta.md
- Specimen: specimen.md
- Customization: customization.md
- License: license.md

9
src/assets/stylesheets/_shame.scss
View File

@ -24,15 +24,6 @@
* Nothing to see here, move along
* ------------------------------------------------------------------------- */
// Specificity?
.md-content .admonition-title {
margin: 0;
+ * {
margin-top: 0;
margin-bottom: 0;
}
}
.md-search__suggest {
background: $md-color-white;
border-radius: 0 0 px2rem(3px) px2rem(3px);

1
src/assets/stylesheets/application.scss
View File

@ -51,6 +51,7 @@
@import "extensions/admonition";
@import "extensions/codehilite";
@import "extensions/footnotes";
@import "extensions/permalinks";
@import "shame";

78
src/assets/stylesheets/base/_typeset.scss
View File

@ -73,7 +73,7 @@ pre, code {
* Body copy
*/
p {
margin: 2.0rem 0;
margin: 1.25em 0;
}
/*
@ -85,16 +85,6 @@ pre, code {
line-height: 1.3;
letter-spacing: -.01em;
color: $md-color-black--light;
/*
* Correct anchor offset
*/
&:before {
content: " ";
display: block;
padding-top: (5.6rem + 2.4rem + 3.0rem);
margin-top: -(5.6rem + 2.4rem + 3.0rem);
}
}
/*
@ -106,16 +96,6 @@ pre, code {
font-weight: 300;
line-height: 1.4;
letter-spacing: -.01em;
/*
* Correct anchor offset
*/
&:before {
content: " ";
display: block;
padding-top: (5.6rem + 2.4rem + 0.2rem);
margin-top: -(5.6rem + 2.4rem + 0.2rem);
}
}
/*
@ -127,16 +107,6 @@ pre, code {
font-weight: 400;
line-height: 1.5;
letter-spacing: -.01em;
/*
* Correct anchor offset
*/
&:before {
content: " ";
display: block;
padding-top: (5.6rem + 2.4rem + 0.4rem);
margin-top: -(5.6rem + 2.4rem + 0.4rem);
}
}
/*
@ -147,23 +117,13 @@ pre, code {
}
/*
* 4th, 5th and 6th level headline
* 4th level headline
*/
h4 {
margin-top: 1.6rem;
font-size: ms(0);
font-weight: 700;
letter-spacing: -.01em;
/*
* Correct anchor offset
*/
&:before {
content: " ";
display: block;
padding-top: (5.6rem + 2.4rem + 0.8rem);
margin-top: -(5.6rem + 2.4rem + 0.8rem);
}
}
/*
@ -175,16 +135,6 @@ pre, code {
font-weight: 700;
letter-spacing: -.01em;
color: $md-color-black--light;
/*
* Correct anchor offset
*/
&:before {
content: " ";
display: block;
padding-top: (5.6rem + 2.4rem + 1.0rem);
margin-top: -(5.6rem + 2.4rem + 1.0rem);
}
}
/*
@ -199,7 +149,14 @@ pre, code {
*/
a {
color: $md-color-primary;
transition: color .125s;
/*
* Also enable transition on pseudo elements
*/
&,
&:before {
transition: color .125s;
}
/*
* Active links
@ -256,9 +213,18 @@ pre, code {
* Smaller text
*/
small {
font-size: smaller;
color: $md-color-black--light;
}
/*
* Superscript and subscript
*/
sup,
sub {
margin-left: 0.1rem;
}
/*
* Horizontal separators
*/
@ -300,7 +266,8 @@ pre, code {
/*
* Unordered and ordered lists
*/
ul, ol {
ul,
ol {
margin-left: 1.0rem;
/*
@ -320,7 +287,8 @@ pre, code {
/*
* Nested lists
*/
ul, ol {
ul,
ol {
padding-top: 1.0rem;
margin-bottom: 1.0rem;
margin-left: 1.0rem;

30
src/assets/stylesheets/extensions/_admonition.scss
View File

@ -61,6 +61,34 @@
line-height: 2.0rem;
text-transform: uppercase;
color: $clr-blue-a400;
/*
* Ensure smaller spacing to next element
*/
html & {
margin-bottom: 1.6rem;
}
/*
* Ensure smaller spacing to next element
*/
html & + * {
margin-top: 1.6rem;
}
}
/*
* Remove spacing on first element
*/
:first-child {
margin-top: 0;
}
/*
* Remove spacing on last element
*/
:last-child {
margin-bottom: 0;
}
/*
@ -69,7 +97,7 @@
@each $names, $appearance in (
tip idea: $clr-teal-a700 "whatshot",
success check: $clr-green-a400 "done",
warning: $clr-orange-a400 "warning",
warning warn: $clr-orange-a400 "warning",
failure fail: $clr-red-a200 "clear",
danger fatal: $clr-red-a400 "flash_on",
bug error: $clr-pink-a400 "bug_report"

118
src/assets/stylesheets/extensions/_footnotes.scss Normal file
View File

@ -0,0 +1,118 @@
/*
* Copyright (c) 2016 Martin Donath <martin.donath@squidfunk.com>
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to
* deal in the Software without restriction, including without limitation the
* rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
* sell copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
* IN THE SOFTWARE.
*/
/* ----------------------------------------------------------------------------
* Footnotes extension
* ------------------------------------------------------------------------- */
/*
* Scoped in typesetted content for greater specificity
*/
.md-content--typeset {
/*
* Footnote
*/
.footnote {
@extend small;
/*
* Remove additional spacing on footnotes
*/
> ol {
margin-left: 0;
/*
* Single footnote
*/
> li {
// TODO: this doesn't work entirely
// &:before {
// display: block;
// content: " ";
// padding-top: (5.6rem + 2.4rem + 0.4rem);
// margin-top: -(5.6rem + 2.4rem + 0.4rem);
// }
/*
* Make permalink visible on hover
*/
&:hover .footnote-backref,
&:target .footnote-backref {
opacity: 1;
transform: translate3d(0, 0, 0);
}
/*
* Active or targeted permalink
*/
&:hover .footnote-backref:hover,
&:target .footnote-backref {
color: $md-color-accent;
}
}
}
/*
* Correct anchor offset;
*/
&-ref:before {
position: absolute;
content: " ";
pointer-events: none;
padding-top: (5.6rem + 2.4rem + 0.4rem);
margin-top: -(5.6rem + 2.4rem + 0.4rem);
}
/*
* Make backref transparent for custom icon
*/
&-backref {
@extend .md-icon;
position: absolute;
font-size: 2.0rem;
vertical-align: middle;
opacity: 0;
color: $md-color-black--lighter;
transform: translate3d(0.5rem, 0, 0);
transition: opacity .125s .125s,
transform .25s .125s,
color .25s;
/*
* Hack: remove Unicode arrow for icon
*/
&:first-letter {
font-size: 0;
}
/*
* Icon
*/
&:after {
content: "keyboard_return";
}
}
}
}

35
src/assets/stylesheets/extensions/_permalinks.scss
View File

@ -25,9 +25,9 @@
* ------------------------------------------------------------------------- */
/*
* Scope in content for greater specificity
* Scoped in typesetted content for greater specificity
*/
.md-content {
.md-content--typeset {
/*
* Permalink
@ -41,26 +41,47 @@
transition: opacity .125s .25s,
transform .25s .25s,
color .25s;
}
/*
* Only show permalinks in active state
* All headers with permalinks have ids
*/
h1, h2, h3, h4, h5, h6 {
[id] {
/*
* Make permalink visible on hover
*/
&:hover .headerlink,
&:target .headerlink {
margin-left: 1.0rem;
opacity: 1;
transform: translate3d(0, 0, 0);
}
/*
* Active or targeted link
* Active or targeted permalink
*/
&:hover .headerlink:hover,
&:target .headerlink {
color: $md-color-accent;
}
}
/*
* Correct anchor offset of headlines
*/
@each $level, $delta in (
h1: 3.0rem,
h2: 0.2rem,
h3: 0.4rem,
h4: 0.6rem,
h5: 1.0rem,
h6: 1.0rem
) {
#{$level}[id]:before {
content: " ";
display: block;
padding-top: (5.6rem + 2.4rem + $delta);
margin-top: -(5.6rem + 2.4rem + $delta);
}
}
}

9
src/base.html
View File

@ -130,10 +130,13 @@
{{ copyright }} &ndash;
{% endif %}
This document was created with
<a href="http://www.mkdocs.org" target="_blank">MkDocs</a>
<a href="http://www.mkdocs.org">
MkDocs
</a>
and the
<a href="http://squidfunk.github.io/mkdocs-material/"
target="_blank">Material</a>
<a href="http://squidfunk.github.io/mkdocs-material/">
Material
</a>
theme.
</small>
</article>