jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-08-08 00:47:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix notification badge and user avatar circle

Browse Source
This commit is contained in:
Donnie 2020-11-02 09:11:49 -08:00
parent f24b1ea844
commit 12aab855d7
1 changed files with 9 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/ha-sidebar.ts
View File

@ -486,7 +486,7 @@ class HaSidebar extends LitElement {
<ha-svg-icon slot="graphic" .path=${mdiBell}></ha-svg-icon> <ha-svg-icon slot="graphic" .path=${mdiBell}></ha-svg-icon>
${!this.expanded && notificationCount > 0 ${!this.expanded && notificationCount > 0
? html` ? html`
<span slot="graphic" class="notification-badge"> <span class="notification-badge">
${notificationCount} ${notificationCount}
</span> </span>
` `
@ -1064,6 +1064,9 @@ class HaSidebar extends LitElement {
} }
.profile { .profile {
margin-left: env(safe-area-inset-left); margin-left: env(safe-area-inset-left);
--mdc-list-item-graphic-size: 40px;
--mdc-list-item-graphic-margin: 15px;
--mdc-list-side-padding: 9px;
} }
:host([rtl]) .profile { :host([rtl]) .profile {
margin-left: initial; margin-left: initial;
@ -1089,17 +1092,17 @@ class HaSidebar extends LitElement {
border-radius: 50%; border-radius: 50%;
font-weight: 400; font-weight: 400;
background-color: var(--accent-color); background-color: var(--accent-color);
line-height: 30px; line-height: 1.5rem;
text-align: center; text-align: center;
padding: 0px 4px; padding: 2px 6px;
color: var(--text-accent-color, var(--text-primary-color)); color: var(--text-accent-color, var(--text-primary-color));
font-size: 14px; font-size: 14px;
} }
ha-svg-icon + .notification-badge { ha-svg-icon + .notification-badge {
position: absolute; position: absolute;
bottom: 14px; bottom: 18px;
left: 26px; left: 30px;
font-size: 0.65em; padding: 0px 0px;
} }
.spacer { .spacer {