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

Documentation

Browse Source
This commit is contained in:
squidfunk 2023-11-04 08:37:31 +01:00
parent 87d69a95b8
commit fabc9bd6b8
No known key found for this signature in database
GPG Key ID: 5ED40BC4F9C436DF
2 changed files with 12 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
docs/reference/icons-emojis.md
View File

@ -113,16 +113,16 @@ styles], it's always recommended to add an [additional style sheet] and move
declarations into dedicated CSS classes:
<style>
.twitter {
color: #1DA1F2;
.youtube {
color: #EE0F0F;
}
</style>
=== ":octicons-file-code-16: `docs/stylesheets/extra.css`"
``` css
.twitter {
color: #1DA1F2;
.youtube {
color: #EE0F0F;
}
```
@ -136,12 +136,12 @@ declarations into dedicated CSS classes:
After applying the customization, add the CSS class to the icon shortcode:
``` markdown title="Icon with color"
:fontawesome-brands-twitter:{ .twitter }
:fontawesome-brands-youtube:{ .youtube }
```
<div class="result" markdown>
:fontawesome-brands-twitter:{ .twitter }
:fontawesome-brands-youtube:{ .youtube }
</div>
@ -211,7 +211,7 @@ reference any icon that's [bundled with the theme][icon search] with Jinja's
``` html
<span class="twemoji">
{% include ".icons/fontawesome/brands/twitter.svg" %} <!-- (1)! -->
{% include ".icons/fontawesome/brands/youtube.svg" %} <!-- (1)! -->
</span>
```
@ -219,7 +219,7 @@ reference any icon that's [bundled with the theme][icon search] with Jinja's
click on the shortcode to copy it to your clipboard:
<div class="mdx-iconsearch" data-mdx-component="iconsearch">
<input class="md-input md-input--stretch mdx-iconsearch__input" placeholder="Search icon" data-mdx-component="iconsearch-query" value="brands twitter" />
<input class="md-input md-input--stretch mdx-iconsearch__input" placeholder="Search icon" data-mdx-component="iconsearch-query" value="brands youtube" />
<div class="mdx-iconsearch-result" data-mdx-component="iconsearch-result" data-mdx-mode="file">
<div class="mdx-iconsearch-result__meta"></div>
<ol class="mdx-iconsearch-result__list"></ol>

8
docs/setup/setting-up-the-footer.md
View File

@ -57,18 +57,18 @@ The following properties are available for each link:
This property must contain a valid path to any icon bundled with the theme,
or the build will not succeed. Some popular choices:
* :fontawesome-brands-github: – `fontawesome/brands/github`
* :fontawesome-brands-gitlab: – `fontawesome/brands/gitlab`
* :fontawesome-brands-x-twitter: – `fontawesome/brands/x-twitter`
* :fontawesome-brands-mastodon: – `fontawesome/brands/mastodon`
<small>automatically adds [`rel=me`][rel=me]</small>
* :fontawesome-brands-twitter: – `fontawesome/brands/twitter`
* :fontawesome-brands-github: – `fontawesome/brands/github`
* :fontawesome-brands-docker: – `fontawesome/brands/docker`
* :fontawesome-brands-facebook: – `fontawesome/brands/facebook`
* :fontawesome-brands-medium: – `fontawesome/brands/medium`
* :fontawesome-brands-instagram: – `fontawesome/brands/instagram`
* :fontawesome-brands-linkedin: – `fontawesome/brands/linkedin`
* :fontawesome-brands-pied-piper-alt: – `fontawesome/brands/pied-piper-alt`
* :fontawesome-brands-slack: – `fontawesome/brands/slack`
* :fontawesome-brands-discord: – `fontawesome/brands/discord`
* :fontawesome-brands-pied-piper-alt: – `fontawesome/brands/pied-piper-alt`
<!-- md:option social.link -->