Updated documentation

Author: squidfunk

docs/reference/admonitions.md

@@ -299,95 +299,95 @@ will stretch to the full width of the viewport, e.g. on mobile viewports.
 Following is a list of type qualifiers provided by Material for MkDocs, whereas
 the default type, and thus fallback for unknown type qualifiers, is `note`:
 
-`note`{ #note }, ~~`seealso`~~ [^1]
+`note`{ #type-note }, ~~`seealso`~~ [^1]
 
 :   !!! note
 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et
         euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo
         purus auctor massa, nec semper lorem quam in massa.
 
-`abstract`{ #abstract }, `summary`, `tldr`
+`abstract`{ #type-abstract }, `summary`, `tldr`
 
 :   !!! abstract
 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et
         euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo
         purus auctor massa, nec semper lorem quam in massa.
 
-`info`{ #info }, `todo`
+`info`{ #type-info }, `todo`
 
 :   !!! info
 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et
         euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo
         purus auctor massa, nec semper lorem quam in massa.
 
-`tip`{ #tip }, `hint`, `important`
+`tip`{ #type-tip }, `hint`, `important`
 
 :   !!! tip
 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et
         euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo
         purus auctor massa, nec semper lorem quam in massa.
 
-`success`{ #success }, `check`, `done`
+`success`{ #type-success }, `check`, `done`
 
 :   !!! success
 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et
         euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo
         purus auctor massa, nec semper lorem quam in massa.
 
-`question`{ #question }, `help`, `faq`
+`question`{ #type-question }, `help`, `faq`
 
 :   !!! question
 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et
         euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo
         purus auctor massa, nec semper lorem quam in massa.
 
-`warning`{ #warning }, `caution`, `attention`
+`warning`{ #type-warning }, `caution`, `attention`
 
 :   !!! warning
 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et
         euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo
         purus auctor massa, nec semper lorem quam in massa.
 
-`failure`{ #failure }, `fail`, `missing`
+`failure`{ #type-failure }, `fail`, `missing`
 
 :   !!! failure
 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et
         euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo
         purus auctor massa, nec semper lorem quam in massa.
 
-`danger`{ #danger }, `error`
+`danger`{ #type-danger }, `error`
 
 :   !!! danger
 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et
         euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo
         purus auctor massa, nec semper lorem quam in massa.
 
-`bug`{ #bug }
+`bug`{ #type-bug }
 
 :   !!! bug
 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et
         euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo
         purus auctor massa, nec semper lorem quam in massa.
 
-`example`{ #example }
+`example`{ #type-example }
 
 :   !!! example
 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et
         euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo
         purus auctor massa, nec semper lorem quam in massa.
 
-`quote`{ #quote }, `cite`
+`quote`{ #type-quote }, `cite`
 
 :   !!! quote
 

docs/reference/images.md

@@ -120,16 +120,10 @@ _Result_:
 
 Modern browsers provide [native support for lazy-loading images][lazy-loading]
 through the `loading=lazy` directive, which degrades to eager-loading in
-browsers without support
-
-_Example_:
+browsers without support:
 
 ``` markdown
 ![Placeholder](https://dummyimage.com/600x400/eee/aaa){ loading=lazy }
 ```
 
-_Result_:
-
-![Placeholder](https://dummyimage.com/600x400/f5f5f5/aaaaaa&text=–%20Image%20–){ loading=lazy width=300 }
-
   [lazy-loading]: https://caniuse.com/#feat=loading-lazy-attr

docs/setup/changing-the-colors.md

@@ -312,6 +312,9 @@ in the [color schemes][palette.scheme] section:
 === ":octicons-file-code-16: mkdocs.yml"
 
     ``` yaml
+    theme:
+      palette:
+        scheme: youtube
     extra_css:
       - stylesheets/extra.css
     ```

docs/setup/changing-the-language.md

@@ -132,12 +132,12 @@ The following properties must be set for each alternate language:
     the `hreflang` attribute of the link, improving discoverability via search
     engines.
 
-[![Language selector]][Language selector]
+[![Language selector preview]][Language selector preview]
 
   [alternate support]: https://github.com/squidfunk/mkdocs-material/releases/tag/7.0.0
   [site_url]: https://www.mkdocs.org/user-guide/configuration/#site_url
   [ISO 639-1 language code]: https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes
-  [Language selector]: ../assets/screenshots/language-selection.png
+  [Language selector preview]: ../assets/screenshots/language-selection.png
 
 ### Directionality
 
@@ -180,23 +180,31 @@ Click on a tile to change the directionality:
 
 If you want to customize some of the translations for a language, just follow
 the guide on [theme extension] and create a new partial in the `overrides`
-folder. Then import the [translations] of your language as a fallback and only
+folder. Then, import the [translations] of the language as a fallback and only
 adjust the ones you want to override:
 
 === ":octicons-file-code-16: partials/languages/custom.html"
 
     ``` html
-    <!-- Import translations for your language as fallback -->
-    {% import "partials/languages/" ~ config.theme.language ~ ".html" as fallback %}
+    <!-- Import translations for language and fallback -->
+    {% import "partials/languages/de.html" as language %}
+    {% import "partials/languages/en.html" as fallback %} <!-- (1) -->
+
+    <!-- Define custom translations -->
     {% macro override(key) %}{{ {
-      "toc.title": "On this page" <!-- (1) -->
+      "toc.title": "Auf dieser Seite" <!-- (2) -->
     }[key] }}{% endmacro %}
 
     <!-- Re-export translations -->
-    {% macro t(key) %}{{ override(key) or fallback.t(key) }}{% endmacro %}
+    {% macro t(key) %}{{
+      override(key) or language(key) or fallback.t(key)
+    }}{% endmacro %}
     ```
 
-    1.  Check the [list of available languages], pick the translation you want
+    1.  Note that `en` must always be used as a fallback language, as it's the
+        default theme language.
+
+    2.  Check the [list of available languages], pick the translation you want
         to override for your language and add them here.
 
 === ":octicons-file-code-16: mkdocs.yml"

docs/setup/extensions/python-markdown-extensions.md

@@ -154,7 +154,7 @@ markdown_extensions:
 
 The following configuration options are supported:
 
-`mode`{ #mode }
+`mode`{ #critic-mode }
 
 :   :octicons-milestone-24: Default: `view` – This option defines how the markup 
     should be parsed, i.e. whether to just `view` all suggested changes, or
@@ -265,7 +265,7 @@ The following configuration options are supported:
 
 :   :octicons-milestone-24: Default: _none_ – This option allows to list folders
     with additional icon sets to be used in Markdown or `mkdocs.yml`, which is 
-    explained in more detail in the [icon customization guide].
+    explained in more detail in the [icon customization guide]:
 
     ``` yaml
     markdown_extensions:
@@ -318,7 +318,7 @@ markdown_extensions:
 
 The following configuration options are supported:
 
-`use_pygments`{ #use-pygments }
+`use_pygments`{ #highlight-use-pygments }
 
 :   :octicons-milestone-24: Default: `true` – This option allows to control
     whether highlighting should be carried out during build time using
@@ -365,7 +365,7 @@ The following configuration options are supported:
 
         Note that [Highlight.js] has no affiliation with the Highlight extension.
 
-`linenums`{ #linenums }
+`linenums`{ #highlight-linenums }
 
 :   :octicons-milestone-24: Default: `false` – This option will add line numbers
     to _all_ code blocks. If you wish to add line numbers to _some_, but not all
@@ -379,7 +379,7 @@ The following configuration options are supported:
           linenums: true
     ```
 
-`linenums_style`{ #linenums-style }
+`linenums_style`{ #highlight-linenums-style }
 
 :   :octicons-milestone-24: Default: `table` – The [Highlight] extension
     provides three ways to add line numbers, all of which are supported by
@@ -544,7 +544,7 @@ markdown_extensions:
 
 The following configuration options are supported:
 
-`custom_fences`{ #custom-fences }
+`custom_fences`{ #superfences-custom-fences }
 
 :   :octicons-milestone-24: Default: _none_ – This option allows to define a
     handler for custom fences, e.g. to preserve the definitions of [Mermaid.js]
@@ -603,7 +603,7 @@ markdown_extensions:
 
 The following configuration options are supported:
 
-`alternate_style`{ #alternate-style }
+`alternate_style`{ #tabbed-alternate-style }
 
 :   :octicons-milestone-24: Default: `false` · [:octicons-tag-24: 7.3.1]
     [Tabbed alternate support] – This option enables the [alternate style] of
@@ -652,7 +652,7 @@ markdown_extensions:
 
 The following configuration options are supported:
 
-`custom_checkbox`{ #custom-checkbox }
+`custom_checkbox`{ #tasklist-custom-checkbox }
 
 :   :octicons-milestone-24: Default: `false` · This option toggles the rendering
     style of checkboxes, replacing native checkbox styles with beautiful icons, 
@@ -664,7 +664,7 @@ The following configuration options are supported:
           custom_checkbox: true
     ```
 
-`clickable_checkbox`{ #clickable-checkbox }
+`clickable_checkbox`{ #tasklist-clickable-checkbox }
 
 :   :octicons-milestone-24: Default: `false` · This option toggles whether
     checkboxes are clickable. As the state is not persisted, the use of this 

docs/setup/extensions/python-markdown.md

@@ -213,7 +213,7 @@ markdown_extensions:
 
 The following configuration options are supported:
 
-`permalink`{ #permalink }
+`permalink`{ #toc-permalink }
 
 :   :octicons-milestone-24: Default: `false` – This option adds an anchor link
     containing the paragraph symbol `¶` or another custom symbol at the end of
@@ -236,7 +236,7 @@ The following configuration options are supported:
               permalink: ⚓︎
         ```
 
-`slugify`{ #slugify }
+`slugify`{ #toc-slugify }
 
 :   :octicons-milestone-24: Default: `headerid.slugify` – This option allows for
     customization of the slug function. For some languages, the default may not
@@ -259,7 +259,7 @@ The following configuration options are supported:
               slugify: !!python/name:pymdownx.slugs.uslugify_cased
         ```
 
-`toc_depth`{ #toc_depth }
+`toc_depth`{ #toc-depth }
 
 :   :octicons-milestone-24: Default: `6` – Define the range of levels to be
     included in the table of contents. This may be useful for project

docs/setup/setting-up-navigation.md

@@ -317,7 +317,7 @@ hide:
 Material for MkDocs includes several keyboard shortcuts that make it possible
 to navigate your project documentation via keyboard. There're two modes:
 
-`search`{ #search }
+`search`{ #mode-search }
 
 :   This mode is active when the _search is focused_. It provides several key
     bindings to make search accessible and navigable via keyboard:
@@ -326,7 +326,7 @@ to navigate your project documentation via keyboard. There're two modes:
     * ++esc++ , ++tab++ : close search dialog
     * ++enter++ : follow selected result
 
-`global`{ #global }
+`global`{ #mode-global }
 
 :   This mode is active when _search is not focussed_ and when there's no other
     focussed element that is susceptible to keyboard input. The following keys