1
0
mirror of https://github.com/squidfunk/mkdocs-material.git synced 2024-11-24 07:30:12 +01:00

Merge master into HEAD

This commit is contained in:
squidfunk 2017-01-24 23:29:22 +01:00
commit f474f63d6b
46 changed files with 365 additions and 268 deletions

34
.githooks/pre-commit/branch.sh Executable file
View File

@ -0,0 +1,34 @@
#!/bin/bash
# Copyright (c) 2016-2017 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.
# Determine current branch
BRANCH=$(git rev-parse --abbrev-ref HEAD)
echo "Hook[pre-commit]: Checking branch..."
# If we're on master, abort commit
if [[ "$BRANCH" == "master" ]]; then
echo "Commits on master are only allowed via Pull Requests. Aborting."
exit 1
fi
# We're good
exit 0

View File

@ -18,11 +18,17 @@
### Package versions
- Python: `python --version`
- MkDocs: `mkdocs --version`
- Material: `pip show mkdocs-material | grep -E ^Version`
* Python: `python --version`
* MkDocs: `mkdocs --version`
* Material: `pip show mkdocs-material | grep -E ^Version`
### Project configuration
``` yaml
The contents of your mkdocs.yml
```
### System information
- OS: [The operating system you're running]
- Browser: [The browser used, if relevant]
* OS: [The operating system you're running]
* Browser: [The browser used, if relevant]

View File

@ -1,3 +1,20 @@
mkdocs-material-1.0.3 (2017-01-22)
* Fixed #117: Table of contents items don't blur on fast scrolling
* Refactored sidebar positioning logic
* Further reduction of repaints
mkdocs-material-1.0.2 (2017-01-15)
* Fixed #108: Horizontal scrollbar in content area
mkdocs-material-1.0.1 (2017-01-14)
* Fixed massive repaints happening when scrolling
* Fixed footer back reference positions in case of overflow
* Fixed header logo from showing when the menu icon is rendered
* Changed scrollbar behavior to only show when content overflows
mkdocs-material-1.0.0 (2017-01-13)
* Introduced Webpack for more sophisticated JavaScript bundling

View File

@ -19,9 +19,10 @@
# IN THE SOFTWARE.
FROM jfloff/alpine-python:2.7-slim
MAINTAINER Martin Donath <martin.donath@squidfunk.com>
# Set work directory
WORKDIR /usr/src
# Set working directory
WORKDIR /docs
# Install packages
COPY requirements.txt .

View File

@ -1,23 +1,27 @@
# Material
[![Travis][travis-image]][travis-link]
[![Dependencies][deps-image]][deps-link]
[![Codacy][codacy-image]][codacy-link]
[![Docker][docker-image]][docker-link]
[![PyPI][pypi-image]][pypi-link]
A Material Design theme for [MkDocs](http://www.mkdocs.org).
TBD: [![_](docs/images/material.png)](http://squidfunk.github.io/mkdocs-material/)
[travis-image]: https://travis-ci.org/squidfunk/mkdocs-material.svg
[travis-link]: https://travis-ci.org/squidfunk/mkdocs-material
[deps-image]: https://david-dm.org/squidfunk/mkdocs-material/dev-status.svg
[deps-link]: https://david-dm.org/squidfunk/mkdocs-material?type=dev
[codacy-image]: https://api.codacy.com/project/badge/Grade/fe07aa1fa91d453cb69711d3885c5d7e
[codacy-link]: https://www.codacy.com/app/squidfunk/mkdocs-material?utm_source=github.com&amp;utm_medium=referral&amp;utm_content=squidfunk/mkdocs-material&amp;utm_campaign=Badge_Grade
[docker-image]: https://img.shields.io/docker/pulls/squidfunk/mkdocs-material.svg
[docker-link]: https://hub.docker.com/r/squidfunk/mkdocs-material/
[pypi-image]: https://img.shields.io/pypi/v/mkdocs-material.svg
[pypi-link]: https://pypi.python.org/pypi/mkdocs-material
# Material for MkDocs
A Material Design theme for [MkDocs](http://www.mkdocs.org).
[![Material for MkDocs](docs/images/material.png)](http://squidfunk.github.io/mkdocs-material/)
## Quick start
Install with `pip`:

View File

@ -98,16 +98,14 @@ The directory layout of the Material theme is as follows:
│ ├─ javascripts/ # JavaScript
│ └─ stylesheets/ # Stylesheets
├─ partials/
│ ├─ fonts.html # Webfont definitions
│ ├─ footer.html # Footer bar
│ ├─ header.html # Header bar
│ ├─ i18n.html # Localized labels
│ ├─ language.html # Localized labels
│ ├─ nav-item.html # Main navigation item
│ ├─ nav.html # Main navigation
│ ├─ search.html # Search box
│ ├─ social.html # Social links
│ ├─ source.html # Repository information
│ ├─ svgs.html # Inline SVG definitions
│ ├─ toc-item.html # Table of contents item
│ └─ toc.html # Table of contents
├─ 404.html # 404 error page
@ -198,7 +196,7 @@ The Material theme uses a sophisticated asset pipeline using [Gulp][9] and
Webpack which can be started with the following command:
``` sh
npm run start
npm start
```
This will also start the MkDocs development server which will monitor changes

View File

@ -2,6 +2,12 @@
## Installation
!!! tip "Set up Material using Docker"
The official [Docker image][1] for Material comes with all dependencies
pre-installed and ready-to-use with the latest version published on PyPI,
packaged in a very small image (27MB compressed).
### Installing MkDocs
Before installing [MkDocs][2], you need to make sure you have Python and `pip`
@ -22,7 +28,7 @@ pip install mkdocs && mkdocs --version
# mkdocs, version 0.16.0
```
!!! warning "MkDocs for Material requirements"
!!! warning "MkDocs version requirements"
Material requires MkDocs >= 0.16.
@ -41,7 +47,7 @@ pip install pymdown-extensions
### Installing Material
#### by using pip
#### using pip
Material can be installed with `pip`:
@ -63,7 +69,23 @@ pip install mkdocs-material
to a self-contained solution by installing Python with Homebrew. This
should eliminate a lot of problems you may be having with `pip`.
#### by cloning from GitHub
#### using choco
If you're on Windows you can use [Chocolatey][5] to install [Material][6]:
``` dos
choco install mkdocs-material
```
This will also install all required dependencies like [Python][7] and
[MkDocs][8].
[5]: https://chocolatey.org
[6]: https://chocolatey.org/packages/mkdocs-material
[7]: https://chocolatey.org/packages/python
[8]: https://chocolatey.org/packages/mkdocs
#### cloning from GitHub
Material can also be used without a system-wide installation by cloning the
repository into a subfolder of your project's root directory:
@ -98,11 +120,11 @@ The development server can be started with the following command:
mkdocs serve
```
Now you can point your browser to [localhost:8000][5] and the Material theme
Now you can point your browser to [localhost:8000][9] and the Material theme
should be visible. From here on, you can start writing your documentation, or
read on and customize the theme through some options.
[5]: http://localhost:8000
[9]: http://localhost:8000
## Options
@ -112,7 +134,7 @@ project's `mkdocs.yml`. See the following section for all available options.
### Changing the color palette
Material defines a default hue for every primary and accent color on Google's
Material Design [color palette][6]. This makes it very easy to change the
Material Design [color palette][10]. This makes it very easy to change the
overall look of the theme. Just set the primary and accent colors using the
following variables in your `mkdocs.yml`:
@ -132,10 +154,10 @@ The last three colors can only be used as a primary color.
If the color is set via this configuration, an additional CSS file that
defines the color palette is included. If you want to keep things lean, clone
the repository and recompile the theme with your custom colors set. See the
guide on [customization][7] for more information.
guide on [customization][11] for more information.
[6]: http://www.materialui.co/colors
[7]: customization.md
[10]: http://www.materialui.co/colors
[11]: customization.md
#### Primary colors
@ -202,10 +224,10 @@ Click on a tile to change the accent color of the theme:
### Changing the font family
Material uses the [Roboto font family][8] by default, specifically the regular
Material uses the [Roboto font family][12] by default, specifically the regular
sans-serif type for text and the `monospaced` type for code. Both fonts are
loaded from [Google Fonts][9] and can easily be changed to other fonts, like
for example the [Ubuntu font family][10]:
loaded from [Google Fonts][13] and can easily be changed to other fonts, like
for example the [Ubuntu font family][14]:
``` yaml
extra:
@ -223,9 +245,9 @@ extra:
font: 'none'
```
[8]: https://fonts.google.com/specimen/Roboto
[9]: https://fonts.google.com/
[10]: https://fonts.google.com/specimen/Ubuntu
[12]: https://fonts.google.com/specimen/Roboto
[13]: https://fonts.google.com/
[14]: https://fonts.google.com/specimen/Ubuntu
### Adding a logo
@ -244,7 +266,7 @@ extra:
If you want to link your social accounts, the Material theme provides an easy
way for doing this in the footer of the documentation using the automatically
included [FontAwesome][11] webfont. The syntax is simple the `type` must
included [FontAwesome][15] webfont. The syntax is simple the `type` must
denote the name of the social service, e.g. `github`, `twitter` or `linkedin`
and the `link` must contain the URL you want to link to:
@ -263,7 +285,7 @@ The links are generated in order and the `type` of the links must match the
name of the FontAwesome glyph. The `fa` is automatically added, so `github`
will result in `fa fa-github`.
[11]: http://fontawesome.io/icons/
[15]: http://fontawesome.io/icons/
### Google Analytics integration
@ -281,8 +303,8 @@ google_analytics:
### Localization <small>L10N</small>
In order to localize the labels (e.g. *Previous* and *Next* in the footer),
you can override the file `partials/i18n.html` to provide your own translations
inside the macro `t`:
you can override the file `partials/language.html` to provide your own
translations inside the macro `t`:
``` jinja
{% macro t(key) %}{{ {
@ -296,7 +318,7 @@ inside the macro `t`:
```
Just copy the file from the original theme and make your adjustments. See the
section on [overriding partials][12] in the customization guide.
section on [overriding partials][16] in the customization guide.
!!! warning "Migrating from Material 0.2.x"
@ -304,18 +326,18 @@ section on [overriding partials][12] in the customization guide.
`mkdocs.yml`. With 1.0.0 this is no longer possible as the configuration
will be ignored.
[12]: customization.md#overriding-partials
[16]: customization.md#overriding-partials
### More advanced customization
If you want to change the general appearance of the Material theme, see
[this article][13] for more information on advanced customization.
[this article][17] for more information on advanced customization.
[13]: customization.md
[17]: customization.md
## Extensions
MkDocs supports several [Markdown extensions][14]. The following extensions
MkDocs supports several [Markdown extensions][18]. The following extensions
are not enabled by default (see the link for which are enabled by default)
but highly recommended, so they should be switched on at all times:
@ -329,18 +351,18 @@ markdown_extensions:
For more information, see the following list of extensions supported by the
Material theme including more information regarding installation and usage:
* [Admonition][15]
* [Codehilite][16]
* [Permalinks][17]
* [Footnotes][18]
* [PyMdown Extensions][19]
* [Admonition][19]
* [Codehilite][20]
* [Permalinks][21]
* [Footnotes][22]
* [PyMdown Extensions][23]
[14]: http://www.mkdocs.org/user-guide/writing-your-docs/#markdown-extensions
[15]: extensions/admonition.md
[16]: extensions/codehilite.md
[17]: extensions/permalinks.md
[18]: extensions/footnotes.md
[19]: extensions/pymdown.md
[18]: http://www.mkdocs.org/user-guide/writing-your-docs/#markdown-extensions
[19]: extensions/admonition.md
[20]: extensions/codehilite.md
[21]: extensions/permalinks.md
[22]: extensions/footnotes.md
[23]: extensions/pymdown.md
## Full example

BIN
docs/images/material.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 757 KiB

View File

@ -6,6 +6,8 @@ Material is a theme for [MkDocs][1], an excellent static site generator geared
towards project documentation. It is built using Google's [Material Design][2]
guidelines.
[![Material for MkDocs](images/material.png)](images/material.png)
[1]: http://www.mkdocs.org
[2]: https://www.google.com/design/spec/material-design

View File

@ -1,4 +1,4 @@
# Release Notes
# Release notes
## Upgrading
@ -12,12 +12,33 @@ To determine the currently installed version, use the following command:
``` sh
pip show mkdocs-material | grep -E ^Version
# Version 1.0.0
# Version 1.0.3
```
## Changelog
### 1.0.0 <small> _ January 13, 2017</small>
### 1.0.3 <small> _ January 22, 2017</small>
* Fixed [#117][117]: Table of contents items don't blur on fast scrolling
* Refactored sidebar positioning logic
* Further reduction of repaints
[117]: https://github.com/squidfunk/mkdocs-material/issues/117
### 1.0.2 <small> _ January 15, 2017</small>
* Fixed [#108][108]: Horizontal scrollbar in content area
[108]: https://github.com/squidfunk/mkdocs-material/issues/108
### 1.0.1 <small> _ January 14, 2017</small>
* Fixed massive repaints happening when scrolling
* Fixed footer back reference positions in case of overflow
* Fixed header logo from showing when the menu icon is rendered
* Changed scrollbar behavior to only show when content overflows
### 1.0.0 <small> _ January 13, 2017</small>
* Introduced Webpack for more sophisticated JavaScript bundling
* Introduced ESLint and Stylelint for code style checks

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,4 +1,4 @@
{% import "partials/i18n.html" as i18n %}
{% import "partials/language.html" as lang %}
<!DOCTYPE html>
<html class="no-js">
<head>
@ -19,7 +19,7 @@
{% else %}
<link rel="shortcut icon" href="{{ base_url }}/assets/images/favicon.ico">
{% endif %}
<meta name="generator" content="mkdocs+mkdocs-material#1.0.0">
<meta name="generator" content="mkdocs+mkdocs-material#1.0.3">
{% endblock %}
{% block htmltitle %}
{% if page.title %}
@ -31,13 +31,21 @@
{% endif %}
{% endblock %}
{% block libs %}
<script src="{{ base_url }}/assets/javascripts/modernizr.js"></script>
<script src="{{ base_url }}/assets/javascripts/modernizr-facb31f4a3.js"></script>
{% endblock %}
{% block fonts %}
{% include "partials/fonts.html" %}
{% if config.extra.font != "none" %}
{% set text = config.extra.get("font", {}).text | default("Roboto") %}
{% set code = config.extra.get("font", {}).code
| default("Roboto Mono") %}
{% set font = text + ':300,400,400i,700|' + code | replace(' ', '+') %}
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family={{ font }}">
<style>body,input{font-family:"{{ text }}","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"{{ code }}","Courier New",Courier,monospace}</style>
{% endif %}
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
{% endblock %}
{% block styles %}
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-ff220fd69d.css">
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-f3ab63f78a.css">
{% if config.extra.palette %}
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-02ce7adcc2.palette.css">
{% endif %}
@ -55,7 +63,18 @@
{% else %}
<body>
{% endif %}
{% include "partials/svgs.html" %}
<svg class="md-svg">
<defs>
{% set platform = config.extra.repo_icon or config.repo_url %}
{% if "github" in platform %}
{% include "assets/images/icons/github-1da075986e.svg" %}
{% elif "gitlab" in platform %}
{% include "assets/images/icons/gitlab-5ad3f9f9e5.svg" %}
{% elif "bitbucket" in platform %}
{% include "assets/images/icons/bitbucket-670608a71a.svg" %}
{% endif %}
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="drawer">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="search">
<label class="md-overlay" data-md-component="overlay" for="drawer"></label>
@ -88,7 +107,7 @@
<div class="md-content">
<article class="md-content__inner md-typeset">
{% if config.edit_uri %}
<a href="{{ page.edit_url }}" title="{{ i18n.t('edit.link.title') }}" class="md-icon md-content__edit">edit</a>
<a href="{{ page.edit_url }}" title="{{ lang.t('edit.link.title') }}" class="md-icon md-content__edit">edit</a>
{% endif %}
{% block content %}
{% if not "\x3ch1 id=" in page.content %}
@ -105,7 +124,7 @@
{% endblock %}
</div>
{% block scripts %}
<script src="{{ base_url }}/assets/javascripts/application-35227ad8ac.js"></script>
<script src="{{ base_url }}/assets/javascripts/application-5a377364e7.js"></script>
<script>var config={url:{base:"{{ base_url }}"}},app=new Application(config);app.initialize()</script>
{% for path in extra_javascript %}
<script src="{{ path }}"></script>

View File

@ -1,8 +0,0 @@
{% if config.extra.font != "none" %}
{% set text = config.extra.get("font", {}).text | default("Roboto") %}
{% set code = config.extra.get("font", {}).code | default("Roboto Mono") %}
{% set font = text + ':300,400,400i,700|' + code | replace(' ', '+') %}
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family={{ font }}">
<style>body,input{font-family:"{{ text }}","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"{{ code }}","Courier New",Courier,monospace}</style>
{% endif %}
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

View File

@ -1,4 +1,4 @@
{% import "partials/i18n.html" as i18n %}
{% import "partials/language.html" as lang %}
<footer class="md-footer">
{% if page.previous_page or page.next_page %}
<div class="md-footer-nav">
@ -6,12 +6,12 @@
{% if page.previous_page %}
<a href="{{ page.previous_page.url }}" title="{{ page.previous_page.title }}" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__icon"></i>
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
{{ i18n.t('footer.previous') }}
{{ lang.t('footer.previous') }}
</span>
{{ page.previous_page.title }}
</span>
@ -23,13 +23,13 @@
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
{{ i18n.t('footer.next') }}
{{ lang.t('footer.next') }}
</span>
{{ page.next_page.title }}
</span>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-forward md-footer-nav__icon"></i>
<i class="md-icon md-icon--arrow-forward md-footer-nav__button"></i>
</div>
</a>
{% endif %}

View File

@ -2,14 +2,14 @@
<nav class="md-header-nav md-grid">
<div class="md-flex">
<div class="md-flex__cell md-flex__cell--shrink">
<a href="{{ nav.homepage.url }}" title="{{ config.site_name }}" class="md-icon {% if not config.extra.logo %} md-icon--home {% endif %} md-header-nav__icon">
<a href="{{ nav.homepage.url }}" title="{{ config.site_name }}" class="{% if config.extra.logo %} md-logo {% else %} md-icon md-icon--home {% endif %} md-header-nav__button">
{% if config.extra.logo %}
<img src="{{ base_url }}/{{ config.extra.logo }}" width="24" height="24">
{% endif %}
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__icon" for="drawer"></label>
<label class="md-icon md-icon--menu md-header-nav__button" for="drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<span class="md-flex__ellipsis md-header-nav__title">
@ -27,7 +27,7 @@
</div>
<div class="md-flex__cell md-flex__cell--shrink">
{% block search_box %}
<label class="md-icon md-icon--search md-header-nav__icon" for="search"></label>
<label class="md-icon md-icon--search md-header-nav__button" for="search"></label>
{% include "partials/search.html" %}
{% endblock %}
</div>

View File

@ -1,6 +1,6 @@
<nav class="md-nav md-nav--primary">
<label class="md-nav__title md-nav__title--site" for="drawer">
<i class="md-icon {% if not config.extra.logo %} md-icon--home {% endif %} md-nav__icon">
<i class="{% if config.extra.logo %} md-logo {% else %} md-icon md-icon--home {% endif %} md-nav__button">
{% if config.extra.logo %}
<img src="{{ base_url }}/{{ config.extra.logo }}">
{% endif %}

View File

@ -1,9 +1,9 @@
{% import "partials/i18n.html" as i18n %}
{% import "partials/language.html" as lang %}
<div class="md-search" data-md-component="search">
<div class="md-search__overlay"></div>
<div class="md-search__inner">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="{{ i18n.t('search.placeholder') }}" accesskey="s" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false">
<input type="text" class="md-search__input" name="query" placeholder="{{ lang.t('search.placeholder') }}" accesskey="s" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false">
<label class="md-icon md-search__icon" for="search"></label>
</form>
<div class="md-search__output">

View File

@ -1,4 +1,4 @@
{% import "partials/i18n.html" as i18n %}
{% import "partials/language.html" as lang %}
{% set platform = config.extra.repo_icon or config.repo_url %}
{% if "github" in platform %}
{% set repo_type = "github" %}
@ -10,7 +10,7 @@
{% set repo_type = "" %}
{% endif %}
{% block repo %}
<a href="{{ config.repo_url }}" title="{{ i18n.t('source.link.title') }}" class="md-source" data-md-source="{{ repo_type }}">
<a href="{{ config.repo_url }}" title="{{ lang.t('source.link.title') }}" class="md-source" data-md-source="{{ repo_type }}">
{% if repo_type %}
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">

View File

@ -1,10 +0,0 @@
<div class="md-svg">
{% set platform = config.extra.repo_icon or config.repo_url %}
{% if "github" in platform %}
{% include "assets/images/icons/github-1da075986e.svg" %}
{% elif "gitlab" in platform %}
{% include "assets/images/icons/gitlab-5ad3f9f9e5.svg" %}
{% elif "bitbucket" in platform %}
{% include "assets/images/icons/bitbucket-670608a71a.svg" %}
{% endif %}
</div>

View File

@ -1,11 +1,11 @@
{% import "partials/i18n.html" as i18n %}
{% import "partials/language.html" as lang %}
<nav class="md-nav md-nav--secondary">
{% set toc_ = page.toc %}
{% if "\x3ch1 id=" in page.content %}
{% set toc_ = (toc_ | first).children %}
{% endif %}
{% if toc_ and (toc_ | first) %}
<label class="md-nav__title" for="toc">{{ i18n.t('toc.title') }}</label>
<label class="md-nav__title" for="toc">{{ lang.t('toc.title') }}</label>
<ul class="md-nav__list" data-md-scrollfix>
{% for toc_item in toc_ %}
{% include "partials/toc-item.html" %}

View File

@ -29,7 +29,7 @@ repo_name: squidfunk/mkdocs-material
repo_url: https://github.com/squidfunk/mkdocs-material
# Copyright
copyright: 'Copyright &copy; 2016 Martin Donath'
copyright: 'Copyright &copy; 2016 - 2017 Martin Donath'
# Documentation and theme
theme_dir: material

View File

@ -1,6 +1,6 @@
{
"name": "mkdocs-material",
"version": "1.0.0",
"version": "1.0.3",
"description": "A Material Design theme for MkDocs",
"keywords": [
"mkdocs",
@ -37,7 +37,7 @@
"babel-plugin-add-module-exports": "^0.2.1",
"babel-plugin-transform-react-jsx": "^6.8.0",
"babel-polyfill": "^6.20.0",
"babel-preset-es2015": "^6.18.0",
"babel-preset-es2015": "^6.22.0",
"babel-register": "^6.18.0",
"babel-root-import": "^4.1.5",
"chai": "^3.5.0",
@ -45,7 +45,7 @@
"css-mqpacker": "^5.0.1",
"custom-event-polyfill": "^0.3.0",
"del": "^2.2.2",
"eslint": "^3.13.1",
"eslint": "^3.14.0",
"eslint-plugin-mocha": "^4.8.0",
"fastclick": "^1.0.6",
"git-hooks": "^1.1.7",

View File

@ -18,18 +18,23 @@
# FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
# IN THE SOFTWARE.
import json
from setuptools import setup, find_packages
# Load package.json contents
with open("package.json") as data:
package = json.load(data)
# Package description
setup(
name = "mkdocs-material",
version = "1.0.0",
url = "http://squidfunk.github.io/mkdocs-material/",
license = "MIT",
description = "A Material Design theme for MkDocs",
author = "Martin Donath",
author_email = "martin.donath@squidfunk.com",
keywords = ["mkdocs", "documentation", "theme"],
name = package["name"],
version = package["version"],
url = package["homepage"],
license = package["license"],
description = package["description"],
author = package["author"]["name"],
author_email = package["author"]["email"],
keywords = package["keywords"],
packages = find_packages(),
include_package_data = True,
entry_points = {

View File

@ -41,6 +41,9 @@ export default class Blur {
this.index_ = 0
this.offset_ = window.pageYOffset
/* Necessary state to correctly reset the index */
this.dir_ = false
/* Index anchor node offsets for fast lookup */
this.anchors_ = [].map.call(this.els_, el => {
return document.getElementById(el.hash.substring(1))
@ -62,6 +65,14 @@ export default class Blur {
*/
update() {
const offset = window.pageYOffset
const dir = this.offset_ - offset < 0
/* Hack: reset index if direction changed, to catch very fast scrolling,
because otherwise we would have to register a timer and that sucks */
if (this.dir_ !== dir)
this.index_ = dir
? this.index_ = 0
: this.index_ = this.els_.length - 1
/* Exit when there are no anchors */
if (this.anchors_.length === 0)
@ -92,8 +103,9 @@ export default class Blur {
}
}
/* Remember current offset for next iteration */
/* Remember current offset and direction for next iteration */
this.offset_ = offset
this.dir_ = dir
}
/**

View File

@ -40,6 +40,10 @@ export default class Collapse {
/**
* Animate expand and collapse smoothly
*
* Internet Explorer 11 is very slow at recognizing changes on the dataset
* which results in the menu not expanding or collapsing properly. THerefore,
* for reasons of compatibility, the attribute accessors are used.
*/
update() {
const current = this.el_.getBoundingClientRect().height
@ -48,34 +52,34 @@ export default class Collapse {
if (current) {
this.el_.style.maxHeight = `${current}px`
requestAnimationFrame(() => {
this.el_.dataset.mdState = "animate"
this.el_.setAttribute("data-md-state", "animate")
this.el_.style.maxHeight = "0px"
})
/* Collapsed, so expand */
} else {
this.el_.dataset.mdState = "expand"
this.el_.setAttribute("data-md-state", "expand")
this.el_.style.maxHeight = ""
/* Read height and unset pseudo-toggled state */
const height = this.el_.getBoundingClientRect().height
this.el_.dataset.mdState = ""
this.el_.removeAttribute("data-md-state")
/* Set initial state and animate */
this.el_.style.maxHeight = "0px"
requestAnimationFrame(() => {
this.el_.dataset.mdState = "animate"
this.el_.setAttribute("data-md-state", "animate")
this.el_.style.maxHeight = `${height}px`
})
}
/* Remove state on end of transition */
const end = ev => {
ev.target.dataset.mdState = ""
ev.target.removeAttribute("data-md-state")
ev.target.style.maxHeight = ""
/* Only fire once, so directly remove event listener */
ev.target.removeEventListener("transitionend", end, false)
ev.target.removeEventListener("transitionend", end)
}
this.el_.addEventListener("transitionend", end, false)
}

View File

@ -83,24 +83,21 @@
.footnote-backref {
@extend %md-icon;
position: absolute;
display: inline-block;
transform: translateX(0.5rem);
transition:
transform 0.25s 0.125s,
color 0.25s,
opacity 0.125s 0.125s;
color: $md-color-black--lighter;
font-size: 1.5625em;
opacity: 0;
vertical-align: middle;
// Hack: remove Unicode arrow for icon
&::first-letter {
font-size: 0;
}
font-size: 0;
opacity: 0;
vertical-align: text-bottom;
// Back reference icon
&::after {
&::before {
font-size: 1.6rem;
content: "keyboard_return";
}
}

View File

@ -35,6 +35,9 @@
// [screen +]: Add space for table of contents
@include break-from-device(screen) {
margin-left: 24.2rem;
// Hack: setting overflow to auto induces margin collapse which omits
// massive repaints because of the margins of the inner elements
overflow: auto;
}
// Define spacing
@ -44,6 +47,11 @@
// [screen +]: Increase spacing
@include break-from-device(screen) {
margin: 2.4rem;
// Hack: remove bottom spacing, due to margin collapse
:last-child {
margin-bottom: 0;
}
}
}

View File

@ -83,8 +83,8 @@
}
}
// Icons
&__icon {
// Icon buttons
&__button {
@extend %md-icon__button;
transition: background 0.25s;

View File

@ -48,8 +48,8 @@
.md-header-nav {
padding: 0.4rem;
// Icons
&__icon {
// Icon buttons
&__button {
@extend %md-icon__button;
position: relative;
@ -61,8 +61,13 @@
opacity: 0.7;
}
// Set correct display on image
&.md-logo img {
display: block;
}
// Hide search icon, if JavaScript is not available.
.no-js & .md-icon--search {
.no-js &.md-icon--search {
display: none;
}
@ -75,11 +80,12 @@
}
}
// [tablet -]: Hide the home icon
// [tablet -]: Hide the home icon or logo
@include break-to-device(tablet) {
// Home icon
&.md-icon--home {
// Home icon or logo
&.md-icon--home,
&.md-logo {
display: none;
}
}

View File

@ -51,8 +51,8 @@
content: "arrow_back";
}
// Hide icon by default
.md-nav__icon {
// Hide button by default
.md-nav__button {
display: none;
}
}
@ -84,8 +84,8 @@
}
}
// Icon
&__icon {
// Icon buttons
&__button {
@extend %md-icon, %md-icon__button;
// Stretch image
@ -240,7 +240,7 @@
color: $md-color-white;
// Site logo
.md-nav__icon {
.md-nav__button {
display: block;
position: absolute;
top: 0.4rem;
@ -260,7 +260,7 @@
// List of items
.md-nav__list {
flex: 1;
overflow-y: scroll;
overflow-y: auto;
}
// List item

View File

@ -265,14 +265,14 @@
// [tablet landscape +]: Header-embedded search
@include break-from-device(tablet landscape) {
@include z-depth(6);
top: 4rem;
transition: opacity 0.4s;
opacity: 0;
// Show search output in active state
[data-md-toggle="search"]:checked ~ .md-header & {
@include z-depth(6);
opacity: 1;
}
}

View File

@ -28,6 +28,7 @@
.md-sidebar {
position: relative;
width: 24.2rem;
padding: 2.4rem 0;
float: left;
overflow: visible;
@ -40,6 +41,7 @@
&[data-md-state="lock"] {
position: fixed;
top: 5.6rem;
backface-visibility: hidden;
}
// [tablet -]: Convert navigation to drawer
@ -107,27 +109,24 @@
// Wrapper for scrolling on overflow
&__scrollwrap {
margin: 2.4rem 0.4rem;
overflow-y: scroll;
max-height: 100%;
margin: 0 0.4rem;
overflow-y: auto;
// [tablet -]: Adjust margins
@include break-to-device(tablet) {
// Adjust margins for primary scrollbar
// Stretch scrollwrap for primary sidebar
.md-sidebar--primary & {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: 0;
}
}
// Limit height to window, if JavaScript is available
.js & {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
// Override native scrollbar styles
&::-webkit-scrollbar {
width: 0.4rem;

View File

@ -118,7 +118,7 @@
font-weight: 700;
list-style-type: none;
opacity: 0.75;
overflow: auto;
overflow: hidden;
// Show after the data was loaded
[data-md-state="done"] & {

View File

@ -20,7 +20,7 @@
IN THE SOFTWARE.
-->
{% import "partials/i18n.html" as i18n %}
{% import "partials/language.html" as lang %}
<!DOCTYPE html>
<html class="no-js">
@ -77,7 +77,28 @@
<!-- Block: webfonts -->
{% block fonts %}
{% include "partials/fonts.html" %}
{% if config.extra.font != "none" %}
{% set text = config.extra.get("font", {}).text | default("Roboto") %}
{% set code = config.extra.get("font", {}).code
| default("Roboto Mono") %}
{% set font = text + ':300,400,400i,700|' + code | replace(' ', '+') %}
<link rel="stylesheet" type="text/css"
href="https://fonts.googleapis.com/css?family={{ font }}" />
<style>
body, input {
font-family: "{{ text }}", "Helvetica Neue",
Helvetica, Arial, sans-serif;
}
pre, code, kbd {
font-family: "{{ code }}", "Courier New",
Courier, monospace;
}
</style>
{% endif %}
<!-- Material icons as a default iconset -->
<link rel="stylesheet" type="text/css"
href="https://fonts.googleapis.com/icon?family=Material+Icons" />
{% endblock %}
<!-- Block: stylesheets -->
@ -114,8 +135,24 @@
<body>
{% endif %}
<!-- Inline SVGs -->
{% include "partials/svgs.html" %}
<!-- Hidden container for inline SVGs -->
<svg class="md-svg">
<defs>
<!--
Check whether the repository is hosted on one of the supported code
hosting platforms (Github, Gitlab or Bitbucket) to show icon.
-->
{% set platform = config.extra.repo_icon or config.repo_url %}
{% if "github" in platform %}
{% include "assets/images/icons/github.svg" %}
{% elif "gitlab" in platform %}
{% include "assets/images/icons/gitlab.svg" %}
{% elif "bitbucket" in platform %}
{% include "assets/images/icons/bitbucket.svg" %}
{% endif %}
</defs>
</svg>
<!-- State toggles -->
<input class="md-toggle" data-md-toggle="drawer"
@ -173,7 +210,7 @@
<!-- Edit button, if URL was defined -->
{% if config.edit_uri %}
<a href="{{ page.edit_url }}"
title="{{ i18n.t('edit.link.title') }}"
title="{{ lang.t('edit.link.title') }}"
class="md-icon md-content__edit">edit</a>
{% endif %}

View File

@ -1,42 +0,0 @@
<!--
Copyright (c) 2016-2017 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.
-->
<!-- Proportional and monospaced fonts -->
{% if config.extra.font != "none" %}
{% set text = config.extra.get("font", {}).text | default("Roboto") %}
{% set code = config.extra.get("font", {}).code | default("Roboto Mono") %}
{% set font = text + ':300,400,400i,700|' + code | replace(' ', '+') %}
<link rel="stylesheet" type="text/css"
href="https://fonts.googleapis.com/css?family={{ font }}" />
<style>
body, input {
font-family: "{{ text }}", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
pre, code, kbd {
font-family: "{{ code }}", "Courier New", Courier, monospace;
}
</style>
{% endif %}
<!-- Material icons as a default iconset -->
<link rel="stylesheet" type="text/css"
href="https://fonts.googleapis.com/icon?family=Material+Icons" />

View File

@ -20,7 +20,7 @@
IN THE SOFTWARE.
-->
{% import "partials/i18n.html" as i18n %}
{% import "partials/language.html" as lang %}
<!-- Application footer -->
<footer class="md-footer">
@ -38,13 +38,13 @@
rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back
md-footer-nav__icon"></i>
md-footer-nav__button"></i>
</div>
<div class="md-flex__cell md-flex__cell--stretch
md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
{{ i18n.t('footer.previous') }}
{{ lang.t('footer.previous') }}
</span>
{{ page.previous_page.title }}
</span>
@ -61,14 +61,14 @@
md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
{{ i18n.t('footer.next') }}
{{ lang.t('footer.next') }}
</span>
{{ page.next_page.title }}
</span>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-forward
md-footer-nav__icon"></i>
md-footer-nav__button"></i>
</div>
</a>
{% endif %}

View File

@ -30,10 +30,12 @@
<!-- Link to home -->
<div class="md-flex__cell md-flex__cell--shrink">
<a href="{{ nav.homepage.url }}" title="{{ config.site_name }}"
class="md-icon
{% if not config.extra.logo %}
md-icon--home
{% endif %} md-header-nav__icon">
class="
{% if config.extra.logo %}
md-logo
{% else %}
md-icon md-icon--home
{% endif %} md-header-nav__button">
{% if config.extra.logo %}
<img src="{{ base_url }}/{{ config.extra.logo }}"
width="24" height="24" />
@ -43,7 +45,7 @@
<!-- Button to toggle drawer -->
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__icon"
<label class="md-icon md-icon--menu md-header-nav__button"
for="drawer"></label>
</div>
@ -66,7 +68,7 @@
<!-- Button to open search dialogue -->
<div class="md-flex__cell md-flex__cell--shrink">
{% block search_box %}
<label class="md-icon md-icon--search md-header-nav__icon"
<label class="md-icon md-icon--search md-header-nav__button"
for="search"></label>
<!-- Search interface -->

View File

@ -23,11 +23,12 @@
<!-- Main navigation -->
<nav class="md-nav md-nav--primary">
<label class="md-nav__title md-nav__title--site" for="drawer">
<i class="md-icon
{% if not config.extra.logo %}
md-icon--home
{% endif %}
md-nav__icon">
<i class="
{% if config.extra.logo %}
md-logo
{% else %}
md-icon md-icon--home
{% endif %} md-nav__button">
{% if config.extra.logo %}
<img src="{{ base_url }}/{{ config.extra.logo }}" />
{% endif %}

View File

@ -20,7 +20,7 @@
IN THE SOFTWARE.
-->
{% import "partials/i18n.html" as i18n %}
{% import "partials/language.html" as lang %}
<!-- Search interface -->
<div class="md-search" data-md-component="search">
@ -28,7 +28,7 @@
<div class="md-search__inner">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query"
placeholder="{{ i18n.t('search.placeholder') }}"
placeholder="{{ lang.t('search.placeholder') }}"
accesskey="s" autocapitalize="off" autocorrect="off"
autocomplete="off" spellcheck="false" />
<label class="md-icon md-search__icon" for="search"></label>

View File

@ -20,7 +20,7 @@
IN THE SOFTWARE.
-->
{% import "partials/i18n.html" as i18n %}
{% import "partials/language.html" as lang %}
<!--
Check whether the repository is hosted on one of the supported code hosting
@ -39,7 +39,7 @@
<!-- Repository containing source -->
{% block repo %}
<a href="{{ config.repo_url }}" title="{{ i18n.t('source.link.title') }}"
<a href="{{ config.repo_url }}" title="{{ lang.t('source.link.title') }}"
class="md-source" data-md-source="{{ repo_type }}">
{% if repo_type %}
<div class="md-source__icon">

View File

@ -1,38 +0,0 @@
<!--
Copyright (c) 2016-2017 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.
-->
<!-- Hidden container for inline SVGs -->
<div class="md-svg">
<!--
Check whether the repository is hosted on one of the supported code hosting
platforms (Github, Gitlab or Bitbucket) to show icon.
-->
{% set platform = config.extra.repo_icon or config.repo_url %}
{% if "github" in platform %}
{% include "assets/images/icons/github.svg" %}
{% elif "gitlab" in platform %}
{% include "assets/images/icons/gitlab.svg" %}
{% elif "bitbucket" in platform %}
{% include "assets/images/icons/bitbucket.svg" %}
{% endif %}
</div>

View File

@ -20,7 +20,7 @@
IN THE SOFTWARE.
-->
{% import "partials/i18n.html" as i18n %}
{% import "partials/language.html" as lang %}
<!-- Table of contents -->
<nav class="md-nav md-nav--secondary">
@ -38,7 +38,7 @@
<!-- Render item list -->
{% if toc_ and (toc_ | first) %}
<label class="md-nav__title" for="toc">{{ i18n.t('toc.title') }}</label>
<label class="md-nav__title" for="toc">{{ lang.t('toc.title') }}</label>
<ul class="md-nav__list" data-md-scrollfix>
{% for toc_item in toc_ %}
{% include "partials/toc-item.html" %}