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

Refactored icon options for mkdocs.yml

Browse Source
This commit is contained in:
squidfunk 2020-02-27 11:37:02 +01:00
parent f5222e03f3
commit eaeac798b1
18 changed files with 64 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
material/assets/javascripts/bundle.4333d4e1.min.js → material/assets/javascripts/bundle.f865046f.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
material/assets/javascripts/bundle.4333d4e1.min.js.map → material/assets/javascripts/bundle.f865046f.min.js.map
View File

File diff suppressed because one or more lines are too long

6
material/assets/manifest.json
View File

@ -1,8 +1,8 @@
{
"assets/javascripts/bundle.js": "assets/javascripts/bundle.4333d4e1.min.js",
"assets/javascripts/bundle.js.map": "assets/javascripts/bundle.4333d4e1.min.js.map",
"assets/javascripts/bundle.js": "assets/javascripts/bundle.f865046f.min.js",
"assets/javascripts/bundle.js.map": "assets/javascripts/bundle.f865046f.min.js.map",
"assets/javascripts/worker/search.js": "assets/javascripts/worker/search.926ffd9e.min.js",
"assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.926ffd9e.min.js.map",
"assets/stylesheets/main.scss": "assets/stylesheets/main.d780ead5.min.css",
"assets/stylesheets/main.scss": "assets/stylesheets/main.f8a03d30.min.css",
"assets/stylesheets/palette.scss": "assets/stylesheets/palette.f5f04e6f.min.css"
}

1
material/assets/stylesheets/main.d780ead5.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
material/assets/stylesheets/main.f8a03d30.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

4
material/base.html
View File

