autonomic-cooperative/hubl
0
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feature: notification

Browse Source
This commit is contained in:
gaelle morin 2020-11-23 11:16:30 +01:00
parent 0c96dad77e
commit 313dd7fed8
No known key found for this signature in database
GPG Key ID: 028426702B95CF9C
1 changed files with 26 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/styles/base/header.scss
View File

@ -198,31 +198,44 @@ solid-notifications {
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
-ms-overflow-style: none; -ms-overflow-style: none;
scrollbar-width: thin; scrollbar-width: thin;
scrollbar-color: var(--color-notification-scrollbar-track) var(--color-notification-scrollbar-background); scrollbar-color: #C9C8C8 #F1F1F1;
&::-webkit-scrollbar-track { &::-webkit-scrollbar-track {
background: var(--color-notification-scrollbar-background); background: #F1F1F1;
} }
&::-webkit-scrollbar-thumb { &::-webkit-scrollbar-thumb {
background-color: var(--color-notification-scrollbar-track); background-color: #C9C8C8;
border-radius: 6px; border-radius: 8px;
} }
&::-webkit-scrollbar { &::-webkit-scrollbar {
width: 6px; width: 8px;
} }
/* End of custom scrollbar */ /* End of custom scrollbar */
.solid-notifications__item { .solid-notifications__item {
/*border-bottom: 1px solid var(--color-notification-item-border);*/ border-bottom: none;
&:hover {
background-color: transparent;
& solid-notification__title,
& solid-notification__summary {
color: var(--color-secondary);
}
}
.solid-notification { .solid-notification {
padding: 1.2rem 0 1.5rem; padding: 1.2rem 0 1.5rem;
&[data-read] {
opacity: 0.5;
}
.solid-notification__avatar { .solid-notification__avatar {
align-items: center; align-items: center;
background: var(--color-avatar-background); background: var(--color-grey);
display: flex; display: flex;
height: 35px; height: 35px;
justify-content: center; justify-content: center;
@ -234,7 +247,7 @@ solid-notifications {
width: 35px; width: 35px;
img { img {
background-color: var(--color-grey-10); background-color: var(--color-grey);
height: 100%; height: 100%;
object-fit: cover; object-fit: cover;
object-position: center center; object-position: center center;
@ -257,9 +270,14 @@ solid-notifications {
.solid-notification__title__side { .solid-notification__title__side {
font-weight: normal; font-weight: normal;
>span:first-child {
margin-right: 4px;
}
} }
.solid-notification__title__icon { .solid-notification__title__icon {
display: inline-block;
font-family: simple-line-icons; font-family: simple-line-icons;
} }
} }