Yes, but you need to wrap the card in Mod Card. There are some examples in the documentation on Github.
Note that Card Mod is effectively superseded by UIX.
-
what is Mod Card?
-
That sounds exciting, but I’m not sure I want to rewrite all my card_mod mods just yet.
It is just a wrapper that provides an ha-card key for card_mod/uix to act on. Check the example in the wiki.
Just do a search and replace of card_mod for uix. It’s a drop in replacement for the most recent version (4.0+) of Card Mod.
Thanks! This is really promising. Any reason why my event bubbles are all a solid color, and not the faint colored bubble with the more saturated left edge?
I guess that is by design by the developer. He’s super responsive on Github so feel free to raise a feature request.
Are you thinking more along this rough and ready mock-up:
where the colours match the relevant calendar badge at the top?
yes, that would be good. Or something like the picture at the top.
Ah right, I had forgotten about the image in the first post. I can’t remember if event ever looked like that.
@superdingo101 - what do you think, can you build in some styling options for events?
Thanks. I found the card-mod stuff on the github site and got it looking closer to how I want it. A direct control for the event background without the color hard-coded would be great. But otherwise, this is a great card! I had been importing an external webpage using dhtmlx that i’m happy to now have in the HA ecosystem. I’m looking forward seeing the updates as time goes on!
This and Calendar Card Pro are great assets to HA!
Thanks for the kind words!
Once I figure out how to edit my original post, I plan to update the screenshots. It’s incredibly out of date at this point. I’m also working on better compatibility with UIX right now, if you want to test via v3.0.0-beta.1 I would appreciate feedback! I am more responsive and active on GitHub, here’s the v3.0.0-beta.1 branch info Replace shadow DOM usage with host root (_root) and add DOM helper by superdingo101 · Pull Request #164 · superdingo101/skylight-calendar-card · GitHub
v3.0.0 now actively supports UIX (formerly Card-Mod)
1 Like
Is there a way to have the times overlap? Basically show multiple meetings are happening at the same time, and not just the time the meetings start?
EDIT: Ah Schedule View, nvm, found it!
1 Like
Hello, I do like this card very much and I switched from the DIY solution to this one now.
One thing I noticed:
From today I haven 7 days with weather information, but the 4th day is not shown (11.4. from today) Edit: works today
Some questions I have:
- Is there a possibility to style the background of specific days? E.g. holiday, weekend, bank holiday
- Since some versions (I think) one can assign colors to calendar entities in HA. Would it be possible to use these colors for the events of each calendar?
- Would it be possible to create a button or a tab event in the header to be able to switch to the main dashboard even in a kiosk view without HA sidebar and header?
Hi @Fugazzy, if you’re comfortable with GitHub, can you please add these as feature requests there? I am open to each idea.
For the calendar colors one, I’m not sure I understand. Are you saying that you want the calendar colors in skylight-calendar-card to match the colors used by native Home Assistant for the same calendars?
For holiday backgrounds, do you want to select the background url/image per holiday? Or are you looking for something like a single configuration setting you can set to true which pulls in predefined background images per holiday?
@moderators Hi! I’m the original author of this thread. I’ve made a number of updates to the project (new features, improvements, and clearer documentation), but it looks like I’m no longer able to edit the original post.
Would it be possible to either temporarily reopen editing for the first post or convert it to a wiki so I can keep it up to date? I want to make sure new users are seeing accurate and current information.
Thanks in advance for the help!
Amazing card! This card is actually way better than the native calendar function in Home Assistant. Much better overview and easier to create and edit events. Keep up the great work!
2 Likes
EDIT: I found the part in the Wiki.
Hi, thanky you for the latest new features regarding conditional background colors!
I can now define the background color, but I am struggeling in how to define the condition for different events in the calendars.
Can you give me an example how to define this?
EDIT 2:
Can I negate a condition?
“condition: has_event” is not tue
I love this. I would like to use a grid card with Skylight in full width och 2/3 of screen height.
Is it possible to have the week view with fixed height so the days becomes scrollable if many aktivities?
Is there a theme that goes along with this? I’ve add some additional tabs and would like them all styled the same.
@potts-mike
I use the following theme in my own card, this is directly from my configuration.yaml file which I then apply to the dashboard. Is this the type of theme customization you’re after?
frontend:
themes:
MyCalendarTheme:
ha-card-background: "rgba(50, 50, 50, 0.65)"
ha-card-border-radius: "10px"
ha-card-border-width: "0px"
ha-card-border-color: "rgba(255, 255, 255, 0.2)"
ha-card-box-shadow: "0px 0px 4px 1.5px rgba(255, 255, 255, 0.5)"
@Fugazzy
Negation today is possible through regex, depending on what you are looking to do.
If your goal is “has event, but title does not contain first day ”, you can do it with a negative regex, e.g.:
day_styles:
- condition: has_event
calendar: calendar.kid
title_match: "regex:^(?!.*first day).*$"
@mathiasmalmborg82-hu
Today a fixed vertical height is not a natively supported feature today, but something I could work on. Do you mind opening a feature request (issue) requesting this on GitHub?
1 Like