Text Size, Scaling, and Column Sizing

It is so hard to make a dash, if I have a tablet that is 1280x900, that is one thing, but when I work on it on my PC, I have to use this horible Devloper mode to emulate that size, and it makes it so hard to edit and work out.

is there a way to lock that dash to a specific size?

I answered my question… you can lock width…

but… why did the fonts get so small?

@Eaton_Blumenstein, you may be interested to check out the following CSS Wiki post that the community users put together, and specifically “adjust the title text font size” part".

To add custom CSS in the Theme, you will need to toggle the Advanced switch at top-right corner, and scroll to the bottom to see the Custom CSS field.

When the Scalable Dashboard option is chosen for sizing, the base font size gets scaled to fit the smallest possible tile (a 1x1). In your case, it looks like you might be using a larger number of columns to give you more flexibility in how the tiles are sized / laid out, so the base 1x1 tile ends up smaller and thus the base font size is smaller.

@James has you covered on one approach you can take for setting the font size. The Custom CSS approach is a powerful approach and I personally like it as you can get a consistent font size across dashboards even with varying column widths.

But I would also note that you can also just customize the header font size in a Style. From the same Theme window James showed above, you can tap the ‘Add Customization’ option for the default style and then select Header Font Size and/or Footer Font Size which gives you control over the size of those elements. :slight_smile:

1 Like

So,

I tried that, and for some reasons the fonts did not change?

am I missing something?


image

At 25 columns wide, you would probably have to use the Custom size for the font size. Probably using a font size closer to 300-400%.

image

Keep in mind that the column width is normally between 2-8 tiles wide:
image

So a 1x1 tile from one of the standard column sizes looks something like this:

Whereas using 25 columns wide would have a 1x1 tile look like this (and the fonts scale accordingly to fit):

The standard font scaling in the Styles are equivalent to:

Name Size
Tiny 75%
Small 90%
Medium 100% (default size)
Large 110%
Extra Large 125%

So on normal column width, the difference between Medium and Extra Large is more noticeable:

image

But since 25 columns is about 4x as big as a default 6 column width, the font would need to be closer to 400% for it to roughly match the ‘standard’ experience. Of course, you can adjust that as you see fit making things larger or smaller to your taste:

For example, here’s the different font sizes on a 25 column wide dashboard with a tile adjusted to 3x3 dimensions:

image

You can see that the ‘Extra Large’ choice is in fact 25% bigger than Medium, but it’s much harder to notice the difference since the starting tile size is so small.

:warning: Note that at those custom font sizes, your tile preview in the Theme/Style editor will probably look a bit funky as it’s assuming a more standard column sizing for the preview tile. :wink:

And as James mentioned, using the Custom CSS snippet he linked to is always an option to get a standard font size.

2 Likes

You guys are Amazing! that was it, I was trying Extra Large, and you were right, 300% for my 25 across…

thanks again, this is why i love Sharptools

3 Likes