[PROBLEM] Font sizes on Safari Browser

[Meestor_X]

No issues on my end with font sizes This is on an iMac using either Safari, Chrome or Firefox.

What resolution is the monitor? It's at it's worst on a 4k monitor.

Do you see the parameter name smaller than the value? In my testing, on iOS the 2 are the same size. On desktop, the parameter name is smaller than the value.

[Nutul]

On my Linux with chrome the parameters' labels are smaller than the values in the boxes; I would say a good 50% smaller, if not more (roughly judging by text height). Same goes for Brave and Firefox. The screen is 1920 x 1080

On my iPhone7 iOS ver. 15.8 they are the same size.

Everywhere the values in the boxes fit comfortably well.

[Tim Curtis]

The font sizes are all perfect on my iMac (1080p), iPhone14, iPad Mini2.

Possibly at 4K 3840 x 2160 resolution the ancient bootstrap code behind the config screens is showing its age. For example the font size for control labels is 12px (pixels) while the font size for the text in the control is 1rem. This is prolly why the labels remain small while the text in the controls is larger. A lot of the old bootstrap code is in pixels :-0

I suppose the reason this hasn't come up before is that it's a real challenge to read text on a monitor at 4K resolution so I'm guessing that most people would prolly apply 2X zoom or scaling if the display settings offered it or just lower the resolution to something like 1080p.

It would be a good project for a dev that has a 4K monitor to see what needs to be overridden or modified in the bootstrap css.

[Meestor_X]

The css that has to be changed is for the controls that have

Code:

font-size: 1rem

listed.
Using the browser dev tools, I just delete that css property and the sizes become correct.

Images:

Normal (without editing css)
   

Fix #1
   

Fix #2
   

[Nutul]

The css that has to be changed is for the controls that have

Code:

font-size: 1rem

listed.
Using the browser dev tools, I just delete that css property and the sizes become correct.

Also the titles (the text on the left) of the input fields and the description shown clicking on (i) look very small; have you found something similar in the CSS for them too?

[Meestor_X]

Also the titles (the text on the left) of the input fields and the description shown clicking on (i) look very small; have you found something similar in the CSS for them too?

Well, I guess a decision should be made at some point whether everything should be fixed font sizes or scale with the browser window and screen resolution.
My fix makes things the same size, but small. Probably the "correct" way would be to have it size everything depending on the resolution. (not using fixed pixel #'s)