NABI NOTE
নথি

হাইলাইট ​

নির্বাচিত লেখার পেছনে অনুমোদিত highlight রং প্রয়োগ করুন। Data tersimpan hanya menyimpan nama warna yang diizinkan, bukan nilai warna CSS bebas, sehingga data dokumen dan gaya visual tetap terpisah.

ডানা
ডিফল্ট ফন্টউচ্চতা
HTMLসম্পাদক লোড হচ্ছে…
JSONnabi-treeসম্পাদক লোড হচ্ছে…
ইনস্টল
npm install nabi-note
কোড
import {
  createNabiWith, mountSurface, mountToolbar, mountContextToolbar,
  mountHints, watchSettle, textColorWing, highlightWing, linkWing,
  mountViewTools,
} from 'nabi-note'

const selected = [
  textColorWing,
  highlightWing,
  linkWing,
]
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: 'bn' })

const settle = watchSettle(document, { surface: content })
const shared = { nabi, registry, surface: content, settle, locale: 'bn' }
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('hl', {
  values: ['yellow', 'green', 'cyan'],
}).build()

Jika values dihilangkan, palet default adalah yellow, green, cyan, pink, purple, dan orange. Jika daftar dipersempit, warna yang tidak terdaftar tidak dipertahankan bahkan saat dokumen lama dimuat.

CSS স্টাইল ​

Dokumen hanya menyimpan nama warna. Ubah warna editor dan tampilan terbit melalui variabel CSS.

css
.nabi-content { --nabi-hl-yellow: #fff0a6; }

Mengubah beberapa warna bersama memungkinkan nama warna dokumen tetap sama sementara hanya nuansa produk yang disesuaikan.

css
.article-body {
  --nabi-hl-yellow: #fff0a6;
  --nabi-hl-green: #c8f0d8;
  --nabi-hl-pink: #ffd6e5;
}