Yes and it works like a charm!!! 
Just wondering if you or anyone else had luck making the clock 12 hour??
I have to say that I REALLY love this Sidebar Card, thanks for your efforts!
I am not sure if I am alone, but this card does not render if I navigate away and return to my Lovelace Dashboard. I need to reload the page everytime, this could be problematic if I decide to use it with a wall mounted tablet, how can I reload the page or make sure that it renders everytime.
Also could I ask for a few non-functional enhancements?
- Specify a font-color for the Digital Clock. Ability to Bold if possible.
- Specify a font-color for the date (independent of the clock color)
- Specify a color for the dividing lines, right now they remain white.
Lastly, would anyone know if there is a way to insert badges in the ābottom-cardā somehow? I would like to display 3 or 4 badges in a row. 3 for presence and 1 for Alarm status. I just like the look of the round badges for this.
Someone encounter the problem that the sidebar card disappears after changing views as well?
It only comes back if I reload the whole page.
As example normal view with the sidebar card configured changing to the card overview or logbook,
after switching back to the view with sidebar card it is gone.
This was the case with old version, but I donāt have this problem with updated version
Strange 
I installed the newest version delivered by HACS. (0.1.7.5)
I added the resource over the new Lovelace Dashboard Panel (So no YAML)
The code of my sidebar card is this:
sidebar:
digitalClock: true
date: true
dateFormat: DD MMMM YYYY
width:
mobile: 0
tablet: 25
desktop: 20
style: |
:host {
--sidebar-background: #171717;
--sidebar-text-color: #BDC1C6;
--face-color: #312F2F;
--face-border-color: #615E5E;
--clock-hands-color: #0C0808; !important
--clock-seconds-hand-color: #B11F00; !important
--clock-middle-background: #474545; !important
--clock-middle-border: #615E5E; !important
}
.sidebarMenu li.active {
background-color: rgba(35, 39, 41, 0.6)!important;
icon-size: 225px;
}
.digitalClock {
text-align: center;
padding-bottom: 1px;
padding-top: 20px
font-size: 205px;
line-height: 95px;
}
.date {
text-align: center;
}
h1{
text-align: center;
}
Here is a little test Video: https://streamable.com/stredu
Someone maybe know the solution?
I installed a few other resources
Iām using YAML so that might be the reason why itās different.
Maybe but if that is the cause it is a bug.
So probably not bad for reporting 
I think ? ^^
Did you added it in the YAML file of the lovelace dashboard or with the new way in the configuration.yaml ?
Edit: Same bug with YAML.
Sooo I figured it out, not exactly what I wanted to find but still a progess!
I created a new dashboard for the sidebar card (called terminal which is ālovelace-terminalā in URL)
the card shows up after a direct reload of the lovelace-terminal. After I switch the view and going back the sidebar is gone. Now I tried it with the default view created by Home Assistant (Only ālovelaceā in URL), the sidebar card stays there and doesnāt go away by switching view and going back. Just in other dashboards than the default one. I donāt know if it helps but with that I found another bug
If I reload in any other view (Also with sidebar configuration) than the view with the sidebar card of any other view never shows up and stay hidden (Only after a direct reload in the view), so only one Sidebar card at all ?. Maybe there is a problem with when the sidebar card has to load ?
I donāt know much about that and my english is not the best for describing things like that ^^
Iām not a developer and started home assistant 3 weeks ago. I canāt help you, sorry.
Maybe if you shorten the text, show examples with screenshots and/or videos & codes someone else is willing to help. Right now, the overload of your text with no examples and formatting, is not pinpointing to a problem/bug.
good luck
sorry if this is a stupid question but where du you find the unicode icons? i have tried, also do i need to have
hey @DBuit for some reason I can change the font weight of the digital clock but not the font size, but I can change the font weight and size of the date? Any ideas why this might be happening?
Hi @nathbullen
Use this to change font size of the digital clock:
h1.digitalClock {
font-size:20px!important;
}
Hi @berniebl,
The changes for the clock, date and dividing lines can be done with the style option of the sidebar.
I donāt know how your css skills are but let me know if you need some help with this? and let me know what exactly you wanna change 
For the bottom card you can insert any lovelace card in there so if you have that card in a default lovelace view you can place it in there so what you what can be done!
Just released small update with new option twelveHourVersion if you set this to true in your sidebar configuration it will show the digital clock in 12h.
1 Like
Wow thanks for the quick reply @DBuit ! Iāve been struggling with that for a few days haha, Iām still super new to CSS. If you donāt mind answering a couple more questions; is there a way to change the font size of the ātemplateā text (not sure if thatās the right name, the part that says āgood morning/afternoon/eveningā), and is there a way to add dividing lines between different sections of text?
Hi @DBuit. Your work is awesome.
is it possible to make a sidebar bottom card like this one Sidebar from lukevink., with persons(picture-elements) and mini-grapth card.
Thanks
Hi,
For the template test you can use this:
.template li {
font-size:20px!important;
}
But it is not possible to add dividing lines
Hi,
at the moment bottomCard is 1 card so you can make it like his i think.
But only the persons part or only the mini-graph card
Thanks for your reply, my CSS knowledge is pretty weak, I tried āfont-colorā in my code below that that didnāt change anything. My goal is to change all 3, clock, date, and divider bar to this color: #4E88A1
This was my attempt:
.digitalClock {
text-align: center;
padding-bottom: 1px;
padding-top: 20px
font-size: 205px;
font-color: #4E88A1;
line-height: 95px;
}