nodsv0.1.0 Mark your name on the line
nods.to
  1. nods
  2. The package
  3. Mark your name on the line

Mark your name on the line

Six classes change how a credited name is marked. The markup stays the same.

Designed by Marigold

The code for what is on screen

import { creditHTML } from '@nodsto/credit';
import '@nodsto/credit/credit.css';
import '@nodsto/templates/inline-marks/inline-marks.css';

const html = creditHTML(record, { className: 'nods-as-marker' });

Add one class to the credit.

The credit stays one line in somebody else’s footer, at the size and weight of the text around it. A line style changes the mark on your name and nothing else.

Choose one of the six marks.

A mark is still at rest. It answers a pointer, the keyboard, and its card for as long as the card is open.

  • Designed by Marigold
    nods-as-marker

    A stroke of highlighter under the name, which fills.

  • Designed by Marigold
    nods-as-code

    The name as an element, in the page’s monospace, with a caret.

  • Designed by Marigold
    nods-as-disc

    A small record before the name, which turns.

  • Designed by Marigold
    nods-as-dimension

    The name between two strokes, on a line struck from the middle.

  • Designed by Marigold
    nods-as-swatches

    The palette as the rule under the name.

  • Designed by Marigold
    nods-as-wave

    A wave under the name, which runs.

Set the colour a mark is drawn in.

site.css

footer .nods {
  --nods-mark: #ffd84a;
  --nods-disc-label: #e8401c;
  --nods-palette: linear-gradient(90deg, #1f2a44 0 20%, #c8553d 0 40%, #e9dcc3 0 60%, #7a8f6a 0 80%, #f2b84b 0);
}
TokenRead byWhat it sets
--nods-marknods-as-markerThe highlighter’s colour.
--nods-mononods-as-codeThe monospace the code style sets the name in.
--nods-code-inknods-as-codeThe colour of the brackets around the name.
--nods-disc-labelnods-as-discThe colour of the record’s label.
--nods-palettenods-as-swatchesThe palette, as a gradient with hard stops.

The palette is one token because a gradient with hard stops is what the rule under the name is drawn with.

Next, open a card from the credit.