NABI NOTE
Takardu

Nau'in rubutu ​

Yana amfani da rukunin nau'in rubutu ga haruffan da aka zaɓa. Idan ka zaɓi kewayo, yana canza wannan kewayon ne kawai; idan alama kawai take akwai, yana amfani da shi ga haruffan sakin layi na yanzu. Fayil ɗin font na ainihi da font-family CSS na sabis ne ke ƙayyade su.

Rukunin asali su ne sans, serif, mono, da cursive. Musamman ga sabis da ke ɗauke da Harshen Koriya, yana da kyau ka ƙayyade font ɗin da za a haɗa da kowane rukuni da kanka.

Fuka-fukai
Nau’in rubutu na asaliTazara
HTMLAna loda edita…
JSONnabi-treeAna loda edita…
Sanya
npm install nabi-note
Lamba
import {
  createNabiWith, mountSurface, mountToolbar, mountContextToolbar,
  mountHints, watchSettle, typefaceWing, fontSizeWing, dropCapWing,
  mountViewTools,
} from 'nabi-note'

const selected = [
  typefaceWing,
  fontSizeWing,
  dropCapWing,
]
const { nabi, registry } = createNabiWith(selected)

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: 'ha' })

const settle = watchSettle(document, { surface: content })
const shared = { nabi, registry, surface: content, settle, locale: 'ha' }
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()))
ts
const selected = wings().use('tf', {
  values: ['sans', 'serif', 'mono'],
}).build()

Idan ka bar values, ana amfani da duk rukunin asali. Ƙimomin da ke cikin values kawai ake yarda da su a cikin daftari.

Tsarin CSS ​

Ana adana sunan rukuni kawai a cikin daftari, CSS kuma ke ƙayyade fayil ɗin font. Canza masu canji a ma'ajin iri ɗaya na edita da shafin wallafa.

css
.nabi-content {
  --nabi-font-serif: "Noto Serif KR", serif;
  --nabi-font-mono: "JetBrains Mono", monospace;
}

Idan kana amfani da font na yanar gizo, dole ne ka fara loda fayil ɗin font ɗin. Sau da yawa cursive ba ya da font da ke tallafa Harshen Koriya, saboda haka yana da kyau a fayyace font ɗin da sabis zai yi amfani da shi kafin a bayar da shi.