Hello,
is it possible to show the Day Number for Saturday and Sunday in a different Color?
ManyThanks
Daniel
Hello,
is it possible to show the Day Number for Saturday and Sunday in a different Color?
ManyThanks
Daniel
I have found the name: var is used only in a hidden option to view the Legend.
If at the top level you use showLegend: true you will see the calander.name so if you use the name var on the cal level you can show a friendly name like below.
And yet another time the community comes to the rescue
Not exactly what I’ve asked for, but a perfect workaround.
As this feature isn’t documented, how’d u find out?
Thanks a lot +1 for you @Skilly
Its in the code. I was trying to solve another problem and came across lots of refs to Legend and gave it a try.
Yeah the app is setup nicely to make changes like that if you are using card mod. If not you just need to install it in the HACS Store. See the examples in the picture.
put this code inline at the top level. If your using style already just add from the .saterday down
card_mod:
style: |
.saturday .number {
color: #d50000;
}
.sunday .number {
color: red;
border-radius: 100%;
background-color: rgba(0,0,250,.1);
}
Sorry this should have been a reply to @PapaWago
Alright this one took me a minute but I got it worked out. Your going to need to wrap your card inside another card called config-template-card. Then you can put some variables in and call them. See the code below.
type: custom:config-template-card
variables:
DAYS: states['number.days_this_month'].state
entities:
- number.days_this_month
card:
type: custom:week-planner-card
timeFormat: h:mma
hideDaysWithoutEvents: true
days: ${DAYS}
showLegend: true
calendars:
- entity: calendar.family
color: "#8e24aa"
name: Family
I Quite can’t get it to work.
…installed the config-template-card, but it doesn’t even show the calendar.
Does the variable interact with the custom week planner? Or does it just limit the size of the area where the calendar is shown?
Hey I thought others might be interested I was able to get my problem fixed with the second color for each Calendar. See the results below. I submitted a pull request for the change which is very small to allow for it.
As I said it requires a code change but here is how it works once that’s done.
calendars:
- entity: calendar.family
color: rgba(142,36,170,1)
background: rgba(142,36,170,.2)
name: Family
- entity: calendar.sarah
color: rgba(0,255,215,1)
background: rgba(0,255,215,.2)
name: Sarah
- entity: calendar.greg
color: rgba(239,108,0,1)
background: rgba(239,108,0,.2)
name: Greg
- entity: calendar.jacob
color: rgba(213,0,0,1)
background: rgba(213,0,0,.2)
name: Jacob
- entity: calendar.charlotte
color: rgba(61,66,245,1)
background: rgba(61,66,245,.2)
name: Charlotte
Wow, many Thanks. It just works fine
I just noticed my calendar is defaulting to the timezone set by the device I am using.
I am currently using my device in Perth which is AWST +8GMT but the events in my calendar are based on AEST +11 DST (Daylight Savings Time)
This is resulting in my calendar showing a 3hr difference.
Can someone show me how to use the locale setting, to I assume lock the calendar times to the locale of the events? Rather than my current locale.
I might be missing something really simple but how do I change the text colour for “No Events” text, the text for actual events and times? Mine are grey on a darker grey background and can barely see them!
Do you know if these changes were merged? I tried making the YAML changes you mentioned but nothing changed for me.
I would like to add some buttons and entities cards to the bottom of the calendar page. I planed for the buttons to allow me easily change to other dashboard pages. Does anybody know how to add these buttons and entities cards to the bottom of the calendar page?
I can get the different calendars to show a line on the left with the color but I cannot get the background color to show up, any suggestions?
That is an awesome view of the calendar. I had to tinker a bit as I am very fresh with HA but it worked out really nice.
I need to play around with it…
Best, J.
In case you haven’t gotten an answer yet: You need to use “background-color” not “background”.
Hi everyone,
Does anyone know how to remove the Spaces or make them smaller?
i’ve tested several settings, but nothing works
card_mod:
style: |
ha-card {
box-shadow: none;
font-size: 7px !important;
width: 1900px;
max-height: 250px !important;
overflow: hidden;
.event {
line-height: 8px !important;
padding: 1px !important;
border-width: 5px !important;
border-radius: 2px !important;
margin-top: 0px !important;
font-size: 1.5em !important;
}
}
any idea?
I’m also trying to change the color and time dimension, but without success.
anyone know how to do it?
I used a negative value on “margin-top” and it works:
e.g.
margin-top: -3px !important;
Fantastic card, I love it! I’m displaying a full week on the dashboard. There is just one problem - it almost always have problems loading together with the rest of the dashboard and most often it’s just busy loading showing a spinning white circle.
I run in the same dashboard plotly, apex chart, weather-card and quite a few entities.
Is there anything I can do to speed up Family Calendar?
Edit: I seem to have resolved it. Apparently a card utilizing Apex chart importing Nordpool data seem to make the Family Calendar card almost impossible to load. As soon as I removed the Apex chart card Family Calendar loads almost instantly.