pyscript
diff --git a/‎docs/beginning-pyscript.md‎
Lines changed: 3 additions & 3 deletions b/‎docs/beginning-pyscript.md‎
Lines changed: 3 additions & 3 deletions
diff --git a/‎docs/user-guide/configuration.md‎
Lines changed: 1 addition & 1 deletion b/‎docs/user-guide/configuration.md‎
Lines changed: 1 addition & 1 deletion
diff --git a/‎docs/user-guide/display.md‎
Lines changed: 13 additions & 13 deletions b/‎docs/user-guide/display.md‎
Lines changed: 13 additions & 13 deletions
diff --git a/‎docs/user-guide/dom.md‎
Lines changed: 11 additions & 11 deletions b/‎docs/user-guide/dom.md‎
Lines changed: 11 additions & 11 deletions
diff --git a/‎docs/user-guide/editor.md‎
Lines changed: 8 additions & 8 deletions b/‎docs/user-guide/editor.md‎
Lines changed: 8 additions & 8 deletions
@@ -111,7 +111,7 @@ PyScript, and so we create a `<script>` tag that references the PyScript
 module, and a `<link>` to some PyScript specific CSS, in the document's
 `<head>` tag:
 
-```html
+```html title="The head of index.html"
 <!DOCTYPE html>
 <html>
   <head>
@@ -133,7 +133,7 @@ Notice that the `<body>` of the document is empty except for the TODO comment.
 It's in here that we put standard HTML content to define our user interface, so
 the `<body>` now looks like:
 
-```html
+```html title="The body of index.html"
 <body>
   <h1>Polyglot 🦜 💬 🇬🇧 ➡️ 🏴‍☠️</h1>
   <p>Translate English into Pirate speak...</p>
@@ -158,7 +158,7 @@ where PyScript should find the configuration (`config="./pyscript.json"`).
 
 In the end, our HTML should look like this:
 
-```html title="index.html"
+```html title="The complete index.html"
 <!DOCTYPE html>
 <html>
   <head>
 
@@ -273,7 +273,7 @@ filename in the destination directory.
 
 For example, the end of the previous config file could be:
 
-```toml
+```toml title="Automatic use of the source filename into a destination directory."
 "{TO}" = "./my_module/"
 "{FROM}/__init__.py" = "{TO}"
 "{FROM}/foo.py" = "{TO}"
 
@@ -14,7 +14,7 @@ superpowers.
 
 The simplest use is displaying text:
 
-```python
+```python title="Simple Python objects via display()"
 from pyscript import display
 
 
@@ -29,7 +29,7 @@ page. Each call appends content unless you specify otherwise.
 
 Control where content appears using the `target` parameter:
 
-```python
+```python title="Specify where to display things."
 from pyscript import display
 
 
@@ -45,7 +45,7 @@ display("Hello", target="#output-div")
 By default, `display()` appends content. Use `append=False` to replace
 existing content:
 
-```python
+```python title="Append or replace."
 from pyscript import display
 
 
@@ -62,7 +62,7 @@ display("More content", target="output-div", append=True)
 
 Plain strings are automatically HTML-escaped for safety:
 
-```python
+```python title="Strings are escaped."
 from pyscript import display
 
 
@@ -75,7 +75,7 @@ display("<script>alert('XSS')</script>")
 
 To display unescaped HTML, wrap it in the `HTML` class:
 
-```python
+```python title="The HTML class unescapes (handle with care!)"
 from pyscript import HTML, display
 
 
@@ -93,7 +93,7 @@ display(HTML("<p>This is <strong>bold</strong> text.</p>"))
 
 Most Python objects display using their `__repr__()` method:
 
-```python
+```python title="Default behaviour via __repr__()."
 from pyscript import display
 
 
@@ -120,7 +120,7 @@ display(Person("Bob"))
 
 Display images from various sources:
 
-```python
+```python title="Image handling."
 from pyscript import display
 
 
@@ -162,7 +162,7 @@ Objects are checked for these methods in order of preference:
 
 Create objects that display beautifully:
 
-```python
+```python title="Custom HTML rendering."
 from pyscript import display
 
 
@@ -199,7 +199,7 @@ display(ColourSwatch("#0000FF", "Blue"))
 
 Provide multiple representations for maximum compatibility:
 
-```python
+```python title="Define rendering via mime-type."
 from pyscript import display
 
 
@@ -247,7 +247,7 @@ display(table)
 When PyScript runs a `<script type="mpy">` tag, `display()` outputs to
 that script's location by default:
 
-```html
+```html title="Output at the &lt;script&gt;'s location in the DOM."
 <div>
   <h2>Output appears here:</h2>
   <script type="mpy">
@@ -261,7 +261,7 @@ that script's location by default:
 
 Use the `target` attribute on your script tag to send output elsewhere:
 
-```html
+```html title="Specify an output target."
 <div id="results"></div>
 
 <script type="mpy" target="results">
@@ -293,7 +293,7 @@ This example demonstrates:
 
 **Never use `HTML()` with untrusted content:**
 
-```python
+```python title="This is dangerous!"
 # DANGEROUS - don't do this!
 user_input = "<script>alert('XSS')</script>"
 display(HTML(user_input))
@@ -316,7 +316,7 @@ For frequent or rapid updates:
 
 Keep display logic close to your data:
 
-```python
+```python title="_repr_ logic on a class."
 class Report:
     def __init__(self, data):
         self.data = data
 
@@ -40,7 +40,7 @@ management, and Pythonic method names.
 The `page` object represents your web page. Use it to find elements by
 their ID or with CSS selectors:
 
-```python
+```python title="Referencing elements via the page object."
 from pyscript import web
 
 
@@ -69,7 +69,7 @@ names correspond to HTML tags, and are lower-case to match web
 conventions. Compose elements together in a
 [declarative style](https://en.wikipedia.org/wiki/Declarative_programming):
 
-```python
+```python title="Declaratively creating elements on the page."
 from pyscript import web
 
 
@@ -100,7 +100,7 @@ arguments like `id`, `classes`, and `style` set HTML attributes.
 You can also create elements
 [imperatively](https://en.wikipedia.org/wiki/Imperative_programming):
 
-```python
+```python title="Imperatively created elements on the web page."
 from pyscript import web
 
 
@@ -122,7 +122,7 @@ my_div.append(my_p)
 Once you have an element, you can modify its content and attributes
 using idiomatic Python:
 
-```python
+```python title="Modifying an element."
 from pyscript import web
 
 
@@ -149,7 +149,7 @@ element.update(
 Element classes behave like a Python `set`, and styles behave like a
 Python `dict`:
 
-```python
+```python title="CSS classes are a Python set, CSS styles a Python dict."
 from pyscript import web
 
 
@@ -186,7 +186,7 @@ if "color" in element.style:
 When you find multiple elements, you get an `ElementCollection` that
 you can iterate over, slice, or update in bulk:
 
-```python
+```python title="Working with ElementCollections."
 from pyscript import web
 
 
@@ -231,7 +231,7 @@ select. When rendered on a web page, it looks like this:
 The `options` property of `select` elements provides convenient methods
 for managing such options:
 
-```python
+```python title="Elements with options (e.g. &lt;select&gt;)."
 from pyscript import web
 
 
@@ -264,7 +264,7 @@ lists of options to function.
 
 The `@when` decorator works seamlessly with `pyscript.web` elements:
 
-```python
+```python title="@when working with Element instances."
 from pyscript import when, web
 
 
@@ -290,7 +290,7 @@ Learn more about event handling in the [events guide](events.md).
 
 When needed, you can access the underlying DOM element directly:
 
-```python
+```python title="Use _dom_element to get the underlying JavaScript Element."
 from pyscript import web
 
 
@@ -339,7 +339,7 @@ This is available via the `pyscript.window` and `pyscript.document`
 objects, which are proxies for JavaScript's `globalThis` and `document`
 objects:
 
-```python
+```python title="Complete JavaScript access via the FFI."
 from pyscript import window, document
 
 
@@ -392,7 +392,7 @@ list `["hello", 1, 2, 3]`, and vice versa.
 Instantiating JavaScript classes requires special handling because
 Python and JavaScript do it differently:
 
-```python
+```python title="Use .new() to instantiate JavaScript classes."
 from pyscript import window
 
 
 
@@ -20,7 +20,7 @@ demonstrations, and interactive coding experiences.
 Create an editor by setting the script type to `py-editor` for Pyodide
 or `mpy-editor` for MicroPython:
 
-```html
+```html title="A simple editor example."
 <script type="py-editor">
 import sys
 print(sys.version)
@@ -42,7 +42,7 @@ only when needed.
 Each editor runs in its own isolated environment by default. Variables
 and state don't leak between editors:
 
-```html
+```html title="Independent editor environments."
 <script type="py-editor">
 import sys
 print(sys.version)
@@ -64,7 +64,7 @@ exist in the first.
 
 Editors can share state by using the same interpreter and `env` attribute:
 
-```html
+```html title="Shared editor environments."
 <script type="mpy-editor" env="shared">
 if 'a' not in globals():
     a = 1
@@ -92,7 +92,7 @@ of each editor, showing which environment it belongs to.
 Sometimes you need boilerplate code that runs automatically without
 cluttering the visible editor. The `setup` attribute handles this:
 
-```html
+```html title="Editor setup."
 <script type="mpy-editor" env="classroom" setup>
 # This code runs automatically but isn't visible.
 import math
@@ -131,7 +131,7 @@ code. This speeds up the edit-run-debug cycle.
 
 Access and control editors from Python code using the `code` property:
 
-```python
+```python title="Updating code in the editor via Python."
 from pyscript import document
 
 # Get reference to an editor.
@@ -159,7 +159,7 @@ based on user actions elsewhere on the page.
 By default, editors render where their script tag appears. Use the
 `target` attribute to render elsewhere:
 
-```html
+```html title="Specify a target in which to render the editor."
 <script type="mpy-editor" target="editor-container">
 import sys
 print(sys.version)
@@ -176,7 +176,7 @@ script tag. This gives you control over page layout.
 Editors require explicit configuration through the `config` attribute.
 They don't use `<py-config>` or `<mpy-config>` tags:
 
-```html
+```html title="Sample configuration."
 <script type="py-editor" config='{"packages": ["numpy"]}'>
 import numpy as np
 print(np.array([1, 2, 3]))
@@ -191,7 +191,7 @@ subsequent editors in the same environment share that configuration.
 Advanced use cases may require custom execution behaviour. Override the
 editor's `handleEvent` method:
 
-```html
+```html title="Custom execution behaviour."
 <script type="mpy-editor" id="custom">
 print(6 * 7)
 </script>