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

Allow overriding all inlined icons via yaml only

Browse Source
This commit is contained in:
Nejc Habjan 2023-03-27 17:24:56 +02:00
parent 5f431ec921
commit 4fccd06b78
10 changed files with 44 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
material/base.html
View File

@ -108,7 +108,8 @@
<div class="md-banner__inner md-grid md-typeset">
{% if "announce.dismiss" in features %}
<button class="md-banner__button md-icon" aria-label="{{ lang.t('announce.dismiss') }}">
{% include ".icons/material/close.svg" %}
{% set icon = config.theme.icon.close or "material/close" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</button>
{% endif %}
{% block announce %}{% endblock %}
@ -184,7 +185,8 @@
</div>
{% if "navigation.top" in features %}
<button type="button" class="md-top md-icon" data-md-component="top" hidden>
{% include ".icons/material/arrow-up.svg" %}
{% set icon = config.theme.icon.top or "material/arrow-up" %}
{% include ".icons/" ~ icon ~ ".svg" %}
{{ lang.t("top") }}
</button>
{% endif %}

4
material/mkdocs_theme.yml
View File

@ -48,8 +48,8 @@ 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
# From Material 5.x on, icons are inlined into the HTML and CSS as SVGs.
# Icons that are part of the HTML can be configured and replaced
icon:
# Favicon to be rendered

6
material/partials/footer.html
View File

@ -12,7 +12,8 @@
{% set direction = lang.t("footer.previous") %}
<a href="{{ page.previous_page.url | url }}" class="md-footer__link md-footer__link--prev" aria-label="{{ direction }}: {{ page.previous_page.title | e }}" rel="prev">
<div class="md-footer__button md-icon">
{% include ".icons/material/arrow-left.svg" %}
{% set icon = config.theme.icon.previous or "material/arrow-left" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</div>
<div class="md-footer__title">
<span class="md-footer__direction">
@ -36,7 +37,8 @@
</div>
</div>
<div class="md-footer__button md-icon">
{% include ".icons/material/arrow-right.svg" %}
{% set icon = config.theme.icon.next or "material/arrow-right" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</div>
</a>
{% endif %}

6
material/partials/header.html
View File

@ -13,7 +13,8 @@
{% include "partials/logo.html" %}
</a>
<label class="md-header__button md-icon" for="__drawer">
{% include ".icons/material/menu" ~ ".svg" %}
{% set icon = config.theme.icon.menu or "material/menu" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</label>
<div class="md-header__title" data-md-component="header-title">
<div class="md-header__ellipsis">
@ -69,7 +70,8 @@
{% endif %}
{% if "material/search" in config.plugins %}
<label class="md-header__button md-icon" for="__search">
{% include ".icons/material/magnify.svg" %}
{% set icon = config.theme.icon.search or "material/magnify" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</label>
{% include "partials/search.html" %}
{% endif %}

12
material/partials/search.html
View File

@ -7,17 +7,21 @@
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" aria-label="{{ lang.t('search.placeholder') }}" placeholder="{{ lang.t('search.placeholder') }}" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="search-query" required>
<label class="md-search__icon md-icon" for="__search">
{% include ".icons/material/magnify.svg" %}
{% include ".icons/material/arrow-left.svg" %}
{% set icon = config.theme.icon.search or "material/magnify" %}
{% include ".icons/" ~ icon ~ ".svg" %}
{% set icon = config.theme.icon.previous or "material/arrow-left" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</label>
<nav class="md-search__options" aria-label="{{ lang.t('search') }}">
{% if "search.share" in features %}
<a href="javascript:void(0)" class="md-search__icon md-icon" title="{{ lang.t('search.share') }}" aria-label="{{ lang.t('search.share') }}" data-clipboard data-clipboard-text="" data-md-component="search-share" tabindex="-1">
{% include ".icons/material/share-variant.svg" %}
{% set icon = config.theme.icon.share or "material/share-variant" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</a>
{% endif %}
<button type="reset" class="md-search__icon md-icon" title="{{ lang.t('search.reset') }}" aria-label="{{ lang.t('search.reset') }}" tabindex="-1">
{% include ".icons/material/close.svg" %}
{% set icon = config.theme.icon.close or "material/close" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</button>
</nav>
{% if "search.suggest" in features %}

6
src/base.html
View File

@ -223,7 +223,8 @@
class="md-banner__button md-icon"
aria-label="{{ lang.t('announce.dismiss') }}"
>
{% include ".icons/material/close.svg" %}
{% set icon = config.theme.icon.close or "material/close" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</button>
{% endif %}
@ -340,7 +341,8 @@
data-md-component="top"
hidden
>
{% include ".icons/material/arrow-up.svg" %}
{% set icon = config.theme.icon.top or "material/arrow-up" %}
{% include ".icons/" ~ icon ~ ".svg" %}
{{ lang.t("top") }}
</button>
{% endif %}

4
src/mkdocs_theme.yml
View File

@ -48,8 +48,8 @@ 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
# From Material 5.x on, icons are inlined into the HTML and CSS as SVGs.
# Icons that are part of the HTML can be configured and replaced
icon:
# Favicon to be rendered

6
src/partials/footer.html
View File

@ -45,7 +45,8 @@
rel="prev"
>
<div class="md-footer__button md-icon">
{% include ".icons/material/arrow-left.svg" %}
{% set icon = config.theme.icon.previous or "material/arrow-left" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</div>
<div class="md-footer__title">
<span class="md-footer__direction">
@ -76,7 +77,8 @@
</div>
</div>
<div class="md-footer__button md-icon">
{% include ".icons/material/arrow-right.svg" %}
{% set icon = config.theme.icon.next or "material/arrow-right" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</div>
</a>
{% endif %}

6
src/partials/header.html
View File

@ -48,7 +48,8 @@
<!-- Button to open drawer -->
<label class="md-header__button md-icon" for="__drawer">
{% include ".icons/material/menu" ~ ".svg" %}
{% set icon = config.theme.icon.menu or "material/menu" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</label>
<!-- Header title -->
@ -138,7 +139,8 @@
<!-- Button to open search modal -->
{% if "material/search" in config.plugins %}
<label class="md-header__button md-icon" for="__search">
{% include ".icons/material/magnify.svg" %}
{% set icon = config.theme.icon.search or "material/magnify" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</label>
<!-- Search interface -->

12
src/partials/search.html
View File

@ -43,8 +43,10 @@
<!-- Button to open search -->
<label class="md-search__icon md-icon" for="__search">
{% include ".icons/material/magnify.svg" %}
{% include ".icons/material/arrow-left.svg" %}
{% set icon = config.theme.icon.search or "material/magnify" %}
{% include ".icons/" ~ icon ~ ".svg" %}
{% set icon = config.theme.icon.previous or "material/arrow-left" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</label>
<!-- Search options -->
@ -65,7 +67,8 @@
data-md-component="search-share"
tabindex="-1"
>
{% include ".icons/material/share-variant.svg" %}
{% set icon = config.theme.icon.share or "material/share-variant" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</a>
{% endif %}
@ -77,7 +80,8 @@
aria-label="{{ lang.t('search.reset') }}"
tabindex="-1"
>
{% include ".icons/material/close.svg" %}
{% set icon = config.theme.icon.close or "material/close" %}
{% include ".icons/" ~ icon ~ ".svg" %}
</button>
</nav>