Ukubwa wa Herufi ​

Badilisha maandishi yaliyochaguliwa hadi hatua ya ukubwa. Eneo likichaguliwa, hatua hutumika kwa eneo hilo; ikiwa kuna kielekezi pekee, hubadilisha ukubwa wa maandishi wa aya ya sasa. Data iliyohifadhiwa huhifadhi hatua zinazoruhusiwa pekee, si thamani za kiholela kama px.

Mabawa
Aina msingi ya herufiKipenyo
HTMLKihariri kinapakiwa…
JSONnabi-treeKihariri kinapakiwa…
Sakinisha
npm install nabi-note
Msimbo
import {
  createLocale, createNabiWith, mountSurface, mountToolbar,
  mountContextToolbar, mountHints, watchSettle, boldWing, italicWing,
  underlineWing, strikeWing, typefaceWing, fontSizeWing,
  clearFormatWing, mountViewTools,
} from 'nabi-note'

const selected = [
  boldWing,
  italicWing,
  underlineWing,
  strikeWing,
  typefaceWing,
  fontSizeWing,
  clearFormatWing,
]
const locale = createLocale('sw')
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')
ts
const selected = wings().use('fs', {
  values: ['sm', 'lg', 'xl'],
}).build()

Iwapo values itaachwa, hatua za xs, sm, lg, na xl hutumika. Ukipunguza orodha, hatua nyingine zilizomo tayari kwenye hati za zamani huondolewa zinapopakiwa.

Mitindo ya CSS ​

Unaweza kubadilisha ukubwa kupitia viteuzi vya hatua zilizohifadhiwa kama .nabi-content [data-nabi-size="xs"]. Usibuni hatua za kiholela ambazo hazimo kwenye hati; rekebisha CSS ndani ya values zilizosajiliwa pekee.

css
.article-body [data-nabi-size="xs"] { font-size: .78em; }
.article-body [data-nabi-size="sm"] { font-size: .9em; }
.article-body [data-nabi-size="lg"] { font-size: 1.3em; }
.article-body [data-nabi-size="xl"] { font-size: 1.65em; }

Kudumisha tofauti ya ukubwa kati ya hatua kwa uthabiti huhifadhi maana ambayo mwandishi alichagua kwenye kihariri hati inapochapishwa.