Can we adjust the font size/style per tile?

📝 Dashboards Hubitat Dashboard
1

I am setting up several tablets around the house and I want a Clock for the top line and other tiles below. I want the clock font to be bigger so that we can read it across the room. Right now I have a RPi serving a webpage with a clock and an iframe of the dashboard, it works but the refresh rate is hit and miss. How can I change the font size for the individual tiles? I am assuming somewher in the json code for the dashboard?

Thanks

2 Likes
2

Thanks for the feature request. What you are asking for is not possible in dashboard today.

3

Bummer. Thanks for all your hard work. Just for my own info. What can be done under the advanced tab. (json code)?

4

It's mainly a way to copy and paste layouts and edit settings in the UI.

5

I would love to see this added as well. Or at least the ability to add cusmized code to make it happen.

2 Likes
6

I agree with this suggestion. It is annoying to have to make everything tiny to allow for tiles such as thermostats that contain a lot of information. It would be nice to have the text small on those types while allowing others to utilize the full space to display information

3 Likes
7

+1 for this

8

Hijacking the original feature request (which I'd also love to see), I wonder if it's possible to have different font & tile sizes in the browser/cloud/app views. In particular, font & tile sizes that work fine in a desktop browser that is "local" to the Hub aren't well suited to the dashboard that's displayed on a mobile device via the HE app.

2 Likes
9

I would like to be able to change font for Clock but also be able to change font for the Date and Clock template such that there can be different fonts for date and for clock.

Also, we need to be able to set the tile name to be something other than the name of the device. Often the device name is too long to fit neatly without changing the size of the tile to something that doesn't make sense and wastes real estate.

LJ

2 Likes
10

+1 on everything here.
Maybe keeping it simple, so dashboards could have 2 -3 "standard" tile sizes and font setups, without making every tile full customizable?

My desktop dashboard is completely illegible on my phone.

Desktop

image
image.jpg1114×517 280 KB

mobile

folder
folder.png854×427 487 KB

1 Like
11

We all need to buy the new Samsung folding phone to get more screen real estate lol :smile:

3 Likes
12

Are there plans to add this feature. The oh wants a alexa show style dashboard, very hard to achieve where all the text size is massive to accommodate just the clock.
Is there a way to adjust this as css editing?
Thanks

13

Edit : don't know if this was added with the latest versions.
But anyway, now you have ID assigned to each button, very handy!

So inspect the elements (in a browser) to get the ID of each button and then you can do whatever you want to them via css. like

#tile-12.tile-title {font-size: 10px;}
1 Like
14

@broberg Does the code you provided actually work?

#tile-12.tile-title {font-size: 10px;}

I have a tile with an ID of tile-12, and class of tile-title, but this code does not change the font size of the text in that field (I even verified that the code is showing up in the webite HTML (it is), and that there exists data in the field your exact code is supposed to modify.

I'm wondering if it's just my browser? Very annoying, since being able to change something as you showed would perfectly solve so many of my issues.

15

The Noob’s (in)complete guide to CSS for Hubitat

Mobile Apps

Take a look here it will give you clues on how to figure it out with google inspect.

1 Like
16

You probably need the !important tag on your font-size line.

17

Try #tile-12.tile .tile-title {font-size: 5px !important;}