Glance card (oder andere): Datum Schriftgröße

Dashboard/Cards/Frontend
1

Hallo Community,

mein erster Post. Ich bin seit einiger Zeit HA-User und möchte nun mein Dashboard für mein BigScreen (27") in der Küche aufhübschen. Die Schrit ist leider viel zu klein dargestellt und man kann von weitern nichts auf dem Screen erkennen.

Ich möchte mir Datum und Uhrzeit lesbar darstellen.
Schrift vergrößern klappt mit dem Card-Mod wunderbar, leider wird das Feld nicht größer und die Schrift verschwindet zur Hälfte.

show_name: false
show_icon: false
show_state: true
type: glance
entities:
  - entity: sensor.date
  - entity: sensor.time
theme: Mushroom Square Shadow
columns: 2
state_color: false
card_mod:
  style: |
    ha-card {
      font-size: 50px;
          }

datum

wie macht ihr das? Kann ich das auch einfacher mit einer anderen Karte darstellen?? Bin für Anregungen offen.

Danke

3

Hast schon einmal im card_mod

ha-card {
    font-size: 50px;
    height: 200px !important;
          }

eingesetzt? Damit solltest du die Höhe der Karte beeinflussen können. Die Anzahl der Pixel musst du natürlich probieren.

4

Danke für den Tipp.
Habe es probiert, aber das vergrößtert den Button an sich:

datum

Vielleicht kann ich dafür auch ne andere Kachel wählen?

Hier wäre mal ein Best Practice Video schön, es muss doch noch mehr Leute geben die das Dash auf einem großen screen darstellen wollen :slight_smile:

5

Schau mal hier:

Dort findest du zu fast jeder Karte card-mod code, da jede Karte schon unterschiedliche Syntax hat.

Und hier der Abschnitt zur Glance Card:

6

Habs hinbekommen, nach vielen trial an errors.
Danke für euren Support.

Für alle die es auch hinbekommen wollen:
(Es gibt sicher viele Wege, das ist meiner)

type: custom:mushroom-entity-card
entity: sensor.date
fill_container: true
primary_info: none
secondary_info: state
icon_type: none
layout_options:
  grid_columns: 4
  grid_rows: 2
tap_action:
  action: none
hold_action:
  action: none
double_tap_action:
  action: none
card_mod:
  style: |
    :host {
    --mush-card-secondary-font-size: 60px;
    --mush-card-secondary-line-height:65px
    }
7

Hi, es freut mich das du eine Lösung gefunden hast. Allerdings verwendest du darin ja jetzt die custom:mushroom-entity-card und nicht mehr die glance Karte. Das passt dann nicht mehr so richtig zur Überschrift und deiner ursprünglichen Frage. :wink:

8

ja ist leider etwas unglücklich formuliert.
Hab zwar im ersten post geschrieben ob es auch mit einer anderen Karte ginge, aber leider nicht in der Überschrift.
Kann die auch leider nicht mehr ändern.

9

Habe die Überschrift angepasst.

10

Hatte ich am Anfang auch überlesen. Deshalb der Vollständigkeit wegen hier noch meine Lösung:

type: custom:digital-clock
locale: de
dateFormat: DDDD
timeFormat: HH:mm
card_mod:
  style: |

    .first-line {
      font-weight:600 !important;
      font-size: 100px !important;
    }

    .first-line, .second-line {
      font-weight:300;
    }

Vielleicht passt das ja für jemanden.