Family calendar

Share your Projects! Dashboards & Frontend
65

I am trying to change the font size for the different calendar portions—specifically the .title portion. I want to make the title larger and I can’t figure what I need to put into a card_mod to make it work. The below is from inspecting the Title portion.

ha-card {
    --days-spacing: 15px;
    --day-date-number-font-size: 3.5em;
    --day-date-number-line-height: 1.2em;
    --day-date-text-font-size: 2.25em;
    --events-margin-top: 10px;
    --event-spacing: 5px;
    --event-padding: 10px;
    --event-border-width: 5px;
    --event-border-radius: 5px;
    **--event-font-size: 2em;**

Thoughts?

66

I have been playing with this more and not making any progress.

Below is what I have tried but they didn’t make any difference to the event size.

card_mod:
          style: |
            ha-card {
            .event {
             font-size: var(--day-date-number-font-size) !important;
            }
          }
           ```



card_mod:
          style: |
            ha-card {
            .event {
             font-size: 50px !important;
            }
          }
            ```

card_mod:
          style: |
            ha-card {
            .event {
             font-size: 3em !important;
             }
            }
          ```
67

Disregard…this was a dumb mistake on my part. I spun up a new version of HA and I forgot to install card-mod. :man_facepalming:

68

First off, this is awesome and exactly what I have been trying to find!

I noticed that the calendar integration in HA has the ability to add events, delete events, and even create a calendar.

Also noticed that when clicking an event in the default calendar card there is an option to delete the event, but this is not an option in your project.

Is there a way to mirror some of the calendar functionality that is in the default card?

Thanks for all of your efforts and a great mod

69

Love your calendar!
I’ve managed to take inspiration from DAKBoard and create a lovelace dashboard similar to what I had previously, but now with an iteractive touch!

HomeAssistant Board
HomeAssistant Board1920×1080 349 KB

Check out my config here:
https://github.com/arogers86/HABoard

I do a lot with card_mod for the weekly planner and it looks great.

3 Likes
70

Love this card calendar. I am having an issue getting the background to be set up. Where do you store and how do you fetch the background image?

Custom element doesn’t exist: week-planner-card.
I tried UI then manual config My local folder is apparently, www/community
The initial install put the .js and .gz in a folder called /week-planner-card in the www folder. It showed up (and looked amazing) but keeps disappearing with that error above. I have tried every combo I could of
/local/week…
/local/www/week…
/www/week…
/local/week/community/www…
etc. I am sure you get the idea.
I pulled the .js file out of the subfolder and deleted that, trying all of the above again, but same results.

Any suggestions or guidance would be much appreciated.

71

Love this planner - just what I was looking for. Quick question - is it possible to add the ability to go backwards / forwards through the calendar. eg. a button to jump to the next week / month ( have it as a month view and would be good to be able to jump forward to next month to see what’s coming up)

72

Any chance someone would know how to highlight the background color of events from specific calendars similar to this photo?

cal
cal1728×1038 218 KB

1 Like
73

I love this calendar, thank you so much for the work you put in. Would it be posible to have the ability to show it as a list for display on screens in portrait orientation? (similar to the view that shows when you are editing).

74

Hello All -

@FamousWolf thanks for making this, it’s a great addition to HA! I’ve got it working well, but ran into one issue, my text is showing dark vs. every other photo shows text white…

Any ideas how to fix this?

Here is a screenshot of my clock and in the corner and with my photo background it’s almost invisible…

Screenshot 2024-08-25 at 12.07.57 PM

75

No way to navigate through months ?
It will be perfect with that !

76

I am looking for this as well. I would love a nice design in portrait mode.

77

I think this might help: Family calendar - #59 by FamousWolf