@ -43,7 +43,7 @@
{% endif %}
{% endblock %}
{% block styles %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.d780ead5.min.css' | url }}">
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.f8a03d30.min.css' | url }}">
{% if palette.primary or palette.accent %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/palette.f5f04e6f.min.css' | url }}">
{% endif %}
@ -195,7 +195,7 @@
{% endblock %}
</div>
{% block scripts %}
<script src="{{ 'assets/javascripts/bundle.4333d4e1.min.js' | url }}"></script>
<script src="{{ 'assets/javascripts/bundle.f865046f.min.js' | url }}"></script>
{%- set translations = {} -%}
{%- for key in [
"clipboard.copy",

15
material/mkdocs_theme.yml
View File

@ -56,14 +56,19 @@ font:
# Fixed-width font for code listings
code: Roboto Mono
# From Material 5.x on, icons are inlined into the HTML and CSS as SVGs. Some
# icons that are part of the HTML can be configured and replaced
icon:
# Shown if no logo is set
logo: .icons/material/book-open-variant
# Repository icon
repo: .icons/fontawesome/git-alt
# Favicon to be rendered
favicon: assets/images/favicon.png
# The logo of the documentation shown in the header and navigation can either
# be a Material Icon ligature (see https://material.io/icons/) or an image URL
logo:
icon: "\uE80C"
# Material includes the search in the header as a partial, not as a separate
# template, so it's correct that search.html is missing
include_search_page: false

4
material/partials/footer.html
View File

@ -8,7 +8,7 @@
<nav class="md-footer-nav__inner md-grid">
{% if page.previous_page %}
<a href="{{ page.previous_page.url | url }}" title="{{ page.previous_page.title | striptags }}" class="md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-icon md-icon__button">
<div class="md-footer-nav__button md-icon">
{% include ".icons/material/arrow-left.svg" %}
</div>
<div class="md-footer-nav__title">
@ -31,7 +31,7 @@
{{ page.next_page.title }}
</div>
</div>
<div class="md-icon md-icon__button">
<div class="md-footer-nav__button md-icon">
{% include ".icons/material/arrow-right.svg" %}
</div>
</a>

12
material/partials/header.html
View File

@ -4,14 +4,14 @@
<header class="md-header" data-md-component="header">
<nav class="md-header-nav md-grid">
<a href="{{ config.site_url | default(nav.homepage.url, true) | url }}" title="{{ config.site_name }}" aria-label="{{ config.site_name }}" class="md-header-nav__button md-logo">
{% if config.theme.logo.icon %}
{% include ".icons/" ~ config.theme.logo.icon ~ ".svg" %}
{% else %}
{% if config.theme.logo %}
<img src="{{ config.theme.logo | url }}" alt="logo">
{% else %}
{% include ".icons/" ~ config.theme.icon.logo ~ ".svg" %}
{% endif %}
</a>
<label class="md-header-nav__button md-icon md-icon__button" for="__drawer">
{% include ".icons/material/menu.svg" %}
<label class="md-header-nav__button md-icon" for="__drawer">
{% include ".icons/material/menu" ~ ".svg" %}
</label>
<div class="md-header-nav__title" data-md-component="header-title">
<div class="md-header-nav__ellipsis md-ellipsis">
@ -32,7 +32,7 @@
</div>
</div>
{% if "search" in config["plugins"] %}
<label class="md-header-nav__button md-icon md-icon__button" for="__search">
<label class="md-header-nav__button md-icon" for="__search">
{% include ".icons/material/magnify.svg" %}
</label>
{% include "partials/search.html" %}

5
material/partials/source.html
View File

@ -4,10 +4,7 @@
{% import "partials/language.html" as lang with context %}
<a href="{{ config.repo_url }}" title="{{ lang.t('source.link.title') }}" class="md-source">
<div class="md-source__icon md-icon">
{% set repo_icon = config.extra.repo_icon | default(
"fontawesome/brands/git-alt"
) %}
{% include ".icons/" ~ repo_icon ~ ".svg" %}
{% include ".icons/" ~ config.theme.icon.repo ~ ".svg" %}
</div>
<div class="md-source__repository">
{{ config.repo_name }}

13
mkdocs.yml
View File

@ -56,6 +56,9 @@ theme:
font:
text: Roboto
code: Roboto Mono
icon:
logo: material/book-open-variant
repo: fontawesome/brands/git-alt
favicon: assets/favicon.png
logo: assets/images/icon.svg
@ -68,13 +71,13 @@ plugins:
# Customization
extra:
social:
- icon: brands/github-alt
- icon: fontawesome/brands/github-alt
link: https://github.com/squidfunk
- icon: brands/twitter
- icon: fontawesome/brands/twitter
link: https://twitter.com/squidfunk
- icon: brands/linkedin
- icon: fontawesome/brands/linkedin
link: https://www.linkedin.com/in/squidfunk/
- icon: brands/instagram
- icon: fontawesome/brands/instagram
link: https://instagram.com/squidfunk
# Extensions
@ -96,6 +99,8 @@ markdown_extensions:
- pymdownx.emoji:
emoji_index: !!python/name:pymdownx.emoji.twemoji
emoji_generator: !!python/name:pymdownx.emoji.to_svg
# - pymdownx.highlight:
# linenums_style: pymdownx-inline
- pymdownx.inlinehilite
- pymdownx.keys
- pymdownx.magiclink:

8
src/assets/stylesheets/base/_icons.scss
View File

@ -27,14 +27,6 @@
// Icon
.md-icon {
// Icon with button spacing
&__button {
display: inline-block;
margin: px2rem(4px);
padding: px2rem(8px);
cursor: pointer;
}
// SVG defaults
svg {
display: block;

6
src/assets/stylesheets/layout/_footer.scss
View File

@ -116,6 +116,12 @@
line-height: px2rem(48px);
}
// Link button
&__button {
margin: px2rem(4px);
padding: px2rem(8px);
}
// Link direction
&__direction {
position: absolute;

3
src/assets/stylesheets/layout/_header.scss
View File

@ -72,7 +72,10 @@
// Icon buttons
&__button {
position: relative;
margin: px2rem(4px);
padding: px2rem(8px);
transition: opacity 250ms;
cursor: pointer;
z-index: 1;
// Adjust for right-to-left languages

15
src/mkdocs_theme.yml
View File

@ -56,14 +56,19 @@ font:
# Fixed-width font for code listings
code: Roboto Mono
# From Material 5.x on, icons are inlined into the HTML and CSS as SVGs. Some
# icons that are part of the HTML can be configured and replaced
icon:
# Shown if no logo is set
logo: .icons/material/book-open-variant
# Repository icon
repo: .icons/fontawesome/git-alt
# Favicon to be rendered
favicon: assets/images/favicon.png
# The logo of the documentation shown in the header and navigation can either
# be a Material Icon ligature (see https://material.io/icons/) or an image URL
logo:
icon: "\uE80C"
# Material includes the search in the header as a partial, not as a separate
# template, so it's correct that search.html is missing
include_search_page: false

4
src/partials/footer.html
View File

@ -38,7 +38,7 @@
class="md-footer-nav__link md-footer-nav__link--prev"
rel="prev"
>
<div class="md-icon md-icon__button">
<div class="md-footer-nav__button md-icon">
{% include ".icons/material/arrow-left.svg" %}
</div>
<div class="md-footer-nav__title">
@ -68,7 +68,7 @@
{{ page.next_page.title }}
</div>
</div>
<div class="md-icon md-icon__button">
<div class="md-footer-nav__button md-icon">
{% include ".icons/material/arrow-right.svg" %}
</div>
</a>

12
src/partials/header.html
View File

@ -33,17 +33,17 @@
aria-label="{{ config.site_name }}"
class="md-header-nav__button md-logo"
>
{% if config.theme.logo.icon %}
{% include ".icons/" ~ config.theme.logo.icon ~ ".svg" %}
{% else %}
{% if config.theme.logo %}
<img src="{{ config.theme.logo | url }}" alt="logo" />
{% else %}
{% include ".icons/" ~ config.theme.icon.logo ~ ".svg" %}
{% endif %}
</a>
<label
class="md-header-nav__button md-icon md-icon__button"
class="md-header-nav__button md-icon"
for="__drawer"
>
{% include ".icons/material/menu.svg" %}
{% include ".icons/material/menu" ~ ".svg" %}
</label>
<!-- Header title -->
@ -69,7 +69,7 @@
<!-- Button to open search dialogue -->
{% if "search" in config["plugins"] %}
<label
class="md-header-nav__button md-icon md-icon__button"
class="md-header-nav__button md-icon"
for="__search"
>
{% include ".icons/material/magnify.svg" %}

5
src/partials/source.html
View File

@ -29,10 +29,7 @@
class="md-source"
>
<div class="md-source__icon md-icon">
{% set repo_icon = config.extra.repo_icon | default(
"fontawesome/brands/git-alt"
) %}
{% include ".icons/" ~ repo_icon ~ ".svg" %}
{% include ".icons/" ~ config.theme.icon.repo ~ ".svg" %}
</div>
<div class="md-source__repository">
{{ config.repo_name }}