Upau wa zana unaoshikamana Nafasi ya kibodi ya simuAina msingi ya herufiKipenyo

NABI NOTE

Kihariri cha WYSIWYG cha chanzo huria

NABI NOTE ni kihariri huria cha WYSIWYG. Uumbizaji, mpangilio, majedwali, upakiaji na vipengele vingine vimetenganishwa na kiini kuwa moduli huru zinazoitwa mabawa. Chagua mabawa unayohitaji ili kukusanya kihariri, au unganisha bawa lako. Kimeandikwa kwa JavaScript ya kawaida, hivyo kinafanya kazi na React au Vue. Unaweza kuanza bila usanidi wa ujenzi kwa maktaba ya CDN. Muundo wake wa hati, NABI TREE, hubadilishwa kuwa HTML hata katika Node.js bila DOM. Hati za ingizo hurekebishwa kwa kanuni zilizosajiliwa, maandishi na sifa hutoroshwa, na anwani za viungo hukaguliwa. Mabawa maalum na data ya seva lazima vikaguliwe kwa sera ya usalama ya programu. Vigeu vya CSS na mpangilio wa rem hukuruhusu kurekebisha mandhari na ukubwa; mandhari meusi, aina za herufi za lugha nyingi, upangaji wa jedwali, historia ya ndani na kazi za hati za AI zote zinatumia muundo huohuo wa hati.

Aina ya herufi

Fonti mbadala kwa kila lugha zimetayarishwa kwa familia bila serif (chaguomsingi), yenye serif, nafasi moja na mwandiko. Fonti inayofaa familia iliyochaguliwa isipokuwepo, fonti chaguomsingi ya kivinjari hutumiwa. Ukurasa wenye kihariri huamua fonti chaguomsingi ya kihariri.

Kila familia hapa chini inaonyeshwa katika lugha nyingi.

산세리프 · ゴシック体 · 无衬线 · Serifenlos · Sans empattement · Sin serifa · Sem serifa · Без засечек · بلا زخارف · सैन्स सेरिफ़ · স্যান্স সেরিফ · سانس سیرف · Tanpa serif · بدون سریف · सॅन्स सेरिफ · Không chân · శాన్స్ సెరిఫ్ · Mara seref · Sans serif · Bila serif · சான்ஸ் செரிஃப் · ไร้เชิง · Senza grazie

세리프 · 明朝体 · 衬线 · Serif · Avec empattement · Con serifa · Com serifa · С засечками · بزخارف · सेरिफ़ · সেরিফ · سیرف · Berserif · سریف · सेरिफ · Có chân · సెరిఫ్ · Mai seref · Yenye serif · செரிஃப் · มีเชิง · Con grazie

고정폭 · 等幅 · 等宽 · Dicktengleich · Chasse fixe · Monoespaciada · Monoespaçada · Моноширинный · ثابت العرض · मोनोस्पेस · মনোস্পেস · یکساں چوڑائی · Lebar tetap · تک‌فاصله · Đơn cách · మోనోస్పేస్ · Tazara ɗaya · Eş aralıklı · Nafasi moja · ஒற்றையகலம் · ความกว้างคงที่ · Monospaziato · Monospace

필기체 · 筆記体 · 手写体 · Schreibschrift · Cursive · Cursiva · Рукописный · خط اليد · हस्तलिपि · হস্তলিপি · رواں خط · Tulisan tangan · دست‌نویس · हस्ताक्षर · Chữ viết tay · చేతిరాత · Rubutun hannu · El yazısı · Mwandiko · கையெழுத்து · ลายมือ · Corsivo

Ukubwa wa maandishi

Kidogo sana

Kidogo

Kikubwa

Kikubwa sana

Vichwa

Kwenye mstari mtupu, andika # kisha nafasi ili kuugeuza kuwa kichwa.

H1

H2

H3

H4

H5

H6

Nzito · Mlalo · Mstari wa chini · Kufuta

Nzito mlalo mstari wa chini ~~mstari wa kufuta~~ vinaweza kutumiwa pamoja kwenye herufi moja.

~~Vinaweza kupangwa pamoja.~~

Kiambishi cha juu na cha chini

Eneo ni 3.5m² na maelezo ya chini huongezwa hivi.¹

Maji ni H₂O.

Rangi ya maandishi · Kuangazia

Paleti hubaki kusomeka katika mandhari mepesi na meusi.

Rangi ya maandishi Kijani · Matumbawe · Urujuani · Kahawia dhahabu · Bluu

Kuangazia Njano · Kijani · Samawati · Waridi · Zambarau · Chungwa

Kiungo

Weka anwani na inakuwa kiungo.

Unaweza kutumia http:// na https://, pamoja na njia za tovuti zinazoanza kwa . au /. Anwani kama javascript: haziruhusiwi.

Andika https://nabi.saro.me na ubonyeze nafasi au Enter — hubadilika yenyewe.

Kufungua kiungo

Hati huhifadhi anwani ya kiungo pekee; ukurasa unaoonyesha hati huamua namna ya kukifungua.

Kiungo cha kiambatisho

Faili zisizo picha hubaki kama viungo vya viambatisho, kama mfano ulio hapa chini.

Kiambatisho: kiungo chake huhifadhiwa katika hati.

Mpangilio

Imepangwa kushoto

Imepangwa katikati

Imepangwa kulia

Mpangilio wa kushoto, kati au kulia hautumiki kwa vichwa.

Orodha

Orodha yenye vitone

Kwenye mstari mtupu, andika - kisha ubonyeze nafasi ili kuugeuza kuwa orodha yenye vitone.

Kipengee chenye kitone
- Tab / Shift+Tab huingiza ndani na kurudisha nje.

Orodha ya namba

Kwenye mstari mtupu, andika 1. kisha ubonyeze nafasi ili kuugeuza kuwa orodha yenye namba.

Ya kwanza
Ya pili
Ya tatu

Orodha ya kazi

Kwenye mstari mtupu, andika [ ] au [x] kisha ubonyeze nafasi ili kuugeuza kuwa orodha ya ukaguzi.

Kipengee hiki kimekaguliwa.
Hiki bado hakijakaguliwa.

Jedwali

Seli zinaweza kuwa na aya na vitalu kadhaa, huku rangi za mandharinyuma zikitofautisha yaliyomo. Jaribu kuhariri moja kwa moja maandishi na picha katika jedwali lifuatalo.

Nyenzo	Maelezo ya kazi
Picha na maelezo yake katika seli moja.	Aya zinazonyumbulika Bonyeza Enter kuanza aya mpya, au Shift+Enter kuanza mstari mpya ndani ya aya hiyo hiyo.
Kubadilisha mandharinyuma ya seli Kuingiza orodha ndani kwa Tab Kuchagua seli kadhaa na kutumia rangi moja	Bofya kuona vidokezo vya kuhariri Seli pia zinaweza kuwa na vitalu vinavyokunjwa, nukuu, msimbo na video. Kuunganisha seli huhifadhi yaliyomo kwa mpangilio wake.

Nyenzo

Maelezo ya kazi

Picha na maelezo yake katika seli moja.

Aya zinazonyumbulika

Bonyeza Enter kuanza aya mpya, au Shift+Enter kuanza mstari mpya ndani ya aya hiyo hiyo.

Kubadilisha mandharinyuma ya seli
Kuingiza orodha ndani kwa Tab
Kuchagua seli kadhaa na kutumia rangi moja

Bofya kuona vidokezo vya kuhariri

Seli pia zinaweza kuwa na vitalu vinavyokunjwa, nukuu, msimbo na video.

Kuunganisha seli huhifadhi yaliyomo kwa mpangilio wake.

Bofya ndani ya seli kuonyesha rangi ya mandharinyuma na zana za safu mlalo na wima. Chagua seli kadhaa kubadilisha rangi na mpangilio wake pamoja. Kuweka jedwali lote mahali, chagua “Chagua jedwali”, kisha tumia zana za kupanga.

Majedwali yenye rangi au vitalu kadhaa huhifadhiwa kama HTML hata yanapohifadhiwa katika Markdown.

Rangi za mandharinyuma ya seli

Rangi zote zinazotumika kwa mandharinyuma ya seli zimeonyeshwa hapa. Bofya seli kubadilisha rangi yake, au chagua “Chaguo-msingi” kwenye sifa ili kuondoa mandharinyuma.

Njano

yellow

Kijani

green

Siani

cyan

Waridi

pink

Zambarau

purple

Machungwa

orange

Upangaji wa safu wima

Bofya Hakiki, kisha ubofye seli za vichwa vya Hisa na Bei kwa zamu.

Muundo	Hisa	Bei	Uzito
NB-7	1,200	349	1.2 kg
NB-9	20,000	99	0.9 kg
NB-12	3,500	1,299	1.4 kg
NB-80	900	8,900	2.1 kg
NB-100	Haijaamuliwa	12,999	2.4 kg

Bei ina thamani za namba pekee, kwa hiyo safu hupangwa kwa thamani za namba.

Hisa ina namba na maandishi, kwa hiyo safu hupangwa kama mifuatano ya herufi.

Kitenganishi

Andika --- na ubonyeze Enter ili kuigeuza kuwa mstari wa kutenganisha.

Picha

Upana huanzia 30% hadi 100%, kushoto, katikati au kulia.

Eneo linaloelea

Kwa muhtasari

Eneo dogo la ziada kwa maandishi, picha na majedwali.

Mahali	Kulia
Upana wa juu	40%

Tumia eneo linaloelea kuweka maelezo ya ziada au nyenzo ndogo kando ya maandishi makuu. Hati ikiwa pana, maandishi haya hupita kando ya eneo. Bofya ndani yake kuhariri maandishi na kuingiza picha au majedwali kwenye kihariri hicho hicho.

Weka kishale ndani ya eneo kufungua zana za sifa. Badilisha upande wa kushoto au kulia, kisha chagua upana wa juu wa 20, 30, 40 au 50% unaofaa maandishi. Majedwali na picha zinazobandikwa pia hubaki ndani ya eneo.

Unaweza pia kufungia aya zilizochaguliwa ndani ya eneo. Kitufe cha kuondoa eneo kilicho kando ya upana huacha yaliyomo katika hati kuu. Hakiki huficha mpaka wa nukta wa kuhariri; katika hati nyembamba au uchapishaji, yote hufuata safu moja.

YouTube

Upakiaji

Jaribu kuburuta picha au faili hadi kwenye kihariri.

Onyesho hili halitumi faili kwa seva halisi. Unganisha kipakiaji kwenye programu yako ili kuzihifadhi kwenye seva.

Baada ya kufungua kichagua picha au kuanza upakiaji, kuhamisha kishale pekee bado huingiza kwenye nafasi ya awali. Kuhariri hati wakati wa kusubiri hughairi uingizaji na kuonyesha taarifa. Maendeleo na matokeo ya upakiaji ulioanzishwa ndani ya seli pia hubaki humo.

Nukuu

Andika > kisha nafasi kwenye mstari mtupu ili kupata kisanduku cha nukuu.
Inaweza kuendelea kwa mistari kadhaa.

Msimbo

Kwenye mstari mtupu, andika ``` na ubonyeze nafasi au Enter ili kuugeuza kuwa kisanduku cha msimbo.

Ukiandika pia jina la lugha, kama ```java, kisha ubonyeze nafasi au Enter, kisanduku cha msimbo kitawekwa katika lugha hiyo.

import { createNabiWith, defaultWings } from 'nabi-note'

const { nabi } = createNabiWith(defaultWings)
const html = nabi.getHtml()

Maelezo

Maelezo huundwa kwa muhtasari na mwili.

Chagua kama yanahifadhiwa yamekunjwa au yamefunguliwa.

Upau wa zana

Zana za vichwa, uumbizaji, mpangilio, orodha, uingizaji na hati zimepangwa katika vikundi. Kwenye kompyuta zana zimepanuliwa; kwenye simu kuna zana za haraka na paleti kamili. Sifa za jedwali au eneo linaloelea lililochaguliwa huonekana chini yake.

Njia za mkato

Bonyeza Shift mara mbili haraka kuchagua zana kwa kibodi. Kwenye kompyuta pitia upau uliopanuliwa, na kwenye simu paleti kamili. Tumia Tab kubadilisha kikundi, mishale kuchagua zana, na Enter kuitumia.

Mwishoni mwa kitalu cha nukuu, msimbo au kinachokunjwa, bonyeza Enter mara mbili haraka kutoka nje. Muda chaguomsingi wa kubonyeza mara mbili ni 180ms.

Uumbizaji wa moja kwa moja

Mfano	Kitufe cha tendo	Matokeo
#	Nafasi	Kichwa
-	Nafasi	Orodha yenye vitone
1.	Nafasi	Orodha ya namba
[ ] · [x]	Nafasi	Orodha ya kazi
>	Nafasi	Nukuu
``` · ```ts	Nafasi · Enter	Kisanduku cha msimbo
---	Enter	Kitenganishi
https://…	Nafasi · Enter	Kiungo

Vitendakazi vya towe

Kitendakazi	Matokeo
getHtml()	HTML
getJson()	JSON

Hufanya kazi bila DOM

Kubadilisha NABI TREE kuwa HTML hakuhitaji DOM.

Seva (Node.js) pia inaweza kusoma NABI TREE iliyohifadhiwa na kutengeneza HTML kwa kanuni zilezile.

Rafiki kwa simu

UI ya simu — Hupanga zana za kuhariri kulingana na upana wa skrini.
Marekebisho ya kibodi ya simu — Hurekebisha urefu wa eneo la kuhariri kibodi inapofunguka.
Ukubwa unaonyumbulika — Hutumia vipimo vya rem katika mpangilio mkuu ili kuendana na kukuza au kupunguza mwonekano.
Lugha nyingi — Unaweza kuweka locale na aina ya herufi kulingana na lugha na mwelekeo wa maandishi.

Ubinafsishaji

Bawa lako — ukihitaji kipengele, unaweza kukitengeneza na kukiunganisha mwenyewe.
CSS yako — unaweza kurekebisha rangi kuu, pembe na nafasi kwa tokeni za --nabi-* ili zilingane na hali nyepesi na nyeusi.
Huria — msimbo chanzo huchapishwa kwenye GitHub na huendelezwa kwa ushirikiano.

Soma nyaraka → nabi.saro.me

HTMLKihariri kinapakiwa…

JSONnabi-treeKihariri kinapakiwa…

Sakinisha

npm install nabi-note

Msimbo

import {
  createLocale, createNabiWith, mountSurface, mountToolbar,
  mountContextToolbar, mountHints, watchSettle, makeTranslator,
  defaultWings, mountUpload, mountUploadView, browserFileStore,
  mountFile, mountViewTools, browserHistoryStorage, mountLocalHistory,
  openHistoryPanel,
} from 'nabi-note'
import { mountDiffWing } from 'nabi-note/diff'
import { mountOutline } from 'nabi-note/viewer'

// The box that asks — without it the core answers "no" to everything (plug in your own)
const ask = { message: (t: string) => alert(t), confirm: (t: string) => confirm(t) }

const selected = [
  ...defaultWings,
]
const locale = createLocale('sw')
const { nabi, registry } = createNabiWith(selected, { ask, locale })

// Bring your own highlighter (Prism, highlight.js, Shiki, …) — the wing stays as it is
// and only the attach is swapped (`makeCodeAttach` ships from the same door)
// { ...codeWing, attach: makeCodeAttach({ highlight: (source, lang) => [{ text: source }] }) }

const root = document.querySelector('.nabi')!
const content = document.querySelector('.nabi-content')!

const view = mountUploadView({ nabi, surface: content, locale })
const upload = mountUpload({
  nabi, root: content, locale,
  // your upload goes here — report progress with task.onProgress(0–100)
  uploader: async (task) => ({ uri: 'https://cdn.example/uploaded' }),
  extensions: ['png', 'jpg', 'pdf'], maxFileSize: 10 * 1024 * 1024,
  onStart: (tasks) => view.start(tasks),
  onProgress: (id, percent) => view.progress(id, percent),
  onSettle: () => view.settle(),
  onDone: () => view.done(),
})
const file = mountFile({ nabi, registry, store: browserFileStore(document), locale, name: () => 'note' })
const history = mountLocalHistory({ nabi, storage: browserHistoryStorage(window) })
const diff = mountDiffWing({ nabi, registry, surface: content, locale })

// The locale also sets the direction — Arabic and Urdu run right to left
mountSurface({ nabi, registry, root: content, locale, fileSink: upload.take })

const trigger = document.createElement('button')
trigger.type = 'button'
trigger.textContent = makeTranslator(locale).t('outline')
trigger.style.cssText = 'position:fixed;right:1rem;bottom:1rem;z-index:1000'
root.append(trigger)
const outline = mountOutline(content, {
  trigger, locale,
  scrollContainer: () => root.classList.contains('is-fullscreen') ? root : window,
  onChange: ({ items, activeIndex, available, open }) => {
    trigger.hidden = !available
    trigger.setAttribute("aria-expanded", String(open))
  },
})
trigger.onclick = () => outline.toggle()
// Call outline.unmount() when removing the editor

const settle = watchSettle(document, { surface: content })
const shared = { nabi, registry, surface: content, settle, locale }
// A tool that needs a panel comes back to the host — without this the button is dead
const toolbar = mountToolbar({
  ...shared, root: document.querySelector('#toolbar')!,
  file,
  onFiles: upload.take,
  onHost: (w) => {
    if (w === 'diff') { diff.open(); return }
    if (w !== 'localHistory') return
    openHistoryPanel({
      history, surface: content, locale, sessionId: history.sessionId,
      render: (record) => createNabiWith(selected, { doc: JSON.parse(record.body) }).nabi.getHtml(),
    })
  },
})
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')