Updated code block annotation usage

This commit is contained in:
squidfunk 2021-07-18 17:57:45 +02:00
parent 4f15e6e2d5
commit e30b814c57
6 changed files with 21 additions and 7 deletions

View File

@ -25,7 +25,7 @@ contents:
=== "Material for MkDocs"
``` { .yaml .annotate }
``` yaml
name: ci # (1)
on:
push:

View File

@ -223,7 +223,14 @@ to the corresponding tooltip.
In order to opt-in to annotation support, a slightly different syntax is
required just add the respective [language short code][17] and the `.annotate`
class, after the three backticks.
class, after the three backticks. Alternatively, if you want to enable annotations
globally, add the following to `mkdocs.yml`:
``` yaml
theme:
features:
- content.code.annotate
```
Note that annotations can be __placed anywhere__ in a code block where a comment
for the language can be placed, which for JavaScript is `// (1)` and
@ -232,7 +239,7 @@ for the language can be placed, which for JavaScript is `// (1)` and
_Example_:
```` markdown
``` { .js .annotate }
``` js
document$.subscribe(function() { // (1)
var tables = document.querySelectorAll(/* (2) */ "article table")
tables.forEach(function(table) {
@ -247,7 +254,7 @@ document$.subscribe(function() { // (1)
_Result_:
``` { .js .annotate }
``` js
document$.subscribe(function() { // (1)
var tables = document.querySelectorAll(/* (2) */ "article table")
tables.forEach(function(table) {

View File

@ -72,7 +72,13 @@ Add the following to `mkdocs.yml`:
``` yaml
extra:
consent: true
consent:
title: Cookie consent
description: >
We use cookies to recognize your repeated visits and preferences, as well
as to measure the effectiveness of our documentation and whether users
find what they're searching for. With your consent, you're helping us to
make our documentation better.
```
When a user first visits your site, a cookie consent form is rendered:

View File

@ -276,7 +276,7 @@ When a user enters a query into the search box, the query is pre-processed
before it is submitted to the search index. Material for MkDocs will apply the
following transformations, which can be customized by [extending the theme][20]:
``` { .ts .annotate }
``` ts
export function defaultTransform(query: string): string {
return query
.split(/"([^"]+)"/g) /* (1) */

View File

@ -75,7 +75,7 @@ If you're using versioning, you might want to display a warning when the user
visits any other version than the latest version. Using [theme extension][8],
you can [define the `outdated` block][9]:
``` { .html .annotate }
``` html
{% block outdated %}
You're not viewing the latest version.
<a href="{{ '../' ~ base_url }}"> <!-- (1) -->

View File

@ -51,6 +51,7 @@ theme:
# Default values, taken from mkdocs_theme.yml
language: en
features:
- content.code.annotate
- content.tabs.link
# - navigation.instant
- navigation.sections