FamousWolf / week-planner-card

Custom Home Assistant card displaying a responsive overview or multiple days with events from one of multiple calendars
MIT License
172 stars 12 forks source link

Highlight today's date #60

Closed ocean75 closed 4 months ago

ocean75 commented 4 months ago

Good day, This is an awesome project, thank you! It would be beneficial if there were a way to make today's date BOLD, or CIRCLED, or possibly place a LINE underneath the date, or in any way different from the rest of the dates for easier overview.

mcrcclifford commented 4 months ago

The below code assumes that that the startingDay fixed as Monday. now().weekday() will return 0 for Monday, 1 for Tuesday, etc. nth-of-type will apply only to the nth date shown. card_mod: style: | ha-card { margin-top: 25px; } div.container>div:nth-of-type({{ now().weekday()+1 }}) { background-color: rgba(122,37,37,1.0); border-radius: 12px; }

FamousWolf commented 4 months ago

From version 1.5.0 (next release) this can be done using card_mod. See documentation

For example, this will make the date number/text red for today:

card_mod:
  style: |
    .day.today .date {
      color: red;
    }