Make font size of error overlay configurable

[andreyvolokitin]

Is your proposal related to a problem?

The error overlay font size is too small for some people

Describe the solution you'd like

It would be good if it could be configurable

Describe alternatives you've considered

None

Additional context

None

[ianschmitz]

How about we change it to 0.7rem so it scales with the users' font size. Want to send a PR?

[lxfriday]

@andreyvolokitin @ianschmitz I submitted a PR，which makes fontsize larger for error overlay

before

after

[lxfriday]

@ianschmitz #7800

[andreyvolokitin]

@ianschmitz the thing is that user styles are also applied to the developed project itself, and it needs to be developed with default user styles (at least for some time)

@lxfriday a hard coded font size is limited in a way that it can't satisfy all users, some of them want small font to allow more errors to fit into the screen (I thinks that's why it was set to 11px in the first place). Others want it to be easily readable on a big screen (and in case of vision problems)

[ianschmitz]

@ianschmitz the thing is that user styles are also applied to the developed project itself, and it needs to be developed with default user styles (at least for some time)

Can you explain what you mean? I don't quite follow.

[andreyvolokitin]

The user styles which are set through browser settings will as well be applied to the page which is currently developed in the browser (along with the error overlay). This can be undesirable because generally you need to develop in default browser mode (so without increased zoom or user styles applied) in order to see and control how the page design looks with default settings

[andreyvolokitin]

Does it make any sense? I think it might be appropriate to incorporate this into theming side, because a standalone font size setting might be a "wrong" solution, despite of being easier. How hard it could be to incorporate some degree of custom theming where font size setting could reside? (even if this setting would be an only available setting for the time being). If my proposal makes sense I can investigate, and maybe do a PR (though I'm not familiar with react ecosystem yet)

[andreyvolokitin]

Also, if the overlay itself could be labeled with some (very unique) ID or class then it could be possible to target it via user styles and it might make everything easier... Then the rem/em solution would be ideal, I actually wanted to go that route initially but found out that overlay can't be distinguished/identified for separate styling