v3.1.0

This method was added in 30803fc.

.github/workflows/build.yml

@@ -1,28 +1,43 @@
+# This workflow will install Python dependencies, run tests and lint with a variety of Python versions
+# For more information see: https://help.github.com/actions/language-and-framework-guides/using-python-with-github-actions
+
 name: Build Python package and docs
 
-on: push
+on: [ push, pull_request ]
 
 jobs:
   build:
 
-    runs-on: ubuntu-24.04
+    runs-on: ubuntu-20.04
+    strategy:
+      matrix:
+        python-version: [3.8, 3.9]
+
     steps:
-    - uses: actions/checkout@v6
+    - uses: actions/checkout@v2
       with:
         submodules: recursive
+    - name: Set up Python ${{ matrix.python-version }}
+      uses: actions/setup-python@v1
+      with:
+        python-version: ${{ matrix.python-version }}
     - name: Install dependencies
       run: |
-        pipx install poetry
+        pip install poetry
+        poetry run python -m pip install --upgrade pip
+        poetry run python -m pip install --upgrade setuptools
         poetry install
     - name: Lint Python code
-      run: poetry run ruff check
-    - name: Check Python formatting
-      run: poetry run ruff format --check
+      run: poetry run flake8
     - name: Build package
       run: poetry build
     - name: Lint docs
       run: poetry run doc8
     - name: Build html docs for Read the Docs
       run: poetry run make -C doc html
+    - name: Instal IDE docs dependencies
+      run: |
+        sudo apt-get update
+        sudo apt-get install dvisvgm preview-latex-style texlive texlive-fonts-extra texlive-latex-extra
     - name: Build html docs for Pybricks Code IDE
       run: poetry run make -C doc html TAG=ide

.github/workflows/jedi.yml

@@ -1,15 +0,0 @@
-name: pybricks_jedi
-
-on: [push, pull_request]
-
-jobs:
-  test:
-    if: github.ref_type != 'tag'
-    runs-on: ubuntu-24.04
-    steps:
-    - uses: actions/checkout@v6
-    - run: pipx install poetry
-    - run: poetry install
-      working-directory: ./jedi
-    - run: poetry run pytest -vv
-      working-directory: ./jedi

.github/workflows/publish-ide-docs.yml

@@ -2,38 +2,37 @@ name: Release @pybricks/ide-docs
 
 on:
   push:
-    tags:
-    - 'v4.*'
-
-permissions:
-  id-token: write
-  contents: read
+    tags: 
+    - '@pybricks/ide-docs/**'
 
 jobs:
   publish_ide_docs:
-    runs-on: ubuntu-24.04
+    runs-on: ubuntu-20.04
     steps:
-    - name: Get version from tag
+    - name: Ubuntu packages
       run: |
-        VERSION="${GITHUB_REF_NAME#v}"
-        NPM_VERSION=$(echo "$VERSION" | sed 's/\([0-9]\)a\([0-9]\)/\1-alpha.\2/;s/\([0-9]\)b\([0-9]\)/\1-beta.\2/;s/\([0-9]\)rc\([0-9]\)/\1-rc.\2/')
-        echo "VERSION=$VERSION" >> $GITHUB_ENV
-        echo "NPM_VERSION=$NPM_VERSION" >> $GITHUB_ENV
-        echo "NPM_TAG=$(echo "$NPM_VERSION" | grep -q '-' && echo 'next' || echo 'latest')" >> $GITHUB_ENV
-    - uses: actions/checkout@v6
+        sudo apt-get update
+        sudo apt-get install -y dvisvgm preview-latex-style texlive texlive-fonts-extra texlive-latex-extra
+    - uses: actions/checkout@v2
       with:
         submodules: recursive
+    - name: Set up Python 3.8
+      uses: actions/setup-python@v1
+      with:
+        python-version: 3.8
     - name: Install dependencies
       run: |
-        pipx install poetry
-        poetry install --only=doc
-    - uses: actions/setup-node@v6
+        pip install poetry
+        poetry run python -m pip install --upgrade pip
+        poetry run python -m pip install --upgrade setuptools
+        poetry install
+    - uses: actions/setup-node@v1
       with:
-        node-version: '24'
+        node-version: '14.x'
         registry-url: 'https://registry.npmjs.org'
-    - run: npm version --no-git-tag-version "$NPM_VERSION"
-      working-directory: npm/ide-docs
     - run: yarn build
       working-directory: npm/ide-docs
-    - run: npm publish --tag "$NPM_TAG"
+    - run: yarn publish
       working-directory: npm/ide-docs
+      env:
+        NODE_AUTH_TOKEN: ${{ secrets.NODE_AUTH_TOKEN }}

.github/workflows/publish-jedi.yml

@@ -1,39 +0,0 @@
-name: Release @pybricks/jedi
-
-on:
-  push:
-    tags:
-    - 'v4.*'
-
-permissions:
-  id-token: write
-  contents: read
-
-jobs:
-  publish_jedi:
-    runs-on: ubuntu-24.04
-    steps:
-    - uses: actions/checkout@v6
-    - name: Get version from tag
-      run: |
-        VERSION="${GITHUB_REF_NAME#v}"
-        NPM_VERSION=$(echo "$VERSION" | sed 's/\([0-9]\)a\([0-9]\)/\1-alpha.\2/;s/\([0-9]\)b\([0-9]\)/\1-beta.\2/;s/\([0-9]\)rc\([0-9]\)/\1-rc.\2/')
-        echo "VERSION=$VERSION" >> $GITHUB_ENV
-        echo "NPM_VERSION=$NPM_VERSION" >> $GITHUB_ENV
-        echo "NPM_TAG=$(echo "$NPM_VERSION" | grep -q '-' && echo 'next' || echo 'latest')" >> $GITHUB_ENV
-    - name: Install poetry
-      run: pipx install poetry
-    - name: Set pybricks-jedi version
-      run: poetry version "$VERSION"
-      working-directory: jedi
-    - name: Set pybricks version and update jedi dependency pin
-      run: |
-        poetry version "$VERSION"
-        sed -i "s/^pybricks = \".*\"/pybricks = \"$VERSION\"/" jedi/pyproject.toml
-    - uses: actions/setup-node@v6
-      with:
-        node-version: '24'
-        registry-url: 'https://registry.npmjs.org'
-    - run: python jedi/build.py "$NPM_VERSION"
-    - run: npm publish --tag "$NPM_TAG"
-      working-directory: jedi/npm-build

.github/workflows/release-to-pypi.yml

@@ -0,0 +1,22 @@
+name: Release to PyPI
+
+on:
+  release:
+    types: [published]
+
+jobs:
+  build_and_publish:
+    runs-on: ubuntu-20.04
+    steps:
+    - uses: actions/checkout@v2
+    - uses: actions/setup-python@v2
+      with:
+        python-version: 3.8
+    - uses: abatilo/actions-poetry@v2.0.0
+      with:
+        poetry-version: 1.1.6
+    - run: poetry install
+    - run: poetry build
+    - run: poetry publish
+      env:
+        POETRY_PYPI_TOKEN_PYPI: ${{ secrets.PYPI_TOKEN }}

.github/workflows/release.yml

@@ -1,45 +0,0 @@
-on:
-  push:
-    tags:
-    - 'v4.*'
-
-name: Create release on GitHub and PyPI
-
-permissions:
-  contents: write
-
-jobs:
-  create_release:
-    name: Create release on GitHub
-    runs-on: ubuntu-24.04
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v6
-        with:
-          submodules: true
-          fetch-depth: 0
-      - name: Get tag
-        run: echo "GITHUB_TAG=${GITHUB_REF#*refs/tags/}" >> $GITHUB_ENV
-      - name: Create release
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          tag: ${{ github.ref_name }}
-        run: |
-          if [[ "${{ contains(env.GITHUB_TAG, 'a') || contains(env.GITHUB_TAG, 'b') || contains(env.GITHUB_TAG, 'c') }}" == "true" ]]; then
-            PRERELEASE_FLAG="--prerelease"
-          else
-            PRERELEASE_FLAG=""
-          fi
-          gh release create "$tag" \
-              --repo="$GITHUB_REPOSITORY" \
-              --title="${tag#v}" \
-              -F CHANGELOG.md \
-              $PRERELEASE_FLAG
-  build_and_publish:
-    runs-on: ubuntu-24.04
-    steps:
-    - uses: actions/checkout@v6
-    - run: pipx run poetry build
-    - run: pipx run poetry publish
-      env:
-        POETRY_PYPI_TOKEN_PYPI: ${{ secrets.PYPI_TOKEN }}

.gitignore

@@ -25,11 +25,9 @@
 build/
 build-*/
 _build/
-npm-build/
 
-# Tests
+# Test failure outputs
 ######################
-.pytest_cache/
 tests/*.exp
 tests/*.out
 
@@ -59,10 +57,3 @@ genrst/
 # Virtual environment
 ######################
 .venv/
-.python-version
-
-# Generated LDRAW output
-######################
-stderr-ldview
-stdout-ldview
-LPub3D/

.readthedocs.yaml

@@ -0,0 +1,22 @@
+# .readthedocs.yaml
+# Read the Docs configuration file
+# See https://docs.readthedocs.io/en/stable/config-file/v2.html for details
+#
+# Settings in the readthedocs online dashboard will be ignored.
+
+# Required
+version: 2
+
+# Build documentation in the doc/main directory with Sphinx
+sphinx:
+   configuration: doc/main/conf.py
+
+# Build your docs in additional formats such as PDF
+formats:
+   - pdf
+
+# Set the version of Python and requirements required to build the docs
+python:
+   version: 3.8
+   install:
+   - requirements: rtd-requirements.txt

.readthedocs.yml

@@ -1,20 +0,0 @@
-# .readthedocs.yaml
-# Read the Docs configuration file
-# See https://docs.readthedocs.io/en/stable/config-file/v2.html for details
-
-# Required
-version: 2
-
-build:
-  os: "ubuntu-24.04"
-  tools:
-    python: "3.12"
-  jobs:
-    post_create_environment:
-      - pip install poetry
-    post_install:
-      - VIRTUAL_ENV=$READTHEDOCS_VIRTUALENV_PATH poetry install --only=doc
-
-# Build documentation in the doc/main/ directory with Sphinx
-sphinx:
-  configuration: doc/main/conf.py

.vscode/extensions.json

@@ -4,10 +4,9 @@
 
 	// List of extensions which should be recommended for users of this workspace.
 	"recommendations": [
-		"ms-python.python",
-		"charliermarsh.ruff"
+		"ms-python.python"
 	],
 	// List of extensions recommended by VS Code that should not be recommended for users of this workspace.
 	"unwantedRecommendations": [
 	]
-}
+}

.vscode/settings.json

@@ -1,19 +1,10 @@
 {
-    "files.exclude": {
-      "**/__pycache__": true,
-    },
-    "python.defaultInterpreterPath": ".venv/bin/python",
-    "python.autoComplete.extraPaths": ["jedi/src"],
-    "[python]": {
-        "editor.formatOnSave": true,
-        "editor.defaultFormatter": "charliermarsh.ruff"
-    },
+    "python.pythonPath": "${workspaceFolder}/.venv",
+    "python.formatting.provider": "black",
+    "python.linting.pycodestyleEnabled": false,
+    "python.linting.flake8Enabled": true,
+    "python.linting.enabled": true,
     "python.languageServer": "Pylance",
-    "python.testing.pytestArgs": [
-        "jedi/tests"
-    ],
-    "python.testing.unittestEnabled": false,
-    "python.testing.pytestEnabled": true,
     "files.associations": {"*.inc": "restructuredtext"},
     "restructuredtext.confPath": "${workspaceFolder}/doc/main",
     "spellright.language": [
@@ -43,12 +34,5 @@
         "plaintext",
         "python",
         "restructuredtext",
-    ],
-    "rewrap.wrappingColumn": 78,
-    "python.analysis.extraPaths": [
-        "jedi/src"
-    ],
-    "yaml.schemas": {
-        "https://json.schemastore.org/github-workflow.json": "file:///home/david/work/pybricks/pybricks-api/.github/workflows/build.yml"
-    },
+    ]
 }

.vscode/spellright.dict

@@ -24,6 +24,7 @@ EV3
 ev3brick
 ev3dev
 ev3devices
+Ev3devSensor
 fb
 Franca
 func
@@ -77,4 +78,3 @@ thermistor
 toctree
 TODO
 UART
-utf-8

CHANGELOG.md

@@ -1,5 +1,93 @@
 # Changelog
 
-See [pybricks-micropython/CHANGELOG.md][changelog] for the changes in each release.
+<!-- refer to https://keepachangelog.com/en/1.0.0/ for guidance -->
 
-[changelog]: https://github.com/pybricks/pybricks-micropython/blob/master/CHANGELOG.md
+## 3.1.0 - 2021-12-16
+
+### Added
+- Added maximum voltage setter for `DCMotor` and `Motor`.
+- Documented `DriveBase.curve()` method.
+
+### Changed
+- Removed `duty` setting from `Control.limits` method.
+- Removed `integral_range` setting from `Control.pid` method.
+
+### Fixed
+- Fixed link to Color Light Matrix page.
+- Fixed link to Inventor Hub page.
+
+## 3.1.0rc1 - 2021-11-19
+
+### Added
+- Added `ColorLightMatrix` class.
+- Added `LWP3Device` class.
+
+**NOTE: version number after this point were from JavaScript package and do
+not correspond to Pybricks firmware version numbers.**
+
+## 1.6.0 - 2021-08-30
+
+### Added
+- MicroPython module documentation.
+- Examples for hub system functions including stop button and shutdown.
+
+### Changed
+- Build IDE docs as main docs with minor changes, instead of a completely
+  separate build.
+- Moved motor control documentation to the motor page.
+
+## 1.5.0 - 2021-07-01
+
+### Added
+- Documentation for Powered Up Remote Control.
+
+## 1.4.0 - 2021-06-23
+
+### Added
+- Enabled beta content that was hidden for the 3.0 release.
+- Added notice about using the latest beta version.
+
+## 1.3.3 - 2021-05-21
+
+### Changed
+- Match example snippet styling to IDE.
+- Add more examples.
+
+## 1.3.2 - 2021-04-26
+
+## Changed
+- Theme style fixes.
+- Example code fixes
+- Match doc version to firmware version.
+
+## 1.3.1 - 2021-04-12
+
+### Changed
+- Upgrade sphinx and rtd-theme to fix style issues.
+
+## 1.3.0 - 2021-04-12
+
+### Removed
+- Removed features which not be in the official 3.0 release. These features
+  are still in beta. They'll come back in future releases once tested.
+
+## 1.2.0 - 2021-04-09
+
+### Changed
+- Moved installation guide to external site.
+
+## 1.1.1 - 2021-02-14
+
+### Added
+- Added installation guide.
+- Various documentation fixes.
+
+## 1.1.0 - 2021-01-28
+
+### Added
+- Scrollbar styling.
+
+## 1.0.0 - 2021-01-25
+
+### Added
+- Sphinx build output.

CONTRIBUTING.md

@@ -32,91 +32,14 @@ will actually be implemented.
      - pybricks.tools.wait: Add example of waiting.
      - pybricks.pupdevices: Fix all sensor class ports.
      - umath.sin: Fix spelling of Hypotenuse.
-  - If an import path makes no sense, just use the file path without
-    extensions:
+  - If an import path makes no sense, just use the file path without extensions:
      - .vscode/settings: Fix file associations.
-- The subject briefly describes _what_ was changed. Use a short full sentence
-  as in the examples above.
+- The subject briefly describes _what_ was changed. Use a short full sentence as in the examples above.
 - The body describes _why_ the change was made, e.g. `The word "sensor" was
   spelled incorrectly`.
 
 [commits]: https://github.com/pybricks/pybricks-api/commits/master
 
-**General docstring principles:**
-
-The stubs libraries in this repository have two different purposes:
-1. Auto-generating documentation with Sphinx. For this purpose, the
-   documentation should be concise and clear.
-2. Provide autocomplete and intellisense in code editors. For this purpose,
-   the code needs to be 100% correct. This way, computers can parse your code
-   correctly and tell you when something is wrong.
-
-Since these objectives don't always align, we address these separately in the
-stubs library:
-
-1. The first line(s) of the docstring contain the function or method signature
-   as it should be displayed in the human-readable documentation.
-2. The real function signature can be as complex as it needs to be to make it
-   correct for intellisense. Overloads can be uses if needed.
-
-In the rare case where the docstring signature is the same as the typed
-version, we'll still include it for consistency.
-
-**Docstring details:**
-
-Make sure to look at existing function signatures and docstrings for
-inspiration when documenting new functionality. As an example, consider:
-
-```python
-def run_until_stalled(
-    self,
-    speed: Number,
-    then: Stop = Stop.COAST,
-    duty_limit: Optional[Number] = None,
-) -> int:
-    """
-    run_until_stalled(speed, then=Stop.COAST, duty_limit=None) -> int: deg
-
-    Runs the motor at a constant speed until it stalls.
-
-    Arguments:
-        speed (Number, deg/s): Speed of the motor.
-        then (Stop): What to do after coming to a standstill.
-        duty_limit (Number, %): Duty cycle limit during this
-            command. This is useful to avoid applying the full motor
-            torque to a geared or lever mechanism. If it is ``None``, the
-            duty limit won't be changed during this command.
-
-    Returns:
-        Angle at which the motor becomes stalled.
-    """
-```
-The real method signature at the top contains the full detail, including the
-type of each argument and return value.
-
-The docstring starts with the signature. Use more than one signature if needed
-to represent overloaded methods. The signatures are written in the way they
-should be displayed in the docs:
-- Argument types are omitted because they are also shown with the argument
-  description below.
-- Default values should be given (``then=Stop.COAST``).
-- The return type should be given (``-> int``). When applicable, include
-  the unit of the return value, so it becomes ``-> int: deg``
-
-Then follows a concise description of what this method, function, or class
-does.
-
-Then follows a list of arguments:
-- For each argument, include the expected type and unit if applicable, e.g.
-  ``(int)`` or ``(Number, deg/s)``.
-- Use ``Number`` when ``int`` and ``float`` are both allowed.
-- If the description is long, use the indentation shown above.
-- Make it readable. Instead
-  of ``Union[float, SupportsFloat, complex, SupportsComplex]``,
-  just say _float or complex_.
-
-Then follows a description of the return value. The type is omitted here since
-it is already include in the docstring signature.
 
 **Development environment:**
 
@@ -126,8 +49,8 @@ Prerequisites:
 - [Python 3][python]
 - [Poetry][poetry]
 
-Information on installing prerequisites can be found on the
-[pybricks-micropython contributor's guide][contributing].
+Information on installing prerequisites can be found on the [pybricks-micropython
+wiki][wiki].
 
 Initial setup:
 
@@ -163,25 +86,8 @@ Linting:
     poetry run flake8  # check Python
     poetry run doc8  # check Restructured Text
 
-Building all release artifacts (docs, jedi, npm packages):
-
-    # Linux/macOS only
-    ./build-all.sh
-
-** version notes **
-
-This repository is frequently updated to stay in sync with the firmware
-implementation.
-
-Major and minor versions are synchronized with `pybricks-micropython`, which
-leads. Patch versions and prerelease version numbers may differ, as they may
-be bumped for every small change or typo in the docs.
-
-The version for this repository is also used for the `@pybricks/jedi` and
-`@pybricks/ide-docs` npm packages.
-
 [vscode]: https://code.visualstudio.com/
 [git]: https://git-scm.com/
 [python]: https://www.python.org/
 [poetry]: https://python-poetry.org/
-[contributing]: https://github.com/pybricks/pybricks-micropython/blob/master/CONTRIBUTING.md
+[wiki]: https://github.com/pybricks-micropython/wiki

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2018-2022 The Pybricks Authors
+Copyright (c) 2018-2021 The Pybricks Authors
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.rst

@@ -12,11 +12,6 @@ used to generate the `official documentation`_.
 See the `contributor's guide <CONTRIBUTING.md>`_ for acceptable changes and
 instructions to build the documentation locally.
 
-You can use the API stubs in this repository for syntax highlighting and code
-completion when programming the EV3 with VS Code. To enable, remove the
-``"python.languageServer"="None"`` line in the ``.vscode/settings.json`` file
-generated by the *LEGO® MINDSTORMS® EV3 MicroPython* extension.
-
 For general discussion, please visit the `support`_ issue tracker.
 
 .. _Pybricks package: pybricks

build-all.sh

@@ -1,89 +0,0 @@
-#!/usr/bin/env bash
-# Build all release artifacts locally (equivalent to CI workflows, minus publish).
-set -euo pipefail
-
-REPO_ROOT="$(realpath "$(dirname "${BASH_SOURCE[0]}")")"
-
-# Option: --pybricks-code <path> copies built npm packages into that
-# checkout's node_modules/@pybricks/ for easy local testing.
-PYBRICKS_CODE=""
-while [[ $# -gt 0 ]]; do
-    case "$1" in
-        --pybricks-code)
-            PYBRICKS_CODE="$(realpath "$2")"
-            shift 2
-            ;;
-        *)
-            echo "usage: $0 [--pybricks-code <path-to-pybricks-code-checkout>]" >&2
-            exit 1
-            ;;
-    esac
-done
-if [[ -n "$PYBRICKS_CODE" && ! -d "$PYBRICKS_CODE/node_modules/@pybricks" ]]; then
-    echo "error: $PYBRICKS_CODE/node_modules/@pybricks not found (run yarn install there first)" >&2
-    exit 1
-fi
-
-# Activate the project venv so python/make/etc. all use it without poetry run
-source "$REPO_ROOT/.venv/bin/activate"
-
-# Read version from pyproject.toml
-VERSION=$(grep '^version = ' "$REPO_ROOT/pyproject.toml" | head -1 | sed 's/version = "\(.*\)"/\1/')
-# Convert Python pre-release format (e.g. 4.0.0a1, 4.0.0b1, 4.0.0rc1) to npm semver (e.g. 4.0.0-alpha.1, 4.0.0-beta.1, 4.0.0-rc.1)
-NPM_VERSION=$(echo "$VERSION" | sed 's/\([0-9]\)a\([0-9]\)/\1-alpha.\2/;s/\([0-9]\)b\([0-9]\)/\1-beta.\2/;s/\([0-9]\)rc\([0-9]\)/\1-rc.\2/')
-echo "==> Building version $VERSION (npm: $NPM_VERSION)"
-
-# lint (same as CI build.yml)
-echo "==> Linting"
-cd "$REPO_ROOT"
-ruff check
-ruff format --check
-doc8
-
-# Python package
-echo "==> Building Python package"
-rm -rf "$REPO_ROOT/dist"  # stale wheels would get globbed into the jedi npm package
-poetry build
-
-# pybricks-jedi tests (own poetry env, same as CI jedi.yml)
-echo "==> Testing pybricks-jedi"
-cd "$REPO_ROOT/jedi"
-poetry run pytest -vv
-
-# @pybricks/jedi npm package
-echo "==> Building @pybricks/jedi"
-cd "$REPO_ROOT/jedi"
-rm -rf dist  # build.py globs dist/*.whl, stale wheels would get shipped
-python3 build.py "$NPM_VERSION"
-
-# html docs for Read the Docs
-echo "==> Building Read the Docs html docs"
-cd "$REPO_ROOT"
-make -C doc clean html
-
-# @pybricks/ide-docs npm package (builds the TAG=ide docs)
-echo "==> Building @pybricks/ide-docs"
-make -C doc clean
-cd "$REPO_ROOT/npm/ide-docs"
-yarn build
-
-echo ""
-echo "Build complete."
-echo "  python package   : dist/"
-echo "  jedi npm package : jedi/npm-build/"
-echo "  ide-docs         : npm/ide-docs/html/"
-
-if [[ -n "$PYBRICKS_CODE" ]]; then
-    DEST="$PYBRICKS_CODE/node_modules/@pybricks"
-    echo "==> Copying packages to $DEST"
-    rm -rf "$DEST/jedi" "$DEST/ide-docs"
-    mkdir -p "$DEST/jedi" "$DEST/ide-docs"
-    cp -r "$REPO_ROOT/jedi/npm-build/." "$DEST/jedi/"
-    cp -r "$REPO_ROOT/npm/ide-docs/package.json" \
-        "$REPO_ROOT/npm/ide-docs/LICENSE" \
-        "$REPO_ROOT/npm/ide-docs/README.md" \
-        "$REPO_ROOT/npm/ide-docs/html" \
-        "$DEST/ide-docs/"
-    echo "Copied @pybricks/jedi and @pybricks/ide-docs. Restart the dev server to pick them up."
-fi
-

doc/Makefile

@@ -11,13 +11,13 @@ TAG           = main
 
 # Put it first so that "make" without argument is like "make help".
 help:
-	@$(SPHINXBUILD) -M help "$(SOURCEDIR)" "$(BUILDDIR)" $(SPHINXOPTS) $(TAG) $(O)
+	@$(SPHINXBUILD) -M help "$(SOURCEDIR)" "$(BUILDDIR)" $(SPHINXOPTS) -t $(TAG) $(O)
 
 .PHONY: help Makefile
 
 diagrams:
-	@$(MAKE) -C "$(SOURCEDIR)"/diagrams_source clean
-	@$(MAKE) -C "$(SOURCEDIR)"/diagrams_source
+	@$(MAKE) -C "$(SOURCEDIR)"/diagram_source clean
+	@$(MAKE) -C "$(SOURCEDIR)"/diagram_source
 
 # Catch-all target: route all unknown targets to Sphinx using the new
 # "make mode" option.  $(O) is meant as a shortcut for $(SPHINXOPTS).

doc/common/_static/css/blocks.css

@@ -1,11 +0,0 @@
-.svg-container {
-    display: inline-block;
-    width: 100%;
-    height: auto;
-}
-
-.svg-container svg {
-    position: relative;
-    height: auto;
-    max-width: 100%;
-}

doc/common/_static/css/ide.css

@@ -40,11 +40,3 @@
 ::-webkit-scrollbar-thumb:hover {
     background: #182026;
 }
-
-html.writer-html5 .rst-content dl.citation,
-html.writer-html5 .rst-content dl.field-list,
-html.writer-html5 .rst-content dl.footnote {
-    display: flex;
-    flex-direction: column;
-    grid-template-columns: unset;
-}

doc/common/_static/css/theme_overrides.css

@@ -41,7 +41,3 @@ span.caption-number:after {
 .figure > a.reference.external::after {
     content: none !important;
 }
-
-.wy-side-nav-search > div.version {
-    color: hsla(0, 0%, 100%, 0.75);
-}

doc/common/conf.py

@@ -22,26 +22,26 @@
 import os
 import re
 import sys
-import tomllib
 
 from docutils import nodes
 from docutils.parsers.rst.directives import flag
 from docutils.parsers.rst import Directive
 from sphinx.application import Sphinx
-from sphinx.addnodes import pending_xref
-from sphinx.environment import BuildEnvironment
-from sphinx.util.nodes import make_refnode
+import toml
 
-TOP_DIR = os.path.abspath(os.path.join("..", ".."))
-sys.path.insert(0, os.path.join(TOP_DIR, "src"))
-sys.path.append(os.path.abspath("../common/extensions"))
+TOP_DIR = os.path.abspath(os.path.join('..', '..'))
+sys.path.insert(0, os.path.join(TOP_DIR, 'src'))
+sys.path.append(os.path.abspath('../common/extensions'))
+
+from pybricks.hubs import EV3Brick  # noqa E402
+from pybricks.media.ev3dev import Image  # noqa E402
+from pybricks._common import Speaker  # noqa E402
 
 # ON_RTD is whether we are on readthedocs.org
 # this line of code grabbed from docs.readthedocs.org
-ON_RTD = os.environ.get("READTHEDOCS", None) == "True"
+ON_RTD = os.environ.get('READTHEDOCS', None) == 'True'
 
-with open(os.path.join(TOP_DIR, "pyproject.toml"), "rb") as _f:
-    _pyproject = tomllib.load(_f)
+_pyproject = toml.load(os.path.join(TOP_DIR, 'pyproject.toml'))
 
 # -- General configuration ------------------------------------------------
 
@@ -53,31 +53,27 @@ with open(os.path.join(TOP_DIR, "pyproject.toml"), "rb") as _f:
 # extensions coming with Sphinx (named 'sphinx.ext.*') or your custom
 # ones.
 extensions = [
-    "sphinx.ext.autodoc",
-    "sphinx.ext.napoleon",
-    "sphinx.ext.todo",
-    # Custom Pybricks extensions
-    "awaitable",
-    "blockimg",
-    "color",
-    "classlink",
-    "docstring_signature",
-    "nestedmethod",
-    "requirements",
-    "requirements-static",
-    "versionchanged",
+    'sphinx.ext.autodoc',
+    'sphinx.ext.napoleon',
+    'sphinx.ext.todo',
+    'sphinx.ext.mathjax',
+    'color',
+    'classlink',
+    'requirements',
+    'requirements-static',
 ]
 
 # Add any paths that contain templates here, relative to this directory.
-templates_path = ["../common/_templates"]
+templates_path = ['../common/_templates']
 
 # The suffix(es) of source filenames.
 # You can specify multiple suffix as a list of string:
 #
-source_suffix = {".rst": "restructuredtext"}
+# source_suffix = ['.rst', '.md']
+source_suffix = '.rst'
 
 # The master toctree document.
-master_doc = "index"
+master_doc = 'index'
 
 # The version info for the project you're documenting, acts as replacement for
 # |version| and |release|, also used in various other places throughout the
@@ -86,17 +82,17 @@ master_doc = "index"
 # The full version, including alpha/beta/rc tags.
 release = "v" + _pyproject["tool"]["poetry"]["version"]
 # The short X.Y version.
-version = re.match(r"(v\d+\.\d+)", release)[0]
+version = re.match(r'(v\d+\.\d+)', release)[0]
 
 # The language for content autogenerated by Sphinx. Refer to documentation
 # for a list of supported languages.
 #
 # This is also used if you do content translation via gettext catalogs.
 # Usually you set "language" from the command line for these cases.
-language = "en"
+language = None
 
 # The name of the Pygments (syntax highlighting) style to use.
-pygments_style = "xcode"
+pygments_style = 'xcode'
 
 # If true, `todo` and `todoList` produce output, else they produce nothing.
 todo_include_todos = True
@@ -104,10 +100,10 @@ todo_include_todos = True
 # Figure numbering
 numfig = True
 numfig_format = {
-    "figure": "Figure %s",
-    "table": "Table %s",
-    "code-block": "Listing %s",
-    "section": "Section %s",
+    'figure': 'Figure %s',
+    'table': 'Table %s',
+    'code-block': 'Listing %s',
+    'section': 'Section %s'
 }
 
 # Find cross-reference errors
@@ -115,72 +111,91 @@ nitpicky = True
 
 # https://stackoverflow.com/a/30624034/1976323
 nitpick_ignore = [
-    ("py:class", "bool"),
-    ("py:class", "bytearray"),
-    ("py:class", "bytes"),
-    ("py:class", "callable"),
-    ("py:class", "dict"),
-    ("py:class", "float"),
-    ("py:class", "int"),
-    ("py:class", "iter"),
-    ("py:class", "list"),
-    ("py:class", "object"),
-    ("py:class", "str"),
-    ("py:class", "tuple"),
-    ("py:exc", "OSError"),
-    ("py:exc", "RuntimeError"),
-    ("py:exc", "TypeError"),
-    ("py:exc", "ValueError"),
+    ('py:class', 'bool'),
+    ('py:class', 'bytearray'),
+    ('py:class', 'bytes'),
+    ('py:class', 'callable'),
+    ('py:class', 'dict'),
+    ('py:class', 'float'),
+    ('py:class', 'int'),
+    ('py:class', 'iter'),
+    ('py:class', 'list'),
+    ('py:class', 'object'),
+    ('py:class', 'str'),
+    ('py:class', 'tuple'),
+    ('py:exc', 'OSError'),
+    ('py:exc', 'RuntimeError'),
+    ('py:exc', 'TypeError'),
+    ('py:exc', 'ValueError'),
 ]
 
 # not sure why, but this is needed for typing.IO in uselect
-nitpick_ignore.append(("py:obj", "typing.IO"))
+nitpick_ignore.append(('py:class', 'IO'))
 
-# MaybeAwaitable* stub types have no documented target; the awaitable
-# extension renders them as an "await" prefix instead, but the raw names can
-# still leak into signatures (e.g. overloads), so suppress those warnings.
-# Likewise, collections.abc types have no link target without intersphinx.
-nitpick_ignore_regex = [
-    ("py:class", r"MaybeAwaitable\w*"),
-    ("py:class", r"collections\.abc\.\w+"),
-]
+# Workaround until change below is released.
+# https://github.com/sphinx-doc/sphinx/commit/86091934db5ec593b4b0c982b7f08f3231ef995b
+nitpick_ignore.extend([
+    ('py:class', '0'),
+    ('py:class', '1'),
+    ('py:class', '2'),
+    ('py:class', '3'),
+    ('py:class', 'big'),
+    ('py:class', 'little'),
+])
 
 # -- Autodoc options ------------------------------------------------------
 
-autodoc_member_order = "bysource"
+autodoc_member_order = 'bysource'
 autodoc_default_options = {
-    "members": True,
-    "undoc-members": True,
+    'members': True,
+    'undoc-members': True,
 }
-autoclass_content = "both"  # This ensures init arguments are not ignored
+autoclass_content = 'both'  # This ensures init arguments are not ignored
 add_module_names = False  # Hide module name
 
 # -- Options for HTML output ----------------------------------------------
 
-# The theme to use for HTML and HTML Help pages.  Since sphinx-rtd-theme 1.2
-# themes are registered via entry points, so setting html_theme is all that
-# is needed (no extensions entry or html_theme_path).
-html_theme = "sphinx_rtd_theme"
+if ON_RTD:
+    html_theme = 'default'
+else:
+    import sphinx_rtd_theme
+    html_theme = 'sphinx_rtd_theme'
+    html_theme_path = [sphinx_rtd_theme.get_html_theme_path()]
+
+html_context = {
+    'disclaimer': _DISCLAIMER,
+}
+
+# The theme to use for HTML and HTML Help pages.  See the documentation for
+# a list of builtin themes.
+#
+# html_theme = 'alabaster'
 
 # Theme options are theme-specific and customize the look and feel of a theme
 # further.  For a list of options available for each theme, see the
 # documentation.
+#
 html_theme_options = {
-    # Hide the next/previous buttons at the bottom of each page.
-    "prev_next_buttons_location": None,
-}
-
-html_show_sourcelink = False
-html_copy_source = False
-
-html_context = {
-    "disclaimer": _DISCLAIMER,
+   'style_external_links': True,
+   'logo_only': True,
 }
 
 # Add any paths that contain custom static files (such as style sheets) here,
 # relative to this directory. They are copied after the builtin static files,
 # so a file named "default.css" will overwrite the builtin "default.css".
-html_static_path = ["../common/_static"]
+html_static_path = ['../common/_static']
+
+# Custom sidebar templates, must be a dictionary that maps document names
+# to template names.
+#
+# This is required for the alabaster theme
+# refs: http://alabaster.readthedocs.io/en/latest/installation.html#sidebars
+html_sidebars = {
+    '**': [
+        'relations.html',  # needs 'show_related': True theme option to display
+        'searchbox.html',
+    ]
+}
 
 # Don't hyperlink to larger images for scaled images.
 html_scaled_image_link = False
@@ -188,22 +203,90 @@ html_scaled_image_link = False
 # -- Options for HTMLHelp output ------------------------------------------
 
 # Output file base name for HTML help builder.
-htmlhelp_basename = "Pybricksdoc"
+htmlhelp_basename = 'Pybricksdoc'
 
 
+# -- Options for LaTeX output ---------------------------------------------
+
+latex_elements = {
+    # The paper size ('letterpaper' or 'a4paper').
+    #
+    # 'papersize': 'letterpaper',
+
+    # The font size ('10pt', '11pt' or '12pt').
+    #
+    # 'pointsize': '10pt',
+
+    # Additional stuff for the LaTeX preamble.
+    #
+    'preamble': r'''
+    \usepackage{CJKutf8}
+    \makeatletter
+    \fancypagestyle{normal}{
+        \fancyhf{}
+        \fancyfoot[R]{{\py@HeaderFamily\thepage}}
+        \fancyfoot[C]{\raisebox{-7mm}{\tiny %(disclaimer)s}}
+        \fancyhead[L]{{\py@HeaderFamily \@title}}
+        \fancyhead[R]{{\py@HeaderFamily \py@release}}
+        \renewcommand{\headrulewidth}{0.4pt}
+        \renewcommand{\footrulewidth}{0.4pt}
+    }
+    \fancypagestyle{plain}{
+        \fancyhf{}
+        \fancyfoot[R]{{\py@HeaderFamily\thepage}}
+        \fancyfoot[C]{\raisebox{-7mm}{\tiny %(disclaimer)s}}
+        \renewcommand{\headrulewidth}{0.4pt}
+        \renewcommand{\footrulewidth}{0.4pt}
+    }
+    \makeatother
+    ''' % {
+        'disclaimer': ' '.join((_DISCLAIMER, '©', copyright)),
+    },
+
+    # Latex figure (float) alignment
+    #
+    # 'figure_align': 'htbp',
+    'extraclassoptions': 'openany,oneside',
+
+    'releasename': 'Version',
+}
+
+# Grouping the document tree into LaTeX files. List of tuples
+# (source start file, target name, title,
+#  author, documentclass [howto, manual, or own class]).
+latex_documents = [
+    (master_doc, ''.join([project, '-v', version, '.tex']), _TITLE,
+     author, 'manual'),
+]
+
 # -- Content control -----------------------------------------------------
 
 
 exclude_patterns = [
-    "messaging.rst",
-    "tools/datalog.rst",
-    "*.rst.txt",
+    'ev3devices.rst',
+    'hubs/ev3brick.rst',
+    'hubs/primehub.rst',
+    'geometry.rst',
+    'iodevices/analogsensor.rst',
+    'iodevices/dcmotor.rst',
+    'iodevices/ev3devsensor.rst',
+    'iodevices/i2cdevice.rst',
+    'iodevices/lumpdevice.rst',
+    'iodevices/lwp3device.rst',
+    'iodevices/uartdevice.rst',
+    'media.rst',
+    'messaging.rst',
+    'nxtdevices.rst',
+    'tools/datalog.rst'
 ]
 
 
 # One entry per manual page. List of tuples
 # (source start file, name, description, authors, manual section).
-man_pages = [(master_doc, "pybricks", "Pybricks Documentation", [author], 1)]
+man_pages = [
+    (master_doc, 'pybricks', 'Pybricks Documentation',
+     [author], 1)
+]
 
 
 # -- Options for Texinfo output -------------------------------------------
@@ -212,126 +295,33 @@ man_pages = [(master_doc, "pybricks", "Pybricks Documentation", [author], 1)]
 # (source start file, target name, title, author,
 #  dir menu entry, description, category)
 texinfo_documents = [
-    (
-        master_doc,
-        "Pybricks",
-        "Pybricks Documentation",
-        author,
-        "Pybricks",
-        "One line description of project.",
-        "Miscellaneous",
-    ),
+    (master_doc, 'Pybricks', 'Pybricks Documentation',
+     author, 'Pybricks', 'One line description of project.',
+     'Miscellaneous'),
 ]
 
 
 # -- .. availability:: directive
 
-
 class AvailabilityDirective(Directive):
     has_content = True
     option_spec = {
-        "movehub": flag,
-        "cityhub": flag,
-        "technichub": flag,
-        "ev3dev-stretch": flag,
+        'movehub': flag,
+        'cityhub': flag,
+        'technichub': flag,
+        'ev3dev-stretch': flag,
     }
 
     def run(self):
         if not self.options:
-            raise self.error("Must specify at least one platform.")
+            raise self.error('Must specify at least one platform.')
         # TODO: make links to platform pages
-        return [
-            nodes.emphasis(text="Availability: "),
-            nodes.Text(", ".join(self.options)),
-        ]
-
-
-def on_missing_reference(
-    app: Sphinx, env: BuildEnvironment, node: pending_xref, contnode: nodes.Element
-) -> nodes.Element:
-    # The Number type alias is on the Signals and Units page instead of on the
-    # pybricks.parameters page so normal resolution doesn't work
-    if node["reftype"] == "class" and node["reftarget"] == "Number":
-        return make_refnode(
-            app.builder, node["refdoc"], "signaltypes", "numbers", contnode
-        )
-
-    # References with special characters can't exist, so we have to suppress
-    # warnings when Sphinx tries to cross reference units like deg/s. For
-    # consistency, we also treat units without special characters this way.
-    for unit in [
-        "dBm",
-        "deg",
-        "deg/s",
-        "deg/s²",
-        "mm",
-        "mm/s",
-        "mm/s²",
-        "%",
-        "mV",
-        "mA",
-        "ms",
-        "mNm",
-        "Hz",
-        "°C",
-        "J",
-        "Ω",
-        "N",
-    ]:
-        try:
-            # If they match on raw source, we are dealing with argument types.
-            if unit == contnode.rawsource:
-                # Return as-is to suppress missing cross reference warning. We
-                # could make this more fancy by returning an xref node that links
-                # to the signals page.
-                return contnode
-
-        except AttributeError:
-            pass
-
-        # Return types are denoted as "int: deg"
-        try:
-            # Try to unpack the node.
-            ret_type, ret_unit = str(contnode).split(": ")
-        except ValueError:
-            # Not a valid format, so skip.
-            continue
-
-        # If it's a match, we could format the node so it looks a bit nicer.
-        # For now just keep the colon notation as is.
-        if unit == ret_unit:
-            return nodes.Text(f"{ret_type}: {ret_unit}")
-
-
-def on_build_finished(app: Sphinx, exception):
-    if exception or app.builder.name != "html":
-        return
-    import json
-    from sphinx.util.inventory import InventoryFile
-
-    inv_path = os.path.join(app.outdir, "objects.inv")
-    if not os.path.exists(inv_path):
-        return
-
-    with open(inv_path, "rb") as f:
-        inv = InventoryFile.load(f, "", lambda base, uri: base + uri)
-
-    index = {}
-    for type_key, entries in inv.items():
-        if not type_key.startswith("py:"):
-            continue
-        for name, item in entries.items():
-            index[name] = item.uri
-
-    out_path = os.path.join(app.outdir, "namespace_index.json")
-    with open(out_path, "w") as f:
-        json.dump(index, f, indent=2, sort_keys=True)
+        return [nodes.emphasis(text='Availability: '),
+                nodes.Text(', '.join(self.options))]
 
 
 def setup(app: Sphinx):
-    app.add_directive("availability", AvailabilityDirective)
-    app.connect("missing-reference", on_missing_reference)
-    app.connect("build-finished", on_build_finished)
+    app.add_directive('availability', AvailabilityDirective)
 
 
 # -- Python domain hacks ---------------------------------------------------

doc/common/extensions/awaitable.py

@@ -1,61 +0,0 @@
-"""Show ``await`` in front of multitasking functions and methods.
-
-The Pybricks API returns awaitable objects when a run loop is active but
-blocks otherwise. Such functions are annotated with ``MaybeAwaitable*``
-return types. This extension:
-
-* makes autodoc treat functions/methods returning ``MaybeAwaitable*`` as
-  async (there is no public hook for this, so ``is_async`` is patched);
-* renders the signature prefix as ``await`` (linked to the multitasking
-  section in tools) instead of ``async``, which better matches how users
-  call these functions.
-"""
-
-from collections.abc import Sequence
-
-from docutils import nodes
-from sphinx.addnodes import desc_sig_keyword
-from sphinx.application import Sphinx
-from sphinx.domains.python import PyFunction, PyMethod, type_to_xref
-from sphinx.ext.autodoc._property_types import _FunctionDefProperties
-
-
-def _is_async(self: _FunctionDefProperties) -> bool:
-    if "async" in self.properties:
-        return True
-
-    try:
-        return_type = self._obj.__annotations__["return"]
-    except (AttributeError, KeyError):
-        return False
-
-    return "MaybeAwaitable" in str(return_type)
-
-
-class _AwaitPrefixMixin:
-    """Replaces the ``async`` keyword prefix with a linked ``await``."""
-
-    def get_signature_prefix(self, sig: str) -> Sequence[nodes.Node]:
-        prefix = []
-        for node in super().get_signature_prefix(sig):
-            if isinstance(node, desc_sig_keyword) and node.astext() == "async":
-                node = type_to_xref("await", self.env, suppress_prefix=True)
-            prefix.append(node)
-        return prefix
-
-
-class PybricksPyFunction(_AwaitPrefixMixin, PyFunction):
-    pass
-
-
-class PybricksPyMethod(_AwaitPrefixMixin, PyMethod):
-    pass
-
-
-def setup(app: Sphinx):
-    _FunctionDefProperties.is_async = property(_is_async)
-
-    app.add_directive_to_domain("py", "function", PybricksPyFunction, override=True)
-    app.add_directive_to_domain("py", "method", PybricksPyMethod, override=True)
-
-    return {"parallel_read_safe": True}

doc/common/extensions/blockimg.py

@@ -1,41 +0,0 @@
-from pathlib import Path
-
-from docutils import nodes
-from docutils.parsers.rst import Directive
-
-SPHINX_IMAGE_PATH = "blockimg"
-
-
-def get_svg_content(file_path):
-    with open(file_path, "r", encoding="utf-8") as file:
-        return file.read()
-
-
-# Global variable to store the app object
-app = None
-
-
-class BlockImageDirective(Directive):
-    has_content = False
-    required_arguments = 1
-    optional_arguments = 0
-
-    def run(self):
-        # Adjust the image path
-        file_name = self.arguments[0] + ".svg"
-        file_path = Path(app.srcdir) / SPHINX_IMAGE_PATH / file_name
-
-        # Read the SVG content
-        svg_content = get_svg_content(file_path)
-
-        # Create a raw HTML node with the SVG content
-        raw_html = f'<div class="svg-container">{svg_content}</div>'
-        raw_node = nodes.raw("", raw_html, format="html")
-
-        return [raw_node]
-
-
-def setup(apparg):
-    global app
-    app = apparg
-    app.add_directive("blockimg", BlockImageDirective)

doc/common/extensions/classlink.py

@@ -3,6 +3,7 @@ from docutils.parsers.rst import Directive
 
 
 class PybricksClasslinkDirective(Directive):
+
     required_arguments = 1
     optional_arguments = 1
 
@@ -12,23 +13,21 @@ class PybricksClasslinkDirective(Directive):
         link = name if len(self.arguments) == 1 else self.arguments[1]
 
         html = (
-            f'<a href="{link.lower()}.html">'
-            + '<dl class="py class">'
-            + "<dt>"
-            + '<em class="property">class </em>'
-            + '<code class="sig-name descname">'
-            + name
-            + "</code>"
-            + "</dt>"
-            + "<dd></dd>"
-            + "</dl>"
-            + "</a>"
+            '<a href="{0}.html">'.format(link.lower()) +
+            '<dl class="py class">' +
+            '<dt>' +
+            '<em class="property">class </em>' +
+            '<code class="sig-name descname">' + name + '</code>' +
+            '</dt>' +
+            '<dd></dd>' +
+            '</dl>' +
+            '</a>'
         )
 
         # Return the node
-        node = nodes.raw("", html, format="html")
+        node = nodes.raw('', html, format="html")
         return [node]
 
 
 def setup(app):
-    app.add_directive_to_domain("py", "pybricks-classlink", PybricksClasslinkDirective)
+    app.add_directive_to_domain('py', 'pybricks-classlink', PybricksClasslinkDirective)

doc/common/extensions/color.py

@@ -1,12 +1,11 @@
-from colorsys import hsv_to_rgb
-
 from docutils import nodes
 from docutils.parsers.rst import Directive
-
 from pybricks.parameters import Color
+from colorsys import hsv_to_rgb
 
 
 class PybricksColorDirective(Directive):
+
     required_arguments = 1
 
     def run(self):
@@ -17,25 +16,28 @@ class PybricksColorDirective(Directive):
         color = getattr(Color, name)
 
         # Convert HSV to RGB
-        r, g, b = hsv_to_rgb(color.h / 360, color.s / 100, color.v / 100)
+        r, g, b = hsv_to_rgb(color.h/360, color.s/100, color.v/100)
 
         # Convert RGB to HEX
-        rgbhex = f"#{round(r * 255):02x}{round(g * 255):02x}{round(b * 255):02x}"
+        rgbhex = '#{0:02x}{1:02x}{2:02x}'.format(
+            round(r*255),
+            round(g*255),
+            round(b*255)
+        )
 
         # Render a small block of the given color
-        css = f"background-color: {rgbhex}; color: {rgbhex}; width: 50px;"
+        css = "background-color: {0}; color: {0}; width: 50px;".format(rgbhex)
 
         if name == "WHITE":
-            css += (
-                "border-style: solid; border-width: 0.5px;" + "border-color: #666666;"
-            )
+            css += "border-style: solid; border-width: 0.5px;" + \
+                   "border-color: #666666;"
 
-        html = f'<div id="test" style="{css}">_</div>'
+        html = '<div id="test" style="{0}">_</div>'.format(css)
 
         # Return the node
-        node = nodes.raw("", html, format="html")
+        node = nodes.raw('', html, format="html")
         return [node]
 
 
 def setup(app):
-    app.add_directive_to_domain("py", "pybricks-color", PybricksColorDirective)
+    app.add_directive_to_domain('py', 'pybricks-color', PybricksColorDirective)

doc/common/extensions/docstring_signature.py

@@ -1,51 +0,0 @@
-"""Make explicit docstring signatures win over ``@overload`` signatures.
-
-Workaround for https://github.com/sphinx-doc/sphinx/issues/10436: when a
-function or method has overloads, autodoc unconditionally replaces the
-signature(s) found in the docstring with the overload signatures. Classes
-already behave correctly, so this only patches the function/method path. There
-is no event hook for this in autodoc's new (Sphinx 9) pipeline, so
-``_format_signatures`` is wrapped: when a docstring signature is present,
-``autodoc_typehints`` is set to ``'none'`` for that single call, which
-disables only the overload substitution branch.
-"""
-
-from sphinx.application import Sphinx
-from sphinx.ext.autodoc._dynamic import _loader, _signatures
-from sphinx.ext.autodoc._shared import _AutodocConfig
-
-_orig_format_signatures = _signatures._format_signatures
-
-
-def _format_signatures(**kwargs):
-    config: _AutodocConfig = kwargs["config"]
-    docstrings = kwargs.get("docstrings")
-    options = kwargs["options"]
-    props = kwargs["props"]
-
-    if (
-        kwargs.get("args") is None
-        and docstrings
-        and config.autodoc_docstring_signature
-        and config.autodoc_typehints != "none"
-        and props.obj_type in {"function", "method", "decorator"}
-    ):
-        # Probe on a copy: extraction strips signature lines from docstrings.
-        docstring_signatures = _signatures._extract_signatures_from_docstrings(
-            [list(lines) for lines in docstrings],
-            props=props,
-            tab_width=options._tab_width,
-        )
-        if docstring_signatures:
-            values = {name: getattr(config, name) for name in _AutodocConfig.__slots__}
-            values["autodoc_typehints"] = "none"
-            kwargs["config"] = _AutodocConfig(**values)
-
-    return _orig_format_signatures(**kwargs)
-
-
-def setup(app: Sphinx):
-    _signatures._format_signatures = _format_signatures
-    _loader._format_signatures = _format_signatures
-
-    return {"parallel_read_safe": True}

doc/common/extensions/nestedmethod.py

@@ -1,41 +0,0 @@
-"""Provides the ``autonestedmethod`` directive.
-
-Like ``automethod``, but resolves dotted names such as ``control.limits``
-relative to the class documented by the enclosing ``autoclass`` directive.
-Plain ``automethod`` treats everything before the last dot as a module/class
-path, so ``control.limits`` would be looked up as an attribute of the current
-*module* instead of the current class. Resolving the class here keeps shared
-include fragments module-neutral.
-"""
-
-from sphinx.util import logging
-from sphinx.util.docutils import SphinxDirective
-
-logger = logging.getLogger(__name__)
-
-
-class AutoNestedMethodDirective(SphinxDirective):
-    required_arguments = 1
-    has_content = False
-
-    def run(self):
-        current = self.env.current_document
-        module = current.autodoc_module or self.env.ref_context.get("py:module")
-        cls = current.autodoc_class or self.env.ref_context.get("py:class")
-
-        if not module or not cls:
-            logger.warning(
-                "autonestedmethod:: %s used outside of an autoclass context",
-                self.arguments[0],
-                location=self.get_location(),
-            )
-            return []
-
-        return self.parse_text_to_nodes(
-            f".. automethod:: {module}::{cls}.{self.arguments[0]}"
-        )
-
-
-def setup(app):
-    app.add_directive("autonestedmethod", AutoNestedMethodDirective)
-    return {"parallel_read_safe": True}

doc/common/extensions/requirements-static.py

@@ -1,7 +1,8 @@
-from os import makedirs, path
+from os import path, makedirs
 
 from docutils import nodes
 from docutils.parsers.rst import Directive
+
 from sphinx.util.osutil import copyfile
 
 # Base feature set.
@@ -9,81 +10,55 @@ FEATURES_SMALL = set()
 
 # Medium feature set.
 FEATURES_MEDIUM = FEATURES_SMALL | {
-    "pybricks-common-control",
-    "pybricks-iodevices",
-    "stm32-extra",
-    "stm32-float",
-    "pybricks-frozen",
+    'pybricks-geometry',
+    'pybricks-iodevices',
+    'stm32-extra',
+    'stm32-float',
 }
 
+# Large feature set.
+FEATURES_LARGE = FEATURES_MEDIUM | set()
+
 # Features per hub.
 HUB_FEATURES = {
-    "movehub": {"movehub", "ble", "pupdevices"} | FEATURES_SMALL,
-    "cityhub": {"cityhub", "ble", "pupdevices"} | FEATURES_MEDIUM,
-    "technichub": {"technichub", "gyro", "xbox-controller", "ble", "pupdevices"}
-    | FEATURES_MEDIUM,
-    "primehub": {
-        "primehub",
-        "inventorhub",
-        "light-matrix",
-        "gyro",
-        "xbox-controller",
-        "ble",
-        "ble-extra",
-        "pupdevices",
-    }
-    | FEATURES_MEDIUM,
-    "inventorhub": {
-        "primehub",
-        "inventorhub",
-        "light-matrix",
-        "gyro",
-        "xbox-controller",
-        "ble",
-        "ble-extra",
-        "pupdevices",
-    }
-    | FEATURES_MEDIUM,
-    "essentialhub": {
-        "essentialhub",
-        "gyro",
-        "xbox-controller",
-        "ble",
-        "ble-extra",
-        "pupdevices",
-    }
-    | FEATURES_MEDIUM,
-    "ev3brick": {"ev3devices", "nxtdevices", "image"} | FEATURES_MEDIUM,
+    'movehub': {'movehub'} | FEATURES_SMALL,
+    'cityhub': {'cityhub'} | FEATURES_MEDIUM,
+    'technichub': {'technichub'} | FEATURES_MEDIUM,
+    'primehub':  {'primehub', 'inventorhub'} | FEATURES_LARGE,
+    'inventorhub':  {'primehub', 'inventorhub'} | FEATURES_LARGE,
 }
 
 
 class PybricksRequirementsStaticDirective(Directive):
+
     required_arguments = 0
     optional_arguments = 10
 
     def run(self):
+
         # Copy required resources to static
         # CC BY-SA 4.0 via https://stackoverflow.com/a/63728208
         env = self.state.document.settings.env
 
-        destdir = path.join(env.app.builder.outdir, "_images")
+        destdir = path.join(env.app.builder.outdir, '_images')
         if not path.exists(destdir):
             makedirs(destdir)
 
         for hub in HUB_FEATURES:
-            uri = f"compat_{hub}.png"
-            src_uri = path.join(env.app.builder.srcdir, "diagrams", uri)
-            build_uri = path.join(env.app.builder.outdir, "_images", uri)
-            copyfile(src_uri, build_uri)
+            for compat in ("true", "false"):
+                uri = 'compat_{0}_{1}_label.png'.format(hub, compat)
+                src_uri = path.join(env.app.builder.srcdir, 'images', uri)
+                build_uri = path.join(env.app.builder.outdir, '_images', uri)
+                copyfile(src_uri, build_uri)
 
         # Get requirements from sphinx-directive.
         requirements = set(self.arguments)
 
         # Cell with image of a hub.
         hub_cell = """
-        <th background="{0}_images/compat_{1}.png" class="requirements-table-th requirements-table-th">
-        {2}
-        </th>
+        <th><div class="align-default">
+        <img alt="" src="{0}_images/compat_{1}_{2}_label.png">
+        </div></th>
         """
 
         # Determine how far up the tree we are to set correct image path.
@@ -92,34 +67,35 @@ class PybricksRequirementsStaticDirective(Directive):
         depth_path = "../" * depth
 
         # Table row with hub images.
-        compat_row = "".join(
-            [
-                hub_cell.format(
-                    depth_path, hub, "✅" if requirements <= features else "❌"
-                )
-                for hub, features in HUB_FEATURES.items()
-            ]
-        )
+        compat_row = "".join([
+            hub_cell.format(
+                depth_path,
+                hub,
+                "true" if requirements <= features else "false")
+            for hub, features in HUB_FEATURES.items()
+        ])
 
         # Generate full table.
-        html = f"""
+        html = """
         <div class="wy-table-responsive">
-            <table class="docutils align-default requirements-table">
+            <table class="docutils align-default">
                 <tbody>
                     <tr>
-                        {compat_row}
+                        {0}
                     </tr>
                 </tbody>
             </table>
         </div>
-        """
+        """.format(compat_row)
 
         # Return the node.
-        node = nodes.raw("", html, format="html")
+        node = nodes.raw('', html, format="html")
         return [node]
 
 
 def setup(app):
     app.add_directive_to_domain(
-        "py", "pybricks-requirements-static", PybricksRequirementsStaticDirective
+        'py',
+        'pybricks-requirements-static',
+        PybricksRequirementsStaticDirective
     )

doc/common/extensions/requirements.css

@@ -42,19 +42,3 @@ SOFTWARE. */
     margin-bottom: 0px;
 }
 
-.requirements-table {
-    width: 100%;
-}
-
-.requirements-table-th {
-    background-size:contain;
-    background-repeat: no-repeat;
-    text-align: right;
-    padding: 6px !important;
-  }
-
-.requirements-table-th:after {
-    content: '';
-    display: block;
-    margin-top: 80%;
-  }

doc/common/extensions/requirements.py

@@ -22,33 +22,32 @@
 
 
 import os
-from typing import ClassVar
-
-from docutils import nodes
 from docutils.parsers.rst import Directive, directives
+from docutils import nodes
 from docutils.statemachine import StringList
-from sphinx.util import logging
 from sphinx.util.osutil import copyfile
+from sphinx.util import logging
 
-CSS_FILE = "requirements.css"
-JS_FILE = "requirements.js"
+
+CSS_FILE = 'requirements.css'
+JS_FILE = 'requirements.js'
 
 
 class PybricksRequirementsDirective(Directive):
     has_content = True
-    option_spec: ClassVar = {"header": directives.unchanged}
+    option_spec = {'header': directives.unchanged}
 
     required_arguments = 0
     optional_arguments = 10
 
     def run(self):
         node = nodes.container()
-        node["classes"].append("toggle-content")
+        node['classes'].append('toggle-content')
 
         par = nodes.container()
-        par["classes"].append("toggle-header")
+        par['classes'].append('toggle-header')
 
-        content = ".. pybricks-requirements-static:: " + " ".join(self.arguments)
+        content = '.. pybricks-requirements-static:: ' + " ".join(self.arguments)
 
         self.state.nested_parse(StringList([content]), self.content_offset, node)
 
@@ -61,20 +60,20 @@ def add_assets(app):
 
 
 def copy_assets(app, exception):
-    if app.builder.name not in ["html", "readthedocs"] or exception:
+    if app.builder.name not in ['html', 'readthedocs'] or exception:
         return
     logger = logging.getLogger(__name__)
-    logger.info("Copying requirements stylesheet/javascript... ", nonl=True)
-    dest = os.path.join(app.builder.outdir, "_static", CSS_FILE)
+    logger.info('Copying requirements stylesheet/javascript... ', nonl=True)
+    dest = os.path.join(app.builder.outdir, '_static', CSS_FILE)
     source = os.path.join(os.path.abspath(os.path.dirname(__file__)), CSS_FILE)
     copyfile(source, dest)
-    dest = os.path.join(app.builder.outdir, "_static", JS_FILE)
+    dest = os.path.join(app.builder.outdir, '_static', JS_FILE)
     source = os.path.join(os.path.abspath(os.path.dirname(__file__)), JS_FILE)
     copyfile(source, dest)
-    logger.info("done")
+    logger.info('done')
 
 
 def setup(app):
-    app.add_directive("pybricks-requirements", PybricksRequirementsDirective)
-    app.connect("builder-inited", add_assets)
-    app.connect("build-finished", copy_assets)
+    app.add_directive('pybricks-requirements', PybricksRequirementsDirective)
+    app.connect('builder-inited', add_assets)
+    app.connect('build-finished', copy_assets)

doc/common/extensions/versionchanged.py

@@ -1,31 +0,0 @@
-"""This directive hides the builtin directives
-    * versionchanged
-    * versionadded
-    * deprecated
-when building documentation with the 'ide' tag.
-"""
-
-from docutils import nodes
-from docutils.parsers.rst import Directive
-
-
-class PybricksVersionDirective(Directive):
-    has_content = True
-
-    def run(self):
-        html = ""
-        node = nodes.raw("", html, format="html")
-        return [node]
-
-
-def setup(app):
-    if app.tags.has("ide"):
-        app.add_directive_to_domain(
-            "py", "deprecated", PybricksVersionDirective, override=True
-        )
-        app.add_directive_to_domain(
-            "py", "versionadded", PybricksVersionDirective, override=True
-        )
-        app.add_directive_to_domain(
-            "py", "versionchanged", PybricksVersionDirective, override=True
-        )

doc/main/blockimg/LICENSE

@@ -1 +0,0 @@
-Copyright (c) 2024 The Pybricks Authors - All rights reserved

doc/main/blockimg/pybricks_blockBatteryMeasure_CityHub_battery.current.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 335.8125 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="335.8125" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="TM:xt;sb{[(ouv1G)6=7" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 293.8125 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -293.8125 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="t#MJ)EYE%Nd$JbJg$lf," transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 73.3359375 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -73.3359375 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">city hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(69.3359375,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(169.3359375,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(230.6875,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="91.125" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">current</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(71.125,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBatteryMeasure_CityHub_battery.voltage.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 336.703125 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="336.703125" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="Aw^Mpc.{F?hs$,|l9?/w" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 294.703125 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -294.703125 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="37AlsSCP[IW2ldqWM~%G" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 73.3359375 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -73.3359375 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">city hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(69.3359375,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(169.3359375,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(230.6875,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="92.015625" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">voltage</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(72.015625,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBatteryMeasure_EssentialHub_battery.current.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 376.7265625 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="376.7265625" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="VR.uH`([INlm($[u*-qB" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 334.7265625 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -334.7265625 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="nZ+o}Pq.^5V`TMQ}UU}O" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 114.25 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -114.25 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">essential hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(110.25,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(210.25,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(271.6015625,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="91.125" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">current</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(71.125,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBatteryMeasure_EssentialHub_battery.voltage.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 377.6171875 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="377.6171875" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="#U3R,_0;K#BQs]w#pvew" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 335.6171875 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -335.6171875 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="FkCg4^C)Gv8gD2+sD4+Y" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 114.25 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -114.25 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">essential hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(110.25,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(210.25,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(271.6015625,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="92.015625" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">voltage</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(72.015625,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBatteryMeasure_InventorHub_battery.current.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 371.359375 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="371.359375" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="/_mt(`U#Wp/mHCHw{UPZ" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 329.359375 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -329.359375 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="BTEgeCu?;zzs!1zlA0/9" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 108.8828125 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -108.8828125 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">inventor hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(104.8828125,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(204.8828125,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(266.234375,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="91.125" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">current</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(71.125,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBatteryMeasure_InventorHub_battery.voltage.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 372.25 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="372.25" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="XHIL)43~Y;BOk+pm|]+X" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 330.25 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -330.25 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="=nD$@1E**Clx=jU^fP9!" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 108.8828125 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -108.8828125 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">inventor hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(104.8828125,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(204.8828125,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(266.234375,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="92.015625" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">voltage</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(72.015625,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBatteryMeasure_MoveHub_battery.current.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 350.0390625 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="350.0390625" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="Y?1*1D2ko!i~gk6-w#k_" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 308.0390625 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -308.0390625 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="cvy8yY-3n8Wk8:eXNm%N" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 87.5625 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -87.5625 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">move hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(83.5625,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(183.5625,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(244.9140625,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="91.125" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">current</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(71.125,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBatteryMeasure_MoveHub_battery.voltage.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 350.9296875 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="350.9296875" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="O].[M@qC{]{RQ37T^}n*" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 308.9296875 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -308.9296875 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id=";XcZ`(Jg-QHT6;@9irpn" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 87.5625 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -87.5625 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">move hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(83.5625,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(183.5625,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(244.9140625,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="92.015625" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">voltage</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(72.015625,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBatteryMeasure_PrimeHub_battery.current.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 351.8125 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="351.8125" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="VQOntrQLF]Hloj]P@}[h" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 309.8125 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -309.8125 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="WEahWZni:i=BOgtfrRX$" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 89.3359375 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -89.3359375 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">prime hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(85.3359375,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(185.3359375,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(246.6875,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="91.125" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">current</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(71.125,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBatteryMeasure_PrimeHub_battery.voltage.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352.703125 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="352.703125" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="l2+(Sy-$bK^UZVH8slg[" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 310.703125 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -310.703125 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="m#l9@/ZS#$6Bpih66vFR" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 89.3359375 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -89.3359375 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">prime hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(85.3359375,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(185.3359375,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(246.6875,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="92.015625" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">voltage</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(72.015625,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBatteryMeasure_TechnicHub_battery.current.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 364.2578125 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="364.2578125" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="mhR%KRMic=.FV{|c_t5a" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 322.2578125 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -322.2578125 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="h1xvwMNyzH@Q.[+@Ah)Z" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 101.78125 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -101.78125 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">technic hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(97.78125,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(197.78125,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(259.1328125,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="91.125" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">current</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(71.125,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBatteryMeasure_TechnicHub_battery.voltage.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 365.1484375 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="365.1484375" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern9387213926908944)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="VC`B!I?5;,-QT0D#xQuz" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 323.1484375 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -323.1484375 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="(]VvG{675B%eXPE*=G[5" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 101.78125 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -101.78125 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,6.5)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9.5">technic hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(97.78125,3.5)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8ZyBmaWxsPSIjZmZmIiBzdHJva2Utd2lkdGg9IjAiPgo8cmVjdCB4PSI3LjcyNjUiIHk9IjIuMDkyNWUtNyIgd2lkdGg9IjkuNTQ3IiBoZWlnaHQ9IjMuOTM2OCIgcng9Ii43NTg0MSIgcnk9Ii43MjU0MyIvPgo8cGF0aCBkPSJtNS4xMDYzIDMuMDIyMmMtMC4zMzYxMy0xZS03IC0wLjYwNjI1IDAuMzEwMTctMC42MDYyNSAwLjY5NTMxdjIwLjU4N2MwIDAuMzg1MTQgMC4yNzAxMiAwLjY5NTMxIDAuNjA2MjUgMC42OTUzMWgxNC43ODdjMC4zMzYxMyAwIDAuNjA2MjUtMC4zMTAxNyAwLjYwNjI1LTAuNjk1MzF2LTIwLjU4N2MwLTAuMzg1MTQtMC4yNzAxMi0wLjY5NTMxLTAuNjA2MjUtMC42OTUzMXptMC45NDIxOSAyLjE4MTZoMTIuOTAzdjUuMzYxM2gtMTIuOTAzeiIvPgo8L2c+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(197.78125,10.5)"><text class="blocklyText" dominant-baseline="central" x="0" y="9.5">battery</text></g><g class="blocklyEditableText" transform="translate(259.1328125,4.9)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="30.2" width="92.015625" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="15.1">voltage</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(72.015625,9.1)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBleObserve2.svg

@@ -1,994 +0,0 @@
-<!-- Copyright (c) 2024 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 275.3828125 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="275.3828125" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern770586695409901)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-.blocklyMultilineText {
-    fill: #fff !important;
-}
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-
-  .controlsIconStyleLightTheme {
-    opacity: 0.2;
-  }
-  .controlsIconStyleLightTheme:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyleLightTheme:active {
-    opacity: 0.6;
-  }
-  
-
-  .controlsIconStyleDarkTheme {
-    opacity: 0.4;
-    filter: invert(1);
-  }
-  .controlsIconStyleDarkTheme:hover {
-    opacity: 0.6;
-    filter: invert(1);
-  }
-  .controlsIconStyleDarkTheme:active {
-    opacity: 0.8;
-    filter: invert(1);
-  }
-  
-</style><g transform="translate(1, 1)"><g data-id="yHRh+a$N=A!M1D(8v*f[" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 233.3828125 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -233.3828125 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="q33[pxK@e!ZG[~ugQ_H_" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 51.1171875 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -51.1171875 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">radio</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(47.1171875,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCBkPSJtMSAxNy43NyAxMC44ODUtMTAuODg1LTUuNTgxOS01LjU4MTl2MjIuMzkzbDUuNjc0NC01LjY3NDQtMTAuODU1LTEwLjg1NSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIvPgo8cGF0aCBkPSJtMjAuMjEzIDMuNWExMi43MjggMTIuNzI4IDAgMCAxIDMuNzI3OSA5IDEyLjcyOCAxMi43MjggMCAwIDEtMy43Mjc5IDkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiLz4KPHBhdGggZD0ibTE3LjA1OSA3LjQwNzVhNy4yMDE4IDcuMjAxOCAwIDAgMSAyLjEwOTMgNS4wOTI0IDcuMjAxOCA3LjIwMTggMCAwIDEtMi4xMDkzIDUuMDkyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIvPgogIDwvZz4KPC9zdmc+"/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(147.1171875,11)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">observe</text></g><g class="blocklyEditableText" transform="translate(216.484375,5.4)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="44.8984375" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="14.6">0</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(24.8984375,8.6)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBleObserve_CityHub.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 297.6015625 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="297.6015625" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="d4%8R0P|NsuWM7/n34f0" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 255.6015625 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -255.6015625 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="RhT/N^Vc%GAY6X/,x6Xr" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 73.3359375 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -73.3359375 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">city hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(69.3359375,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCB0cmFuc2Zvcm09InNjYWxlKC0xLDEpIiBkPSJtLTIwLjc5NCAzLjVhMTIuNzI4IDEyLjcyOCAwIDAgMSAzLjcyNzkgOSAxMi43MjggMTIuNzI4IDAgMCAxLTMuNzI3OSA5IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CjxwYXRoIHRyYW5zZm9ybT0ic2NhbGUoLTEsMSkiIGQ9Im0tMjMuOTQ4IDcuNDA3NWE3LjIwMTggNy4yMDE4IDAgMCAxIDIuMTA5MyA1LjA5MjQgNy4yMDE4IDcuMjAxOCAwIDAgMS0yLjEwOTMgNS4wOTI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CjxwYXRoIGQ9Im0xIDE3Ljc3IDEwLjg4NS0xMC44ODUtNS41ODE5LTUuNTgxOXYyMi4zOTNsNS42NzQ0LTUuNjc0NC0xMC44NTUtMTAuODU1IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(169.3359375,11)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">observe</text></g><g class="blocklyEditableText" transform="translate(238.703125,5.4)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="44.8984375" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="14.6">0</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(24.8984375,8.6)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBleObserve_EssentialHub.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 338.515625 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="338.515625" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="n)t+X~IZdbI-83^2,Bib" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 296.515625 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -296.515625 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="sx|#xWd;!FAj$+ee$`lX" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 114.25 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -114.25 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">essential hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(110.25,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCB0cmFuc2Zvcm09InNjYWxlKC0xLDEpIiBkPSJtLTIwLjc5NCAzLjVhMTIuNzI4IDEyLjcyOCAwIDAgMSAzLjcyNzkgOSAxMi43MjggMTIuNzI4IDAgMCAxLTMuNzI3OSA5IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CjxwYXRoIHRyYW5zZm9ybT0ic2NhbGUoLTEsMSkiIGQ9Im0tMjMuOTQ4IDcuNDA3NWE3LjIwMTggNy4yMDE4IDAgMCAxIDIuMTA5MyA1LjA5MjQgNy4yMDE4IDcuMjAxOCAwIDAgMS0yLjEwOTMgNS4wOTI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CjxwYXRoIGQ9Im0xIDE3Ljc3IDEwLjg4NS0xMC44ODUtNS41ODE5LTUuNTgxOXYyMi4zOTNsNS42NzQ0LTUuNjc0NC0xMC44NTUtMTAuODU1IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(210.25,11)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">observe</text></g><g class="blocklyEditableText" transform="translate(279.6171875,5.4)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="44.8984375" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="14.6">0</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(24.8984375,8.6)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBleObserve_PrimeHub.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 313.6015625 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="313.6015625" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id=";`a0~1?0(%3M`PmNGcP_" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 271.6015625 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -271.6015625 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="IqPhInwvUg`a.0?h;7hK" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 89.3359375 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -89.3359375 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">prime hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(85.3359375,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCB0cmFuc2Zvcm09InNjYWxlKC0xLDEpIiBkPSJtLTIwLjc5NCAzLjVhMTIuNzI4IDEyLjcyOCAwIDAgMSAzLjcyNzkgOSAxMi43MjggMTIuNzI4IDAgMCAxLTMuNzI3OSA5IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CjxwYXRoIHRyYW5zZm9ybT0ic2NhbGUoLTEsMSkiIGQ9Im0tMjMuOTQ4IDcuNDA3NWE3LjIwMTggNy4yMDE4IDAgMCAxIDIuMTA5MyA1LjA5MjQgNy4yMDE4IDcuMjAxOCAwIDAgMS0yLjEwOTMgNS4wOTI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CjxwYXRoIGQ9Im0xIDE3Ljc3IDEwLjg4NS0xMC44ODUtNS41ODE5LTUuNTgxOXYyMi4zOTNsNS42NzQ0LTUuNjc0NC0xMC44NTUtMTAuODU1IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(185.3359375,11)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">observe</text></g><g class="blocklyEditableText" transform="translate(254.703125,5.4)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="44.8984375" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="14.6">0</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(24.8984375,8.6)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockBleObserve_TechnicHub.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 326.046875 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="326.046875" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="E6*-m1HDcv18zKGzs|Y6" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 284.046875 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -284.046875 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="kcT!H4rYvaj]NRg|o}X|" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 101.78125 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -101.78125 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">technic hub</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(97.78125,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCB0cmFuc2Zvcm09InNjYWxlKC0xLDEpIiBkPSJtLTIwLjc5NCAzLjVhMTIuNzI4IDEyLjcyOCAwIDAgMSAzLjcyNzkgOSAxMi43MjggMTIuNzI4IDAgMCAxLTMuNzI3OSA5IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CjxwYXRoIHRyYW5zZm9ybT0ic2NhbGUoLTEsMSkiIGQ9Im0tMjMuOTQ4IDcuNDA3NWE3LjIwMTggNy4yMDE4IDAgMCAxIDIuMTA5MyA1LjA5MjQgNy4yMDE4IDcuMjAxOCAwIDAgMS0yLjEwOTMgNS4wOTI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CjxwYXRoIGQ9Im0xIDE3Ljc3IDEwLjg4NS0xMC44ODUtNS41ODE5LTUuNTgxOXYyMi4zOTNsNS42NzQ0LTUuNjc0NC0xMC44NTUtMTAuODU1IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(197.78125,11)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">observe</text></g><g class="blocklyEditableText" transform="translate(267.1484375,5.4)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="44.8984375" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="14.6">0</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(24.8984375,8.6)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockColor_ColorDistanceSensor_color.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 249.5859375 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="249.5859375" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="Vj{`AcqWBKR:gZzVT_j%" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 207.5859375 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -207.5859375 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="*pG;WRtz9F^6eUcOWG|W" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 64.46875 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -64.46875 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">sensor</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(60.46875,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8Zz4KPGNpcmNsZSBjeD0iMTcuNSIgY3k9IjE3LjUiIHI9IjcuNSIgZmlsbD0iIzFmZjUwMCIgc3R5bGU9Ii13ZWJraXQtZm9udC1zbW9vdGhpbmc6YW50aWFsaWFzZWQiLz4KPGNpcmNsZSBjeD0iNy41IiBjeT0iMTcuNSIgcj0iNy41IiBmaWxsPSIjZjUyOTAwIiBzdHlsZT0iLXdlYmtpdC1mb250LXNtb290aGluZzphbnRpYWxpYXNlZCIvPgo8Y2lyY2xlIGN4PSIxMi41IiBjeT0iNy41IiByPSI3LjUiIGZpbGw9IiMwMDUwZjUiIHN0eWxlPSItd2Via2l0LWZvbnQtc21vb3RoaW5nOmFudGlhbGlhc2VkIi8+CjwvZz4KICA8L2c+Cjwvc3ZnPg=="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g class="blocklyEditableText" transform="translate(160.46875,5.4)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="75.1171875" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="14.6">color</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(55.1171875,8.6)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockColor_ColorDistanceSensor_hsv.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 238.0390625 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="238.0390625" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="cgN)it=q81EV~UJFgM7*" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 196.0390625 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -196.0390625 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="Y};n=;pq.^d|rG--b6VE" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 64.46875 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -64.46875 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">sensor</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(60.46875,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8Zz4KPGNpcmNsZSBjeD0iMTcuNSIgY3k9IjE3LjUiIHI9IjcuNSIgZmlsbD0iIzFmZjUwMCIgc3R5bGU9Ii13ZWJraXQtZm9udC1zbW9vdGhpbmc6YW50aWFsaWFzZWQiLz4KPGNpcmNsZSBjeD0iNy41IiBjeT0iMTcuNSIgcj0iNy41IiBmaWxsPSIjZjUyOTAwIiBzdHlsZT0iLXdlYmtpdC1mb250LXNtb290aGluZzphbnRpYWxpYXNlZCIvPgo8Y2lyY2xlIGN4PSIxMi41IiBjeT0iNy41IiByPSI3LjUiIGZpbGw9IiMwMDUwZjUiIHN0eWxlPSItd2Via2l0LWZvbnQtc21vb3RoaW5nOmFudGlhbGlhc2VkIi8+CjwvZz4KICA8L2c+Cjwvc3ZnPg=="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g class="blocklyEditableText" transform="translate(160.46875,5.4)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="63.5703125" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="14.6">hsv</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(43.5703125,8.6)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockColor_ColorSensor_color.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 293.1484375 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="293.1484375" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="v!-lqi5y#j+;a,_#~iP4" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 251.1484375 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -251.1484375 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="I!X[{ocKU.Gb}31SL(}/" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 108.03125 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -108.03125 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">color sensor</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(104.03125,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8Zz4KPGNpcmNsZSBjeD0iMTcuNSIgY3k9IjE3LjUiIHI9IjcuNSIgZmlsbD0iIzFmZjUwMCIgc3R5bGU9Ii13ZWJraXQtZm9udC1zbW9vdGhpbmc6YW50aWFsaWFzZWQiLz4KPGNpcmNsZSBjeD0iNy41IiBjeT0iMTcuNSIgcj0iNy41IiBmaWxsPSIjZjUyOTAwIiBzdHlsZT0iLXdlYmtpdC1mb250LXNtb290aGluZzphbnRpYWxpYXNlZCIvPgo8Y2lyY2xlIGN4PSIxMi41IiBjeT0iNy41IiByPSI3LjUiIGZpbGw9IiMwMDUwZjUiIHN0eWxlPSItd2Via2l0LWZvbnQtc21vb3RoaW5nOmFudGlhbGlhc2VkIi8+CjwvZz4KICA8L2c+Cjwvc3ZnPg=="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g class="blocklyEditableText" transform="translate(204.03125,5.4)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="75.1171875" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="14.6">color</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(55.1171875,8.6)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockColor_ColorSensor_hsv.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 281.6015625 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="281.6015625" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="MuY[+d=Vng}9NBqPKK#]" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 239.6015625 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -239.6015625 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="qfCc0X*byu?Z[uy?48bI" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 108.03125 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -108.03125 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">color sensor</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(104.03125,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8Zz4KPGNpcmNsZSBjeD0iMTcuNSIgY3k9IjE3LjUiIHI9IjcuNSIgZmlsbD0iIzFmZjUwMCIgc3R5bGU9Ii13ZWJraXQtZm9udC1zbW9vdGhpbmc6YW50aWFsaWFzZWQiLz4KPGNpcmNsZSBjeD0iNy41IiBjeT0iMTcuNSIgcj0iNy41IiBmaWxsPSIjZjUyOTAwIiBzdHlsZT0iLXdlYmtpdC1mb250LXNtb290aGluZzphbnRpYWxpYXNlZCIvPgo8Y2lyY2xlIGN4PSIxMi41IiBjeT0iNy41IiByPSI3LjUiIGZpbGw9IiMwMDUwZjUiIHN0eWxlPSItd2Via2l0LWZvbnQtc21vb3RoaW5nOmFudGlhbGlhc2VkIi8+CjwvZz4KICA8L2c+Cjwvc3ZnPg=="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g class="blocklyEditableText" transform="translate(204.03125,5.4)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="63.5703125" class="blocklyFieldRect blocklyDropdownRect" stroke="#4585a1" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="14.6">hsv</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(43.5703125,8.6)"/></g></g></g></svg>

doc/main/blockimg/pybricks_blockComment.svg

@@ -1,989 +0,0 @@
-<!-- Copyright (c) 2024 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.5 52" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="261.5" height="52" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern29564335225952343)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-
-  .controlsIconStyleLightTheme {
-    opacity: 0.2;
-  }
-  .controlsIconStyleLightTheme:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyleLightTheme:active {
-    opacity: 0.6;
-  }
-  
-
-  .controlsIconStyleDarkTheme {
-    opacity: 0.4;
-    filter: invert(1);
-  }
-  .controlsIconStyleDarkTheme:hover {
-    opacity: 0.6;
-    filter: invert(1);
-  }
-  .controlsIconStyleDarkTheme:active {
-    opacity: 0.8;
-    filter: invert(1);
-  }
-  
-</style><g transform="translate(1, 1)"><g data-id="NZ7WdOar=6yrO_EkGw)K" class="blocklyDraggable"><path class="blocklyPath" stroke="#8f8f8f" fill="#bfbfbf" d=" m 0,0  m 0,4 a 4 4 0 0,1 4,-4  h 5  c 1.6666666666666667,0  2.5,0.75  3.3333333333333335,1.5  l 3.3333333333333335,3  c 0.8333333333333334,0.75  1.6666666666666667,1.5  3.3333333333333335,1.5  h 10  c 1.6666666666666667,0  2.5,-0.75  3.3333333333333335,-1.5  l 3.3333333333333335,-3  c 0.8333333333333334,-0.75  1.6666666666666667,-1.5  3.3333333333333335,-1.5  h 216.5 a 4 4 0 0,1 4,4  v 6  V 38  V 40  V 40 a 4 4 0 0,1 -4,4  h -216.5  c -1.6666666666666667,0  -2.5,0.75  -3.3333333333333335,1.5  l -3.3333333333333335,3  c -0.8333333333333334,0.75  -1.6666666666666667,1.5  -3.3333333333333335,1.5  h -10  c -1.6666666666666667,0  -2.5,-0.75  -3.3333333333333335,-1.5  l -3.3333333333333335,-3  c -0.8333333333333334,-0.75  -1.6666666666666667,-1.5  -3.3333333333333335,-1.5  h -5 a 4 4 0 0,1 -4,-4 z&#10;"/><g transform="translate(8,6.5)"><image height="30px" width="28px" alt="#" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyOCAzMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzLCA1KSI+CiAgICA8cGF0aCBkPSJtMTAuNTYgMy4wNzY0LTQuOTQ1IDE4LjQ2MiIgZmlsbD0iI2ZmZiIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iMyIvPgo8cGF0aCBkPSJtNC4wNTQ2IDguMzAxNmgxOS4xMDYiIGZpbGw9IiNmZmYiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjMiLz4KPHBhdGggZD0ibTIuMTYwNiAxNS4yNjRoMTkuMTA2IiBmaWxsPSIjZmZmIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIzIi8+CjxwYXRoIGQ9Im0xOS4wNTUgMy4wNzY0LTQuOTQ1IDE4LjQ2MiIgZmlsbD0iI2ZmZiIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iMyIvPgogIDwvZz4KPC9zdmc+"/></g><g transform="translate(44,6.5)"><image height="30px" width="3px" alt="" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g class="blocklyEditableText" transform="translate(55,7.4)" style="cursor: text;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="196.5" class="blocklyFieldRect" style="fill: rgb(162, 162, 162);"/><g class="blocklyEditableText"><text class="blocklyText blocklyMultilineText" x="8" y="5.6" dy="14">Describe your program.</text></g></g></g></g></svg>

doc/main/blockimg/pybricks_blockDistance_ColorDistanceSensor.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 239.3828125 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="239.3828125" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="lDlk9J`OT(,GY{4,Qd)]" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 197.3828125 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -197.3828125 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id=")/Cj|,g):/vlEShefB%3" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 64.46875 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -64.46875 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">sensor</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(60.46875,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCBkPSJtMjAuMzI4IDEyLjU5MWgtMTUuNTczIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMi41Ii8+CjxwYXRoIHRyYW5zZm9ybT0ibWF0cml4KDAgMS4wMTM2IDEuMDE3NiAwIC0zLjkzMTQgLTI1LjY0OSkiIGQ9Im00MS44MzggMTIuMTc4aC04LjUwMzdsNC4yNTE5LTcuMzY0NXoiIGZpbGw9IiNmZmYiLz4KPHBhdGggdHJhbnNmb3JtPSJtYXRyaXgoMCAxLjAxMzYgLTEuMDE3NiAwIDI4LjkxNSAtMjUuNjQ5KSIgZD0ibTQxLjgzOCAxMi4xNzhoLTguNTAzN2w0LjI1MTktNy4zNjQ1eiIgZmlsbD0iI2ZmZiIvPgo8cGF0aCBkPSJtMC43NSAyMC4wNDR2LTE1LjU3MyIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjEuNSIvPgo8cGF0aCBkPSJtMjQuMjUgMjAuMDQ0di0xNS41NzMiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KICA8L2c+Cjwvc3ZnPg=="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(160.46875,11)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">distance</text></g></g></g></svg>

doc/main/blockimg/pybricks_blockDistance_ForceSensor.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 282.953125 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="282.953125" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id=")4!3WH13zM{dmK2f0=w*" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 240.953125 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -240.953125 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="]4SQO}[Nm%P,:{xVKQn)" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 108.0390625 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -108.0390625 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">force sensor</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(104.0390625,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCBkPSJtMjAuMzI4IDEyLjU5MWgtMTUuNTczIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMi41Ii8+CjxwYXRoIHRyYW5zZm9ybT0ibWF0cml4KDAgMS4wMTM2IDEuMDE3NiAwIC0zLjkzMTQgLTI1LjY0OSkiIGQ9Im00MS44MzggMTIuMTc4aC04LjUwMzdsNC4yNTE5LTcuMzY0NXoiIGZpbGw9IiNmZmYiLz4KPHBhdGggdHJhbnNmb3JtPSJtYXRyaXgoMCAxLjAxMzYgLTEuMDE3NiAwIDI4LjkxNSAtMjUuNjQ5KSIgZD0ibTQxLjgzOCAxMi4xNzhoLTguNTAzN2w0LjI1MTktNy4zNjQ1eiIgZmlsbD0iI2ZmZiIvPgo8cGF0aCBkPSJtMC43NSAyMC4wNDR2LTE1LjU3MyIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjEuNSIvPgo8cGF0aCBkPSJtMjQuMjUgMjAuMDQ0di0xNS41NzMiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KICA8L2c+Cjwvc3ZnPg=="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(204.0390625,11)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">distance</text></g></g></g></svg>

doc/main/blockimg/pybricks_blockDistance_InfraredSensor.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 303.3984375 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="303.3984375" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="/c0?C?SvXg|S%$=M0igj" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 261.3984375 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -261.3984375 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="7_Vpy}p0duC*r(RFi0R:" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 128.484375 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -128.484375 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">infrared sensor</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(124.484375,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCBkPSJtMjAuMzI4IDEyLjU5MWgtMTUuNTczIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMi41Ii8+CjxwYXRoIHRyYW5zZm9ybT0ibWF0cml4KDAgMS4wMTM2IDEuMDE3NiAwIC0zLjkzMTQgLTI1LjY0OSkiIGQ9Im00MS44MzggMTIuMTc4aC04LjUwMzdsNC4yNTE5LTcuMzY0NXoiIGZpbGw9IiNmZmYiLz4KPHBhdGggdHJhbnNmb3JtPSJtYXRyaXgoMCAxLjAxMzYgLTEuMDE3NiAwIDI4LjkxNSAtMjUuNjQ5KSIgZD0ibTQxLjgzOCAxMi4xNzhoLTguNTAzN2w0LjI1MTktNy4zNjQ1eiIgZmlsbD0iI2ZmZiIvPgo8cGF0aCBkPSJtMC43NSAyMC4wNDR2LTE1LjU3MyIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjEuNSIvPgo8cGF0aCBkPSJtMjQuMjUgMjAuMDQ0di0xNS41NzMiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KICA8L2c+Cjwvc3ZnPg=="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(224.484375,11)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">distance</text></g></g></g></svg>

doc/main/blockimg/pybricks_blockDistance_UltrasonicSensor.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 308.7421875 42" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="308.7421875" height="42" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="_=uW$jucY@j;kQZaX(v6" class="blocklyDraggable"><path class="blocklyPath" stroke="#4585a1" fill="#5cb1d6" d=" m 20,0  h 266.7421875 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -266.7421875 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="/@W2iu2)S,Cm+6+M/J5O" transform="translate(56, 4)" style="display: block;"><path class="blocklyPath" stroke="#4585a1" fill="#4e96b6" d=" m 16,0  h 133.828125 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -133.828125 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(12,7)" style="cursor: default;"><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="0" y="9">distance sensor</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(129.828125,3)"/></g></g><g transform="translate(12,7)"><image height="25px" width="25px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCBkPSJtMjAuMzI4IDEyLjU5MWgtMTUuNTczIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMi41Ii8+CjxwYXRoIHRyYW5zZm9ybT0ibWF0cml4KDAgMS4wMTM2IDEuMDE3NiAwIC0zLjkzMTQgLTI1LjY0OSkiIGQ9Im00MS44MzggMTIuMTc4aC04LjUwMzdsNC4yNTE5LTcuMzY0NXoiIGZpbGw9IiNmZmYiLz4KPHBhdGggdHJhbnNmb3JtPSJtYXRyaXgoMCAxLjAxMzYgLTEuMDE3NiAwIDI4LjkxNSAtMjUuNjQ5KSIgZD0ibTQxLjgzOCAxMi4xNzhoLTguNTAzN2w0LjI1MTktNy4zNjQ1eiIgZmlsbD0iI2ZmZiIvPgo8cGF0aCBkPSJtMC43NSAyMC4wNDR2LTE1LjU3MyIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjEuNSIvPgo8cGF0aCBkPSJtMjQuMjUgMjAuMDQ0di0xNS41NzMiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KICA8L2c+Cjwvc3ZnPg=="/></g><g transform="translate(45,4.5)"><image height="30px" width="3px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0yLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g transform="translate(229.828125,11)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">distance</text></g></g></g></svg>

doc/main/blockimg/pybricks_blockFlowBreakContinue_break.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 218.328125 46" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="218.328125" height="46" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="w2(uLyFP-OT)EjoyKKJo" class="blocklyDraggable"><path class="blocklyPath" stroke="#bf8013" fill="#ffab19" d=" m 0,0  m 0,4 a 4 4 0 0,1 4,-4  h 5  c 1.6666666666666667,0  2.5,0.75  3.3333333333333335,1.5  l 3.3333333333333335,3  c 0.8333333333333334,0.75  1.6666666666666667,1.5  3.3333333333333335,1.5  h 10  c 1.6666666666666667,0  2.5,-0.75  3.3333333333333335,-1.5  l 3.3333333333333335,-3  c 0.8333333333333334,-0.75  1.6666666666666667,-1.5  3.3333333333333335,-1.5  h 173.328125 a 4 4 0 0,1 4,4  v 6  V 38  V 40  V 40 a 4 4 0 0,1 -4,4  h -208.328125 a 4 4 0 0,1 -4,-4 z&#10;"/><g class="blocklyEditableText" transform="translate(39,7.4)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="108.015625" class="blocklyFieldRect blocklyDropdownRect" stroke="#bf8013" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="14.6">break out</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(88.015625,8.6)"/></g><g transform="translate(155.015625,13)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">of loop</text></g></g></g></svg>

doc/main/blockimg/pybricks_blockFlowBreakContinue_continue.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 354.3203125 45.99999999999977" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="354.3203125" height="45.99999999999977" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="m^Ia,.bqpE4)a@)UJO|-" class="blocklyDraggable"><path class="blocklyPath" stroke="#bf8013" fill="#ffab19" d=" m 0,0  m 0,4 a 4 4 0 0,1 4,-4  h 5  c 1.6666666666666667,0  2.5,0.75  3.3333333333333335,1.5  l 3.3333333333333335,3  c 0.8333333333333334,0.75  1.6666666666666667,1.5  3.3333333333333335,1.5  h 10  c 1.6666666666666667,0  2.5,-0.75  3.3333333333333335,-1.5  l 3.3333333333333335,-3  c 0.8333333333333334,-0.75  1.6666666666666667,-1.5  3.3333333333333335,-1.5  h 309.3203125 a 4 4 0 0,1 4,4  v 6  V 38  V 40  V 40 a 4 4 0 0,1 -4,4  h -344.3203125 a 4 4 0 0,1 -4,-4 z&#10;"/><g class="blocklyEditableText" transform="translate(39,7.4)" style="cursor: default;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="244.0078125" class="blocklyFieldRect blocklyDropdownRect" stroke="#bf8013" fill="transparent"/><text class="blocklyText blocklyDropdownText" dominant-baseline="central" text-anchor="start" x="8" y="14.6">continue with next iteration</text><image style="display: none;"/><image height="12px" width="12px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi43MSIgaGVpZ2h0PSI4Ljc5IiB2aWV3Qm94PSIwIDAgMTIuNzEgOC43OSI+PHRpdGxlPmRyb3Bkb3duLWFycm93PC90aXRsZT48ZyBvcGFjaXR5PSIwLjEiPjxwYXRoIGQ9Ik0xMi43MSwyLjQ0QTIuNDEsMi40MSwwLDAsMSwxMiw0LjE2TDguMDgsOC4wOGEyLjQ1LDIuNDUsMCwwLDEtMy40NSwwTDAuNzIsNC4xNkEyLjQyLDIuNDIsMCwwLDEsMCwyLjQ0LDIuNDgsMi40OCwwLDAsMSwuNzEuNzFDMSwwLjQ3LDEuNDMsMCw2LjM2LDBTMTEuNzUsMC40NiwxMiwuNzFBMi40NCwyLjQ0LDAsMCwxLDEyLjcxLDIuNDRaIiBmaWxsPSIjMjMxZjIwIi8+PC9nPjxwYXRoIGQ9Ik02LjM2LDcuNzlhMS40MywxLjQzLDAsMCwxLTEtLjQyTDEuNDIsMy40NWExLjQ0LDEuNDQsMCwwLDEsMC0yYzAuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMzdBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=" transform="translate(224.0078125,8.6)"/></g><g transform="translate(291.0078125,13)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">of loop</text></g></g></g></svg>

doc/main/blockimg/pybricks_blockFlowForEach_loop_for.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 181.234375 122" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="181.234375" height="122" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="*=kjY+CH)3(~(`g@HYrd" class="blocklyDraggable"><path class="blocklyPath" stroke="#bf8013" fill="#ffab19" d=" m 0,0  m 0,4 a 4 4 0 0,1 4,-4  h 5  c 1.6666666666666667,0  2.5,0.75  3.3333333333333335,1.5  l 3.3333333333333335,3  c 0.8333333333333334,0.75  1.6666666666666667,1.5  3.3333333333333335,1.5  h 10  c 1.6666666666666667,0  2.5,-0.75  3.3333333333333335,-1.5  l 3.3333333333333335,-3  c 0.8333333333333334,-0.75  1.6666666666666667,-1.5  3.3333333333333335,-1.5  h 136.234375 a 4 4 0 0,1 4,4  v 6  V 38  V 40 a 4 4 0 0,1 -4,4  H 61  c -1.6666666666666667,0  -2.5,0.75  -3.3333333333333335,1.5  l -3.3333333333333335,3  c -0.8333333333333334,0.75  -1.6666666666666667,1.5  -3.3333333333333335,1.5  h -10  c -1.6666666666666667,0  -2.5,-0.75  -3.3333333333333335,-1.5  l -3.3333333333333335,-3  c -0.8333333333333334,-0.75  -1.6666666666666667,-1.5  -3.3333333333333335,-1.5  h -5 a 4 4 0 0,0 -4,4  v 32 a 4 4 0 0,0 4,4  h 5  c 1.6666666666666667,0  2.5,0.75  3.3333333333333335,1.5  l 3.3333333333333335,3  c 0.8333333333333334,0.75  1.6666666666666667,1.5  3.3333333333333335,1.5  h 10  c 1.6666666666666667,0  2.5,-0.75  3.3333333333333335,-1.5  l 3.3333333333333335,-3  c 0.8333333333333334,-0.75  1.6666666666666667,-1.5  3.3333333333333335,-1.5  H 175.234375 a 4 4 0 0,1 4,4  V 90  V 110 a 4 4 0 0,1 -4,4  h -136.234375  c -1.6666666666666667,0  -2.5,0.75  -3.3333333333333335,1.5  l -3.3333333333333335,3  c -0.8333333333333334,0.75  -1.6666666666666667,1.5  -3.3333333333333335,1.5  h -10  c -1.6666666666666667,0  -2.5,-0.75  -3.3333333333333335,-1.5  l -3.3333333333333335,-3  c -0.8333333333333334,-0.75  -1.6666666666666667,-1.5  -3.3333333333333335,-1.5  h -5 a 4 4 0 0,1 -4,-4 z&#10;"/><g data-id="g$z5O=B86BHrRceAJp0B" transform="translate(39, 6)" style="display: block;"><path class="blocklyPath" stroke="#bf8013" fill="#d99115" d=" m 16,0  h 22.8984375 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -22.8984375 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(11,7)" style="cursor: text;"><rect rx="4" ry="4" x="0" y="0" height="18" width="32.8984375" class="blocklyFieldRect" style="display: none;"/><text class="blocklyText" dominant-baseline="central" style="fill: rgb(255, 255, 255);" x="0" y="9">item</text></g></g><g data-id="{V!cYG(tX@eU1$h8(d,h" transform="translate(124.1171875, 6)" style="display: block;"><path class="blocklyPath" stroke="#bf8013" fill="#d99115" d=" m 16,0  h 15.1171875 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -15.1171875 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g transform="translate(12,7)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">list</text></g></g><g transform="translate(8,13)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">for</text></g><g transform="translate(101.8984375,13)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">in</text></g></g></g></svg>

doc/main/blockimg/pybricks_blockFlowForEach_loop_for_list.svg

@@ -1,975 +0,0 @@
-<!-- Copyright (c) 2023 The Pybricks Authors. All rights reserved. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.6875 122" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="269.6875" height="122" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
-fill: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
-fill: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;rect,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
- .blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
-stroke: #fff;
-stroke-width: 2;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-font-weight: bold;
-color: #575E75;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
-fill: #fff !important;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
-font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
-color: #fff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
-stroke: #ffffff;
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
-fill: url(#blocklyDisabledPattern8106945446883995)
-}
-.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
-fill-opacity: 0.2;
-stroke: none;
-}
-
-.blocklySvg {
-  background-color: #fff;
-  outline: none;
-  overflow: hidden;  /* IE overflows by default. */
-  position: absolute;
-  display: block;
-}
-
-.blocklyWidgetDiv {
-  display: none;
-  position: absolute;
-  z-index: 99999;  /* big value for bootstrap3 compatibility */
-}
-
-.injectionDiv {
-  height: 100%;
-  position: relative;
-  overflow: hidden;  /* So blocks in drag surface disappear at edges */
-  touch-action: none;
-}
-
-.blocklyNonSelectable {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-}
-
-.blocklyBlockCanvas.blocklyCanvasTransitioning,
-.blocklyBubbleCanvas.blocklyCanvasTransitioning {
-  transition: transform .5s;
-}
-
-.blocklyTooltipDiv {
-  background-color: #ffffc7;
-  border: 1px solid #ddc;
-  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
-  color: #000;
-  display: none;
-  font: 9pt sans-serif;
-  opacity: .9;
-  padding: 2px;
-  position: absolute;
-  z-index: 100000;  /* big value for bootstrap3 compatibility */
-}
-
-.blocklyDropDownDiv {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 1000;
-  display: none;
-  border: 1px solid;
-  border-color: #dadce0;
-  background-color: #fff;
-  border-radius: 2px;
-  padding: 4px;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownContent {
-  max-height: 300px;  /* @todo: spec for maximum height. */
-  overflow: auto;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.blocklyDropDownArrow {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 16px;
-  height: 16px;
-  z-index: -1;
-  background-color: inherit;
-  border-color: inherit;
-}
-
-.blocklyDropDownButton {
-  display: inline-block;
-  float: left;
-  padding: 0;
-  margin: 4px;
-  border-radius: 4px;
-  outline: none;
-  border: 1px solid;
-  transition: box-shadow .1s;
-  cursor: pointer;
-}
-
-.blocklyArrowTop {
-  border-top: 1px solid;
-  border-left: 1px solid;
-  border-top-left-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyArrowBottom {
-  border-bottom: 1px solid;
-  border-right: 1px solid;
-  border-bottom-right-radius: 4px;
-  border-color: inherit;
-}
-
-.blocklyResizeSE {
-  cursor: se-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeSW {
-  cursor: sw-resize;
-  fill: #aaa;
-}
-
-.blocklyResizeLine {
-  stroke: #515A5A;
-  stroke-width: 1;
-}
-
-.blocklyHighlightedConnectionPath {
-  fill: none;
-  stroke: #fc3;
-  stroke-width: 4px;
-}
-
-.blocklyPathLight {
-  fill: none;
-  stroke-linecap: round;
-  stroke-width: 1;
-}
-
-.blocklySelected&gt;.blocklyPathLight {
-  display: none;
-}
-
-.blocklyDraggable {
-  cursor: grab;
-  cursor: -webkit-grab;
-}
-
-.blocklyDragging {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-  /* Changes cursor on mouse down. Not effective in Firefox because of
-     https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
-.blocklyDraggable:active {
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-.blocklyDragging.blocklyDraggingDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyDragging&gt;.blocklyPath,
-.blocklyDragging&gt;.blocklyPathLight {
-  fill-opacity: .8;
-  stroke-opacity: .8;
-}
-
-.blocklyDragging&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyDisabled&gt;.blocklyPath {
-  fill-opacity: .5;
-  stroke-opacity: .5;
-}
-
-.blocklyDisabled&gt;.blocklyPathLight,
-.blocklyDisabled&gt;.blocklyPathDark {
-  display: none;
-}
-
-.blocklyInsertionMarker&gt;.blocklyPath,
-.blocklyInsertionMarker&gt;.blocklyPathLight,
-.blocklyInsertionMarker&gt;.blocklyPathDark {
-  fill-opacity: .2;
-  stroke: none;
-}
-
-.blocklyMultilineText {
-  font-family: monospace;
-}
-
-.blocklyNonEditableText&gt;text {
-  pointer-events: none;
-}
-
-.blocklyFlyout {
-  position: absolute;
-  z-index: 20;
-}
-
-.blocklyText text {
-  cursor: default;
-}
-
-/*
-  Don't allow users to select text.  It gets annoying when trying to
-  drag a block and selected text moves instead.
-*/
-.blocklySvg text {
-  user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  cursor: inherit;
-}
-
-.blocklyHidden {
-  display: none;
-}
-
-.blocklyFieldDropdown:not(.blocklyHidden) {
-  display: block;
-}
-
-.blocklyIconGroup {
-  cursor: default;
-}
-
-.blocklyIconGroup:not(:hover),
-.blocklyIconGroupReadonly {
-  opacity: .6;
-}
-
-.blocklyIconShape {
-  fill: #00f;
-  stroke: #fff;
-  stroke-width: 1px;
-}
-
-.blocklyIconSymbol {
-  fill: #fff;
-}
-
-.blocklyMinimalBody {
-  margin: 0;
-  padding: 0;
-}
-
-.blocklyHtmlInput {
-  border: none;
-  border-radius: 4px;
-  height: 100%;
-  margin: 0;
-  outline: none;
-  padding: 0;
-  width: 100%;
-  text-align: center;
-  display: block;
-  box-sizing: border-box;
-}
-
-/* Remove the increase and decrease arrows on the field number editor */
-input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
-input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-input[type=number] {
-  -moz-appearance: textfield;
-}
-
-.blocklyMainBackground {
-  stroke-width: 1;
-  stroke: #c6c6c6;  /* Equates to #ddd due to border being off-pixel. */
-}
-
-.blocklyMutatorBackground {
-  fill: #fff;
-  stroke: #ddd;
-  stroke-width: 1;
-}
-
-.blocklyFlyoutBackground {
-  fill: #ddd;
-  fill-opacity: .8;
-}
-
-.blocklyMainWorkspaceScrollbar {
-  z-index: 20;
-}
-
-.blocklyFlyoutScrollbar {
-  z-index: 30;
-}
-
-.blocklyScrollbarHorizontal,
-.blocklyScrollbarVertical {
-  position: absolute;
-  outline: none;
-}
-
-.blocklyScrollbarBackground {
-  opacity: 0;
-}
-
-.blocklyScrollbarHandle {
-  fill: #ccc;
-}
-
-.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyScrollbarHandle:hover {
-  fill: #bbb;
-}
-
-/* Darken flyout scrollbars due to being on a grey background. */
-/* By contrast, workspace scrollbars are on a white background. */
-.blocklyFlyout .blocklyScrollbarHandle {
-  fill: #bbb;
-}
-
-.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
-.blocklyFlyout .blocklyScrollbarHandle:hover {
-  fill: #aaa;
-}
-
-.blocklyInvalidInput {
-  background: #faa;
-}
-
-.blocklyVerticalMarker {
-  stroke-width: 3px;
-  fill: rgba(255,255,255,.5);
-  pointer-events: none;
-}
-
-.blocklyComputeCanvas {
-  position: absolute;
-  width: 0;
-  height: 0;
-}
-
-.blocklyNoPointerEvents {
-  pointer-events: none;
-}
-
-.blocklyContextMenu {
-  border-radius: 4px;
-  max-height: 100%;
-}
-
-.blocklyDropdownMenu {
-  border-radius: 2px;
-  padding: 0 !important;
-}
-
-.blocklyDropdownMenu .blocklyMenuItem {
-  /* 28px on the left for icon or checkbox. */
-  padding-left: 28px;
-}
-
-/* BiDi override for the resting state. */
-.blocklyDropdownMenu .blocklyMenuItemRtl {
-  /* Flip left/right padding for BiDi. */
-  padding-left: 5px;
-  padding-right: 28px;
-}
-
-.blocklyWidgetDiv .blocklyMenu {
-  background: #fff;
-  border: 1px solid transparent;
-  box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
-  font: normal 13px Arial, sans-serif;
-  margin: 0;
-  outline: none;
-  padding: 4px 0;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  max-height: 100%;
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
-  box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
-}
-
-.blocklyDropDownDiv .blocklyMenu {
-  background: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  border: inherit;  /* Compatibility with gapi, reset from goog-menu */
-  font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
-  outline: none;
-  position: relative;  /* Compatibility with gapi, reset from goog-menu */
-  z-index: 20000;  /* Arbitrary, but some apps depend on it... */
-}
-
-/* State: resting. */
-.blocklyMenuItem {
-  border: none;
-  color: #000;
-  cursor: pointer;
-  list-style: none;
-  margin: 0;
-  /* 7em on the right for shortcut. */
-  min-width: 7em;
-  padding: 6px 15px;
-  white-space: nowrap;
-}
-
-/* State: disabled. */
-.blocklyMenuItemDisabled {
-  color: #ccc;
-  cursor: inherit;
-}
-
-/* State: hover. */
-.blocklyMenuItemHighlight {
-  background-color: rgba(0,0,0,.1);
-}
-
-/* State: selected/checked. */
-.blocklyMenuItemCheckbox {
-  height: 16px;
-  position: absolute;
-  width: 16px;
-}
-
-.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
-  background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
-  float: left;
-  margin-left: -24px;
-  position: static;  /* Scroll with the menu. */
-}
-
-.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
-  float: right;
-  margin-right: -24px;
-}
-
-
-.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
-  opacity: .4;
-}
-
-.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
-  opacity: .6;
-}
-
-.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
-  opacity: .8;
-}
-
-
-.blocklyCommentForeignObject {
-  position: relative;
-  z-index: 0;
-}
-
-.blocklyCommentRect {
-  fill: #E7DE8E;
-  stroke: #bcA903;
-  stroke-width: 1px;
-}
-
-.blocklyCommentTarget {
-  fill: transparent;
-  stroke: #bcA903;
-}
-
-.blocklyCommentTargetFocused {
-  fill: none;
-}
-
-.blocklyCommentHandleTarget {
-  fill: none;
-}
-
-.blocklyCommentHandleTargetFocused {
-  fill: transparent;
-}
-
-.blocklyFocused&gt;.blocklyCommentRect {
-  fill: #B9B272;
-  stroke: #B9B272;
-}
-
-.blocklySelected&gt;.blocklyCommentTarget {
-  stroke: #fc3;
-  stroke-width: 3px;
-}
-
-.blocklyCommentDeleteIcon {
-  cursor: pointer;
-  fill: #000;
-  display: none;
-}
-
-.blocklySelected &gt; .blocklyCommentDeleteIcon {
-  display: block;
-}
-
-.blocklyDeleteIconShape {
-  fill: #000;
-  stroke: #000;
-  stroke-width: 1px;
-}
-
-.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
-  stroke: #fc3;
-}
-
-
-.blocklyCommentTextarea {
-  background-color: #fef49c;
-  border: 0;
-  display: block;
-  margin: 0;
-  outline: 0;
-  padding: 3px;
-  resize: none;
-  text-overflow: hidden;
-}
-
-
-.blocklyAngleCircle {
-  stroke: #444;
-  stroke-width: 1;
-  fill: #ddd;
-  fill-opacity: 0.8;
-}
-
-.blocklyAngleMarks {
-  stroke: #444;
-  stroke-width: 1;
-}
-
-.blocklyAngleGauge {
-  fill: #f88;
-  fill-opacity: 0.8;
-  pointer-events: none;
-}
-
-.blocklyAngleLine {
-  stroke: #f00;
-  stroke-width: 2;
-  stroke-linecap: round;
-  pointer-events: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.blocklyHtmlTextAreaInput {
-  font-family: monospace;
-  resize: none;
-  overflow: hidden;
-  height: 100%;
-  text-align: left;
-}
-
-.blocklyHtmlTextAreaInputOverflowedY {
-  overflow-y: scroll;
-}
-
-
-.blocklyFlyoutButton {
-  fill: #888;
-  cursor: default;
-}
-
-.blocklyFlyoutButtonShadow {
-  fill: #666;
-}
-
-.blocklyFlyoutButton:hover {
-  fill: #aaa;
-}
-
-.blocklyFlyoutLabel {
-  cursor: default;
-}
-
-.blocklyFlyoutLabelBackground {
-  opacity: 0;
-}
-
-
-.blocklyTreeRow:not(.blocklyTreeSelected):hover {
-  background-color: rgba(255, 255, 255, .2);
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
-  margin: 1px 5px 1px 0;
-}
-
-.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
-  margin: 1px 0 1px 5px;
-}
-
-.blocklyTreeRow {
-  height: 22px;
-  line-height: 22px;
-  margin-bottom: 3px;
-  padding-right: 8px;
-  white-space: nowrap;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
-  margin-left: 8px;
-  padding-right: 0;
-}
-
-.blocklyTreeIcon {
-  background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
-  height: 16px;
-  vertical-align: middle;
-  visibility: hidden;
-  width: 16px;
-}
-
-.blocklyTreeIconClosed {
-  background-position: -32px -1px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
-  background-position: 0 -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: -32px -17px;
-}
-
-.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
-  background-position: 0 -17px;
-}
-
-.blocklyTreeIconOpen {
-  background-position: -16px -1px;
-}
-
-.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
-  background-position: -16px -17px;
-}
-
-.blocklyTreeLabel {
-  cursor: default;
-  font: 16px sans-serif;
-  padding: 0 3px;
-  vertical-align: middle;
-}
-
-.blocklyToolboxDelete .blocklyTreeLabel {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyTreeSelected .blocklyTreeLabel {
-  color: #fff;
-}
-
-
-.blocklyTreeSeparator {
-  border-bottom: solid #e5e5e5 1px;
-  height: 0;
-  margin: 5px 0;
-}
-
-.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
-  border-right: solid #e5e5e5 1px;
-  border-bottom: none;
-  height: auto;
-  margin: 0 5px 0 5px;
-  padding: 5px 0;
-  width: 0;
-}
-
-
-.blocklyToolboxDelete {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
-}
-
-.blocklyToolboxGrab {
-  cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
-  cursor: grabbing;
-  cursor: -webkit-grabbing;
-}
-
-/* Category tree in Toolbox. */
-.blocklyToolboxDiv {
-  background-color: #ddd;
-  overflow-x: visible;
-  overflow-y: auto;
-  padding: 4px 0 4px 0;
-  position: absolute;
-  z-index: 70;  /* so blocks go under toolbox when dragging */
-  -webkit-tap-highlight-color: transparent;  /* issue #1345 */
-}
-
-.blocklyToolboxContents {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-}
-
-.blocklyToolboxContents:focus {
-  outline: none;
-}
-
-
-.blocklyColourTable {
-  border-collapse: collapse;
-  display: block;
-  outline: none;
-  padding: 1px;
-}
-
-.blocklyColourTable&gt;tr&gt;td {
-  border: 0.5px solid #888;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-block;
-  height: 20px;
-  padding: 0;
-  width: 20px;
-}
-
-.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
-  border-color: #eee;
-  box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
-  position: relative;
-}
-
-.blocklyColourSelected, .blocklyColourSelected:hover {
-  border-color: #eee !important;
-  outline: 1px solid #333;
-  position: relative;
-}
-
-
-.fieldColourSliderContainer {
-  padding: 4px;
-}
-.fieldColourSliderContainer hr {
-  border: none;
-  border-top: 1px solid #bbb;
-}
-.fieldColourSliderLabel {
-  display: flex;
-  justify-content: space-between;
-  font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
-}
-.fieldColourEyedropper {
-  appearance: none;
-  position: relative;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-  width: 100%;
-  margin: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.fieldColourEyedropper:hover {
-  background: rgba(0,0,0,0.1)
-}
-.fieldColourEyedropper input {
-  opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-.fieldColourEyedropper::before {
-  content: "Eyedropper";
-}
-.fieldColourEyedropper::after {
-  content: "";
-  margin-left: 8px;
-  width: 24px;
-  height: 24px;
-  background: currentColor;
-  pointer-events: none;
-  -webkit-mask-image: var(--customize-dial-symbol);
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-image: var(--customize-dial-symbol);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  --customize-dial-symbol: url('data:image/svg+xml,    &lt;svg xmlns="http://www.w3.org/2000/svg"          width="24px" height="24px"          viewBox="0 0 24 24"&gt;       &lt;path stroke="black" strokewidth="1.414" fill="none"             d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22                 Q 6 21 9 18 L 16 11"/&gt;       &lt;path fill="black"             d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5                 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt;     &lt;/svg&gt;');
-}
-.fieldColourSlider {
-  -webkit-appearance: none;
-  width: 150px;
-  height: 24px;
-  margin: 4px 8px 24px 8px;
-  padding: 0;
-}
-.fieldColourSlider:last-child {
-  margin-bottom: 4px;
-}
-.fieldColourSlider:focus {
-  outline: none;
-}
-/* Webkit */
-.fieldColourSlider::-webkit-slider-runnable-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  background: #fff;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-  margin-top: -4px;
-}
-/* Firefox */
-.fieldColourSlider::-moz-range-track {
-  background: var(--slider-track-background);
-  border-radius: 8px;
-  height: 16px;
-}
-.fieldColourSlider::-moz-range-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-.fieldColourSlider::-moz-focus-outer {
-  /* override the focus border style */
-  border: 0;
-}
-/* IE */
-.fieldColourSlider::-ms-track {
-  background: var(--slider-track-background);
-  border-radius: 12px;
-  width: 100%;
-  height: 24px;
-  /* remove default tick marks */
-  color: transparent;
-}
-.fieldColourSlider::-ms-fill-lower  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-fill-upper  {
-  background: transparent;
-}
-.fieldColourSlider::-ms-thumb {
-  background: #fff;
-  border: none;
-  border-radius: 50%;
-  box-shadow: 0 0 0 4px rgba(0,0,0,.15);
-  cursor: pointer;
-  width: 24px;
-  height: 24px;
-}
-
-
-  .controlsIconStyle {
-    opacity: 0.2;
-  }
-  .controlsIconStyle:hover {
-    opacity: 0.4;
-  }
-  .controlsIconStyle:active {
-    opacity: 0.6;
-  }
-  
-
-.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
-  opacity: .2;
-}
-
-.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
-  opacity: .4;
-}
-
-.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
-  opacity: .6;
-}
-
-</style><g transform="translate(1, 1)"><g data-id="0Y:-{!zn`:7}FjAumZ8^" class="blocklyDraggable"><path class="blocklyPath" stroke="#bf8013" fill="#ffab19" d=" m 0,0  m 0,4 a 4 4 0 0,1 4,-4  h 5  c 1.6666666666666667,0  2.5,0.75  3.3333333333333335,1.5  l 3.3333333333333335,3  c 0.8333333333333334,0.75  1.6666666666666667,1.5  3.3333333333333335,1.5  h 10  c 1.6666666666666667,0  2.5,-0.75  3.3333333333333335,-1.5  l 3.3333333333333335,-3  c 0.8333333333333334,-0.75  1.6666666666666667,-1.5  3.3333333333333335,-1.5  h 224.6875 a 4 4 0 0,1 4,4  v 6  V 42 a 4 4 0 0,1 -4,4  H 61  c -1.6666666666666667,0  -2.5,0.75  -3.3333333333333335,1.5  l -3.3333333333333335,3  c -0.8333333333333334,0.75  -1.6666666666666667,1.5  -3.3333333333333335,1.5  h -10  c -1.6666666666666667,0  -2.5,-0.75  -3.3333333333333335,-1.5  l -3.3333333333333335,-3  c -0.8333333333333334,-0.75  -1.6666666666666667,-1.5  -3.3333333333333335,-1.5  h -5 a 4 4 0 0,0 -4,4  v 32 a 4 4 0 0,0 4,4  h 5  c 1.6666666666666667,0  2.5,0.75  3.3333333333333335,1.5  l 3.3333333333333335,3  c 0.8333333333333334,0.75  1.6666666666666667,1.5  3.3333333333333335,1.5  h 10  c 1.6666666666666667,0  2.5,-0.75  3.3333333333333335,-1.5  l 3.3333333333333335,-3  c 0.8333333333333334,-0.75  1.6666666666666667,-1.5  3.3333333333333335,-1.5  H 263.6875 a 4 4 0 0,1 4,4  V 90  V 110 a 4 4 0 0,1 -4,4  h -224.6875  c -1.6666666666666667,0  -2.5,0.75  -3.3333333333333335,1.5  l -3.3333333333333335,3  c -0.8333333333333334,0.75  -1.6666666666666667,1.5  -3.3333333333333335,1.5  h -10  c -1.6666666666666667,0  -2.5,-0.75  -3.3333333333333335,-1.5  l -3.3333333333333335,-3  c -0.8333333333333334,-0.75  -1.6666666666666667,-1.5  -3.3333333333333335,-1.5  h -5 a 4 4 0 0,1 -4,-4 z&#10;"/><g data-id="_)~SaS`f5_oqiL~HxVqX" transform="translate(39, 6)" style="display: block;"><path class="blocklyPath" stroke="#bf8013" fill="#d99115" d=" m 16,0  h 22.8984375 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -22.8984375 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(11,7)" style="cursor: text;"><rect rx="4" ry="4" x="0" y="0" height="18" width="32.8984375" class="blocklyFieldRect" style="display: none;"/><text class="blocklyText" dominant-baseline="central" style="fill: rgb(255, 255, 255);" x="0" y="9">item</text></g></g><g data-id="(XJy@%4VW3CIYhkXy_$g" transform="translate(124.1171875, 2)" class="blocklyDraggable" style="display: block;"><path class="blocklyPath" stroke="#009973" fill="#00cc99" d=" m 20,0  h 95.5703125 a 20 20 0 0,1 20,20  v 0 a 20 20 0 0,1 -20,20  V 40  h -95.5703125 a 20 20 0 0,1 -20,-20  v 0 a 20 20 0 0,1 20,-20 z&#10;"/><g data-id="ESD1eJKHG_JY}YX^M-aE" transform="translate(63.5703125, 4)" style="display: block;"><path class="blocklyPath" stroke="#009973" fill="#fff" d=" m 16,0  h 8 a 16 16 0 0,1 16,16  v 0 a 16 16 0 0,1 -16,16  V 32  h -8 a 16 16 0 0,1 -16,-16  v 0 a 16 16 0 0,1 16,-16 z&#10;"/><g class="blocklyEditableText" transform="translate(15.55078125,7)" style="cursor: text;"><rect rx="4" ry="4" x="0" y="0" height="18" width="8.8984375" class="blocklyFieldRect" stroke="#009973" style="display: none;"/><text class="blocklyText" dominant-baseline="central" x="0" y="9">3</text></g></g><g transform="translate(12,11)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">range</text></g><g transform="translate(111.5703125,4.5)"><image height="30px" width="12px" alt="" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxMiAzMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCBkPSJtMi40NzM4IDUuNzk2OCA3LjUwOTYgOS40MDI3LTcuNTA5NiA5LjQwMjciIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjQiLz4KICA8L2c+Cjwvc3ZnPg==" style="cursor: pointer;"/></g></g><g transform="translate(8,13)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">for</text></g><g transform="translate(101.8984375,13)"><text class="blocklyText" dominant-baseline="central" x="0" y="9">in</text></g></g></g></svg>