feature: left-menu: messages

This commit is contained in:
gaelle morin
2020-11-20 11:43:45 +01:00
parent a6224df002
commit 6e16261008
3 changed files with 45 additions and 23 deletions

View File

@ -66,6 +66,9 @@
&.margin-left {
margin-left: 20px;
}
&.margin-left-small {
margin-left: 15px;
}
&.margin-right-small {
margin-right: 15px;
}

View File

@ -43,7 +43,6 @@
.menu {
cursor: pointer;
border-bottom: 1px solid #4F5E72;
display: flex;
align-items: center;
/*flex-direction: row-reverse;*/
@ -53,15 +52,18 @@
&[active] {
background-color: var(--color-third);
color: var(--color-heading);
border-bottom: none;
.menu-icon:before {
background-color: var(--color-heading);
color: white;
}
.menu-notification>solid-display>div:first-child {
/*.menu-notification>solid-display>div:first-child {
background-color: var(--color-menu-badge-background);
}*/
&+.divider {
display: none;
}
}
@ -164,6 +166,15 @@
}
/* Ellipsis for message tab */
.message-tab>div {
width: 100%;
&>solid-display {
display: block;
margin-top: 15px;
margin-left: 15px;
}
}
.message-tab>div>solid-display>div>solid-display-div>div {
box-sizing: border-box;
@ -179,15 +190,16 @@
margin-bottom: 10px;
width: calc(80vw - 71px);
display: block;
background-color: var(--color-secondary);
color: var(--color-white);
border: 1px solid var(--color-grey-4);
background-color: var(--color-heading);
color: white;
border: 1px solid white;
border-radius: 3px;
padding: 4px;
padding-left: 9.5px;
height: 27px;
opacity: 0.8;
@include breakpoint(lg) {
margin: auto;
margin-bottom: 10px;
width: auto;
}
}
@ -228,15 +240,15 @@
}
}
>solid-display.nosub>div>solid-display>div {
/*>solid-display.nosub>div>solid-display>div {
padding: 1rem 1rem 1rem 3rem;
}
}*/
solid-display>div {
.create {
color: var(--color-white);
margin: 1rem 1rem 2.2rem 3.2rem;
/*color: white;*/
/*margin: 1rem 1rem 2.2rem 3.2rem;*/
}
&>solid-display {
@ -262,8 +274,8 @@
&>solid-display[active]>div,
&>solid-display>div>hubl-menu-fix-url-circle>solid-link>solid-display[active]>div,
&>solid-display>div>hubl-menu-fix-url-project>solid-link>solid-display[active]>div {
background-color: var(--color-menu-highlight-primary);
color: var(--color-menu-text-active);
background-color: var(--color-third);
color: var(--color-heading);
font-weight: bold;
}
}
@ -283,21 +295,21 @@
}
hubl-counter {
height: 20px;
width: 20px;
/*height: 20px;
width: 20px;*/
margin-right: 1em;
div.counter:not([data-nb-unread="0"]) {
text-align: center;
display: block;
background-color: var(--sib-notifications-theme, gray);
background-color: var(--color-third, gray);
border-radius: 50%;
font-size: 12px;
line-height: 20px;
width: 20px;
height: 20px;
padding-bottom: 0;
color: var(--color-secondary);
color: var(--color-heading);
}
}
}
@ -305,7 +317,8 @@
.divider {
height: 1px;
background-color: #4F5E72;
background-color: #D7DBE0;
opacity: 0.2;
}
}
}