BUG: Rich text editor very big icons in Firefox - Githubissues

GrapesJS / grapesjs

Free and Open source Web Builder Framework. Next generation tool for building templates without coding

https://grapesjs.com

BSD 3-Clause "New" or "Revised" License

22.36k stars 4.05k forks source link

BUG: Rich text editor very big icons in Firefox #4176

Closed varadero closed 2 years ago

varadero commented 2 years ago

GrapesJS version

[X] I confirm to use the latest version of GrapesJS

What browser are you using?

Firefox 95.0.2 (64-bit)

Reproducible demo link

https://grapesjs.com/demo.html

Describe the bug

How to reproduce the bug?

Use Firefox 95.0.2 (64-bit) to open https://grapesjs.com/demo.html
Double click on some text (like "Build your templates without coding")

What is the expected behavior? Rich text editor is shown with normal button sizes

What is the current behavior? Rich text editor is shown with very big buttons

This is how it looks like:

If is necessary to execute some code in order to reproduce the bug, paste it here below:

// your code here

Code of Conduct

[X] I agree to follow this project's Code of Conduct

varadero commented 2 years ago

It looks like if I delete the <svg> elements which are part of the toolbar HTML, the vertical size becomes OK. These are the <svg> elements that cause the big height:

This is how the rich text editor looks like when I delete them from HTML:

Adding width="24" height="24" to the <svg> elements (to somehow match the viewBox) resizes them like this: