Template node - color - font

Dashboard
1

playing around with the template node i try to create a 7 segment display effect clock
i found out how to change the size of the text
but when i try to change color and get the font from external url it wil not show what i want
still in white and not the correct font

what i have in my template node is

<style>
body.nr-dashboard-theme {
    font-size: 10px !important;
}
.md-toolbar-tools h1 {
    font-size: 10px !important;
}

@font-face {
font-family:segment;
src: url "(http://127.0.0.1/Seven Segment.ttf)";
}
    
#TAB_GROUP_cards {
    font color: red;
    font-size: 100px !important;
    font-family: "segment";
}
</style>

also tried color instead of font color also no effect
is it possible what i want to do?

2

Is that the proper css rule name to change a fonts color?

3

i gues the correct way is

color: blue;

but that is not working

4

It is hard to say what is bad in your flow. It is easier to show a way that works.

<!DOCTYPE html>

<html>

<head>
    <style>
        @font-face {
            font-family: "segment";
            src: url("/nrfonts/Seven_Segment/7_Segment.ttf") format('woff');
        }

        .sevenseg {
            color: rgba(255, 0, 0, 0.8);
            font-size: 50px;
            font-family: "segment";
        }
    </style>

</head>


<body>
    <span class="sevenseg">88:88</span>
</body>

</html>

7_Segment

2 Likes
5

Very nice! Thank you so much for helping out!

1 Like