Kiểu chữ
Áp dụng nhóm kiểu chữ cho chữ đã chọn. Khi chọn một phạm vi, chỉ phạm vi đó thay đổi; khi chỉ có con trỏ, nó áp dụng cho chữ trong đoạn hiện tại. Tệp phông thực tế và font-family do CSS của dịch vụ xác định.
Các nhóm mặc định là sans, serif, mono, cursive. Đặc biệt, với dịch vụ có tiếng Hàn, nên tự xác định phông nào kết nối với mỗi nhóm.
npm install nabi-noteimport {
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: 'vi' })
const settle = watchSettle(document, { surface: content })
const shared = { nabi, registry, surface: content, settle, locale: 'vi' }
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()))const selected = wings().use('tf', {
values: ['sans', 'serif', 'mono'],
}).build()Nếu bỏ qua values, tất cả nhóm mặc định được dùng. Chỉ các giá trị đưa vào values mới được cho phép trong tài liệu.
Kiểu CSS
Tài liệu chỉ lưu tên nhóm, còn CSS xác định tệp phông. Thay đổi biến trên cùng vùng chứa của trình soạn thảo và trang xuất bản.
.nabi-content {
--nabi-font-serif: "Noto Serif KR", serif;
--nabi-font-mono: "JetBrains Mono", monospace;
}Nếu dùng phông web, trước hết bạn cũng cần tải các tệp phông đó. cursive thường không có phông hỗ trợ tiếng Hàn, vì vậy nên cung cấp nó sau khi chỉ định phông thực sự dùng trong dịch vụ.