Pandoc Filter: Under Construction

Author

Adrian Cederberg

The under construction filter is used to inject some content indicating to the user that a section is not quite ready.

Whole Page

Using a fenced div with id under-construction-1 should result in the following:

This Page is Currently Under Construction.
This Section is Currently Under Construction.

Available Sizes

Aside from the whole page, the under-construction filter can be used for individual sections and is available in the same sizes as floaty. Just use under-construction-{size}.

Customization

Since this is derivative of floaty, many of the options for floaty are available.

Using Bootstrap Icons

The following uses the default bootstrap icons.

This Floaty uses a Bootstrap Icon
This Section is Currently Under Construction.

Bootstrap icons are enabled the same as in floaty - by setting $.container.mode to boostrap. Custom classes and content are the same as in floaty, $.content should just be a partial ConfigFloatyItem and not a map from strings to ConfigFloatyItem. It is not necessary to specify all fields, just to specify an overwrites on the defaults.

  - identifier: uses-bootstrap
    container:
      size: 1
      mode: bootstrap
      classes:
        - floaty-shadow-1
    content:
      key: uses-bs
      title: This Floaty uses a Bootstrap Icon
      image:
        bootstrap:
          # NOTE: Applies classes specificaly to the bootstrap icon.
          classes:
            - bg-yellow
            - border
            - border-black
            - border-5
            - rounded-4
            - p-5
      classes:
        - p-3

Floaty Features

All of the properties of floaty should hold true, any floaty classes should be added.

A Bug
Look! There is a bug.

This should work exactly like in floaty, just use all of the classes_ prefixed options in container to specify any additional classes.

  - identifier: custom
    container:
      size: 1
      mode: bootstrap
      classes:
        - floaty-shadow-1
    content:
      key: a-bug
      title: A Bug
      description: Look! *There is a bug.*
      image:
        bootstrap:
          name: bug-fill
          classes:
            - bg-black
            - border
            - border-red
            - border-5
            - rounded-5
            - p-5
      classes:
        - p-3
        - text-red