Nota al pie
Conecta explicaciones adicionales con números en el texto y una lista al final del documento.
Introduce el contenido con el botón de nota al pie de la barra de herramientas para insertarla en el cursor. Si hay texto seleccionado, se inserta al final sin reemplazarlo. Los números no se almacenan; se asignan automáticamente según el orden del documento.
Pulsa un número del texto para editar su contenido en la fila de propiedades. Usa la herramienta de eliminación o pulsa dos veces Backspace o Delete junto a la nota para seleccionarla y después borrarla. La lista inferior es de solo lectura y desaparece cuando no hay notas.
En la vista previa y en las páginas publicadas con el viewer conectado, pasa el puntero sobre un número, haz clic o tócalo para leer el contenido. Solo se admite una línea de texto sin formato, que se muestra con una fuente sin serifa a 0,875 veces el tamaño base del cuerpo. El HTML se muestra literalmente.
npm install nabi-noteimport {
createLocale, createNabiWith, mountSurface, mountToolbar,
mountContextToolbar, mountHints, watchSettle, highlightWing, linkWing,
footnoteWing, mountViewTools,
} from 'nabi-note'
const selected = [
highlightWing,
linkWing,
footnoteWing,
]
const locale = createLocale('es')
const { nabi, registry } = createNabiWith(selected, { locale })
const root = document.querySelector('.nabi')!
const content = document.querySelector('.nabi-content')!
// The locale also sets the direction — Arabic and Urdu run right to left
mountSurface({ nabi, registry, root: content, locale })
const settle = watchSettle(document, { surface: content })
const shared = { nabi, registry, surface: content, settle, locale }
const toolbar = mountToolbar({ ...shared, root: document.querySelector('#toolbar')! })
const context = mountContextToolbar({ ...shared, root: document.querySelector('#context')! })
mountHints({ toolbar, context, root, surface: content })
// The preview and fullscreen buttons — they stand their own box at the end of the row
mountViewTools({ ...shared, root, container: document.querySelector('#toolbar')! })
// on every change — hook up your own code here
// nabi.onChange(() => user_callback(nabi.getHtml()))
// Call from your language selector. Content and editing history stay intact.
// locale.setLocale('ko')const selected = wings().use('fn').build()