Mark

Do you know how much a loaf of bread costs now?

Example

COMMENT

You need to install rough-notation yourself.

Show Code

<script lang="ts" setup>
import { annotate } from 'rough-notation'
import { RInput, RMark, RSpace } from 'roughness'
import { ref } from 'vue'

const pence = ref(915)
</script>

<template>
  <RSpace vertical>
    <RInput v-model="pence" />
    <p>The shirt cost, 9... <RMark :annotate="annotate">{{ pence }} pence</RMark>?</p>
  </RSpace>
</template>

The shirt cost, 9... 915 pence?

Usage

Props

Slots

Styles