# Mark your name on the line

*nods · The package*

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

```js
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](https://marigold.example)

`nods-as-marker`A stroke of highlighter under the name, which fills.

- Designed by [Marigold](https://marigold.example)

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

- Designed by [Marigold](https://marigold.example)

`nods-as-disc`A small record before the name, which turns.

- Designed by [Marigold](https://marigold.example)

`nods-as-dimension`The name between two strokes, on a line struck from the middle.

- Designed by [Marigold](https://marigold.example)

`nods-as-swatches`The palette as the rule under the name.

- Designed by [Marigold](https://marigold.example)

`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);
}
```

| Token | Read by | What it sets |
|---|---|---|
| `--nods-mark` | `nods-as-marker` | The highlighter’s colour. |
| `--nods-mono` | `nods-as-code` | The monospace the code style sets the name in. |
| `--nods-code-ink` | `nods-as-code` | The colour of the brackets around the name. |
| `--nods-disc-label` | `nods-as-disc` | The colour of the record’s label. |
| `--nods-palette` | `nods-as-swatches` | The 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](https://docs.nods.to/cards/).

---
https://docs.nods.to/line-styles/ · nods 0.1.0 · MIT