Page 1 of 1
Custom Font-Size & Color Dial Button
Posted: Thursday 23 January 2025 11:54
by HarryHase
How can i change the Size and Color inside a Dial Button (switch) ?
(maybe the lastupdate in an other color?)
Code: Select all
blocks[233] = {
width: 6,
type: 'dial',
color: '#F1C300',
title: 'e-Bike'
}
- Spoiler: show
-
- bike_2025-01-23 114938.jpg (65.28 KiB) Viewed 331 times
Re: Custom Font-Size & Color Dial Button
Posted: Thursday 23 January 2025 16:29
by HarryHase
i figured out howto increase the fontsize via custom.css
Code: Select all
.dial .device {
font-size: 150% !important
}
But that is for all dial button.
Now i have to try to make it per button and lastupdate (change color) ....
Re: Custom Font-Size & Color Dial Button
Posted: Friday 24 January 2025 17:34
by Lokonli
To change the color of lastupdate of this specific block, add the following to custom.css:
Code: Select all
[data-id='233'] .info {
color: red
}
Re: Custom Font-Size & Color Dial Button
Posted: Friday 24 January 2025 18:21
by HarryHase
Tkank you ... with !important it works
Code: Select all
[data-id='233'] .info {
color: red !important
}
Where can i find figure out myself this information?
Re: Custom Font-Size & Color Dial Button
Posted: Friday 24 January 2025 22:52
by HarryHase
I found, that the dashticz site can be analyzed bei chrome with the F12 Key.
Then seach the value or label 23-01-25 ->
Code: Select all
..
<span class="info nosetpoint ">23-01-25 21:34</span>
..
-> behind the span Class is the keyword wich has to be defined in the custom.css
( !important override other defines)
Re: Custom Font-Size & Color Dial Button
Posted: Saturday 25 January 2025 0:13
by HansieNL
HarryHase wrote: ↑Friday 24 January 2025 18:21
Where can i find figure out myself this information?
You can find a lot of styling info in the manual:
https://dashticz.readthedocs.io/en/mast ... omcss.html
Re: Custom Font-Size & Color Dial Button
Posted: Saturday 25 January 2025 0:34
by james01
Great discovery! Using the F12 key to analyze the Dashticz site with Chrome's developer tools is a smart move. It’s such a handy feature for troubleshooting or customizing. Looks like you’re diving into the tech side—keep exploring!