Default font size units and values
Question
Hi
I am using grapesjs in a project that uses proportional scaling everywhere. based on your advice, I can now default the font size selectors to 'em' and make 'em' the only option.
editor.on('load', function () {
const styleManager = editor.StyleManager;
//force font-size to EM
const fontSize = styleManager.getProperty('typography', 'font-size');
fontSize.set('units', ["em"]);
fontSize.set('unit', "em");
fontSize.set('step', 0.1);
fontSize.set('min', 0.1);
fontSize.set('max', 10);
.
.
.
}
everything is fine but when I set the units to EM, the value of the selector is staying as the default in piixels (in this case 9.7) so the selector shows 9.7em whilst the gadgets are appearing in the editor with the font sizes I define as part of creating my gadgets.
Is there a way to sync these up so that the font-size shows the correct value?
I have tried
fontSize.set('value', 1);
but this is overridden.
thanks
Darren B.Answers (2)
Can you create a reproducible demo?
This issue has been automatically closed because there has been no response to our request for more information from the original author. With only the information that is currently in the issue, we don't have enough information to take action. Please reach out if you have or find the answers we need so that we can investigate further.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1781
add a font-size type prop
I'm trying to create a font-size type of property that I would like to add to the dimensions sector. Doing this: Getting the value and all,...
Issue #1977
[QUESTION] gjs-component is not updated with my traits values
Hi, have I modified my HTML using the toHTML function in traits. An HTML element is updated but the gjs-component is not updated still it s...
Issue #1708
StyleManager events fire multiple times per change
To reproduce: On a fresh install of GrapesJS, within the demo page (within index.html), add an event listener like so: editor.on('component...
Issue #3075
BUG: Unhandled Rejection (TypeError): i.classList is undefined
Hi. I updated GrapesJS to its current version 0.16.22 and I get an error on the callback function: editor.on("component:add", (model) => {...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.