1.3.1 • Published 3 months ago

@milkdown-lab/plugin-fullscreen v1.3.1

Weekly downloads
-
License
MIT
Repository
-
Last release
3 months ago

@milkdown-lab/plugin-fullscreen

Plugin add fullscreen feature to milkdown editor.

Usage

pnpm add @milkdown-lab/plugin-fullscreen
import { fullscreen } from '@milkdown-lab/plugin-fullscreen'
// ...
const editor = await Editor.make()
  .config(() => {
    ctx.set(rootCtx, document.querySelector('#app'))
  })
  .use(fullscreen)
  .create()

Plugins add keyboard shortcuts, you can use F11 to toggle fullscreen when editor was be focused.

Options

Styling

@milkdown-lab/plugin-fullscreen is now headless as same as milkdown v7, see here for reason, so you need styling by yourself.

you should styling .milkdown.fullscreen selector by default option, for example:

.milkdown.fullscreen {
  position: fixed;
  inset: 0;
  overflow-y: scroll;
}

Adding custom attributes

You can also add attributes to fullscreen element if you want if you want to build your own style logic or using atom css library like tailwindcss.

import { fullscreen } from '@milkdown-lab/plugin-fullscreen'
// ...
const editor = await Editor.make()
  .config(() => {
    ctx.set(fullscreenOptionsCtx.key, { attributes: { class: 'fixed inset-0 overflow-y-scroll' } })
    ctx.set(rootCtx, document.querySelector('#app'))
  })
  .use(fullscreen)
  .create()
1.3.1

3 months ago

1.3.0

3 months ago

1.2.3

6 months ago

1.2.2

10 months ago

1.2.0

1 year ago

1.1.1

1 year ago

1.2.1

1 year ago

1.1.0

2 years ago

1.0.1

2 years ago

1.0.0

2 years ago

0.1.1

2 years ago

0.1.0

2 years ago

0.0.0

2 years ago