Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Switch to fullscreen #217

Closed
mauro-rogledi opened this issue Mar 14, 2024 · 3 comments
Closed

Switch to fullscreen #217

mauro-rogledi opened this issue Mar 14, 2024 · 3 comments

Comments

@mauro-rogledi
Copy link

Is there a way to know when the user switches from normal to full screen mode?
Thanks

@jaywcjlove
Copy link
Member

@mauro-rogledi

There are two methods to implement:

  1. Listening to the className of the body DOM node can determine if it is fullscreen.
  2. Customizing Toolbars and adding click events again.
import MarkdownEditor, { preview, fullscreen } from '@uiw/react-markdown-editor';

const customFullscreen: ICommand = {
  ...fullscreen,
  button: (command, props, opts) => (
    <FullscreenButton
      onClick={(evn, isFull) => {}}
      command={command}
      editorProps={{ ...props, ...opts }}
    />
  ),
};

<MarkdownEditor
  value="Hello Markdown!"
  height="200px"
  toolbarsMode={[
    preview, customFullscreen
  ]}
/>

@mauro-rogledi This is a possible way to achieve your requirements.

jaywcjlove added a commit that referenced this issue Mar 14, 2024
jaywcjlove added a commit that referenced this issue Mar 14, 2024
github-actions bot pushed a commit that referenced this issue Mar 14, 2024
@mauro-rogledi
Copy link
Author

mauro-rogledi commented Mar 14, 2024

Thanks.
Update to 6.1.0 version and works.

@abhinavgautam-07
Copy link

@mauro-rogledi can you share a working example

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants