1
0
mirror of https://github.com/squidfunk/mkdocs-material.git synced 2024-12-18 02:15:56 +01:00
mkdocs-material/src/base.html

383 lines
12 KiB
HTML

<!--
Copyright (c) 2016-2022 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.
-->
{% import "partials/language.html" as lang with context %}
<!doctype html>
<html lang="{{ lang.t('language') }}" class="no-js">
<head>
<!-- Meta tags -->
{% block site_meta %}
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<!-- Page description -->
{% if page.meta and page.meta.description %}
<meta name="description" content="{{ page.meta.description }}" />
{% elif config.site_description %}
<meta name="description" content="{{ config.site_description }}" />
{% endif %}
<!-- Page author -->
{% if page.meta and page.meta.author %}
<meta name="author" content="{{ page.meta.author }}" />
{% elif config.site_author %}
<meta name="author" content="{{ config.site_author }}" />
{% endif %}
<!-- Canonical -->
{% if page.canonical_url %}
<link rel="canonical" href="{{ page.canonical_url }}" />
{% endif %}
<!-- Favicon -->
<link rel="icon" href="{{ config.theme.favicon | url }}" />
<!-- Generator banner -->
<meta
name="generator"
content="mkdocs-{{ mkdocs_version }}, $md-name$-$md-version$"
/>
{% endblock %}
<!-- Site title -->
{% block htmltitle %}
{% if page.meta and page.meta.title %}
<title>{{ page.meta.title }} - {{ config.site_name }}</title>
{% elif page.title and not page.is_homepage %}
<title>{{ page.title | striptags }} - {{ config.site_name }}</title>
{% else %}
<title>{{ config.site_name }}</title>
{% endif %}
{% endblock %}
<!-- Theme-related style sheets -->
{% block styles %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.css' | url }}" />
<!-- Extra color palette -->
{% if config.theme.palette %}
{% set palette = config.theme.palette %}
<link
rel="stylesheet"
href="{{ 'assets/stylesheets/palette.css' | url }}"
/>
<!-- Theme-color meta tag for Android -->
{% if palette.primary %}
{% import "partials/palette.html" as map %}
{% set primary = map.primary(
palette.primary | replace(" ", "-") | lower
) %}
<meta name="theme-color" content="{{ primary }}" />
{% endif %}
{% endif %}
<!-- Custom icons -->
{% include "partials/icons.html" %}
{% endblock %}
<!-- JavaScript libraries -->
{% block libs %}{% endblock %}
<!-- Webfonts -->
{% block fonts %}
<!-- Load fonts from Google -->
{% if config.theme.font != false %}
{% set text = config.theme.font.text | d("Roboto", true) %}
{% set code = config.theme.font.code | d("Roboto Mono", true) %}
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css?family={{
text | replace(' ', '+') + ':300,300i,400,400i,700,700i%7C' +
code | replace(' ', '+') + ':400,400i,700,700i'
}}&display=fallback"
/>
<style>
:root {
--md-text-font: "{{ text }}";
--md-code-font: "{{ code }}";
}
</style>
{% endif %}
{% endblock %}
<!-- Custom style sheets -->
{% for path in config["extra_css"] %}
<link rel="stylesheet" href="{{ path | url }}" />
{% endfor %}
<!-- Helper functions for inline scripts -->
{% include "partials/javascripts/base.html" %}
<!-- Analytics -->
{% block analytics %}
{% include "partials/integrations/analytics.html" %}
{% endblock %}
<!-- Custom front matter -->
{% block extrahead %}{% endblock %}
</head>
<!-- Set text direction and color palette, if defined -->
{% set direction = config.theme.direction or lang.t('direction') %}
{% if config.theme.palette %}
{% set palette = config.theme.palette %}
{% if not palette is mapping %}
{% set palette = palette | first %}
{% endif %}
{% set scheme = palette.scheme | replace(" ", "-") | lower %}
{% set primary = palette.primary | replace(" ", "-") | lower %}
{% set accent = palette.accent | replace(" ", "-") | lower %}
<body
dir="{{ direction }}"
data-md-color-scheme="{{ scheme }}"
data-md-color-primary="{{ primary }}"
data-md-color-accent="{{ accent }}"
>
{% else %}
<body dir="{{ direction }}">
{% endif %}
{% set features = config.theme.features or [] %}
<!-- User preference: color palette -->
{% if not config.theme.palette is mapping %}
{% include "partials/javascripts/palette.html" %}
{% endif %}
<!--
State toggles - we need to set autocomplete="off" in order to reset the
drawer on back button invocation in some browsers
-->
<input
class="md-toggle"
data-md-toggle="drawer"
type="checkbox"
id="__drawer"
autocomplete="off"
/>
<input
class="md-toggle"
data-md-toggle="search"
type="checkbox"
id="__search"
autocomplete="off"
/>
<!-- Overlay for expanded drawer -->
<label class="md-overlay" for="__drawer"></label>
<!-- Skip to content -->
<div data-md-component="skip">
{% if page.toc | first is defined %}
{% set skip = page.toc | first %}
<a href="{{ skip.url | url }}" class="md-skip">
{{ lang.t('skip.link.title') }}
</a>
{% endif %}
</div>
<!-- Announcement bar -->
<div data-md-component="announce">
{% if self.announce() %}
<aside class="md-banner">
<div class="md-banner__inner md-grid md-typeset">
{% block announce %}{% endblock %}
</div>
</aside>
{% endif %}
</div>
<!-- Version warning -->
{% if config.extra.version %}
<div data-md-component="outdated" hidden>
<aside class="md-banner md-banner--warning">
{% if self.outdated() %}
<div class="md-banner__inner md-grid md-typeset">
{% block outdated %}{% endblock %}
</div>
{% include "partials/javascripts/outdated.html" %}
{% endif %}
</aside>
</div>
{% endif %}
<!-- Header -->
{% block header %}
{% include "partials/header.html" %}
{% endblock %}
<!-- Container -->
<div class="md-container" data-md-component="container">
<!-- Hero teaser -->
{% block hero %}{% endblock %}
<!-- Navigation tabs (collapsing) -->
{% block tabs %}
{% if not "navigation.tabs.sticky" in features %}
{% if "navigation.tabs" in features %}
{% include "partials/tabs.html" %}
{% endif %}
{% endif %}
{% endblock %}
<!-- Main area -->
<main class="md-main" data-md-component="main">
<div class="md-main__inner md-grid">
<!-- Sidebars -->
{% block site_nav %}
<!-- Navigation -->
{% if nav %}
{% if page.meta and page.meta.hide %}
{% set hidden = "hidden" if "navigation" in page.meta.hide %}
{% endif %}
<div
class="md-sidebar md-sidebar--primary"
data-md-component="sidebar"
data-md-type="navigation"
{{ hidden }}
>
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
{% include "partials/nav.html" %}
</div>
</div>
</div>
{% endif %}
<!-- Table of contents -->
{% if not "toc.integrate" in features %}
{% if page.meta and page.meta.hide %}
{% set hidden = "hidden" if "toc" in page.meta.hide %}
{% endif %}
<div
class="md-sidebar md-sidebar--secondary"
data-md-component="sidebar"
data-md-type="toc"
{{ hidden }}
>
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
{% include "partials/toc.html" %}
</div>
</div>
</div>
{% endif %}
{% endblock %}
<!-- Page content -->
<div class="md-content" data-md-component="content">
<article class="md-content__inner md-typeset">
{% block content %}
{% include "partials/content.html" %}
{% endblock %}
</article>
<!-- User preference: content -->
{% include "partials/javascripts/content.html" %}
</div>
</div>
<!-- Back-to-top button -->
{% if "navigation.top" in features %}
<a
href="#"
class="md-top md-icon"
data-md-component="top"
hidden
>
{% include ".icons/material/arrow-up.svg" %}
{{ lang.t('top.title') }}
</a>
{% endif %}
</main>
<!-- Footer -->
{% block footer %}
{% include "partials/footer.html" %}
{% endblock %}
</div>
<!-- Dialog -->
<div class="md-dialog" data-md-component="dialog">
<div class="md-dialog__inner md-typeset"></div>
</div>
<!-- Theme-related configuration -->
{% block config %}
{%- set app = {
"base": base_url,
"features": features,
"translations": {},
"search": "assets/javascripts/workers/search.js" | url
} -%}
<!-- Versioning -->
{%- if config.extra.version -%}
{%- set _ = app.update({ "version": config.extra.version }) -%}
{%- endif -%}
<!-- Translations -->
{%- set translations = app.translations -%}
{%- for key in [
"clipboard.copy",
"clipboard.copied",
"search.config.lang",
"search.config.pipeline",
"search.config.separator",
"search.placeholder",
"search.result.placeholder",
"search.result.none",
"search.result.one",
"search.result.other",
"search.result.more.one",
"search.result.more.other",
"search.result.term.missing",
"select.version.title"
] -%}
{%- set _ = translations.update({ key: lang.t(key) }) -%}
{%- endfor -%}
<!-- Configuration -->
<script id="__config" type="application/json">
{{- app | tojson -}}
</script>
{% endblock %}
<!-- Theme-related JavaScript -->
{% block scripts %}
<script src="{{ 'assets/javascripts/bundle.js' | url }}"></script>
<!-- Custom JavaScript -->
{% for path in config["extra_javascript"] %}
<script src="{{ path | url }}"></script>
{% endfor %}
{% endblock %}
</body>
</html>