update: left-menu and header : ellipsis and alignment

This commit is contained in:
gaelle morin 2020-06-03 17:36:01 +02:00
parent 898144fa9a
commit 9d83093165
No known key found for this signature in database
GPG Key ID: 028426702B95CF9C
3 changed files with 24 additions and 6 deletions

View File

@ -21,6 +21,14 @@ details#user-controls.notLoggedIn
#user-controls__panel #user-controls__panel
nav(role="user's functionalities menu") nav(role="user's functionalities menu")
ul ul
li
sib-display#user-controls__profile(
fields='first_name, account.picture'
class-first_name='flex'
class-account.picture='avatar'
widget-account.picture='hubl-user-avatar'
bind-user
)
if (endpoints.uploads || (endpoints.get && endpoints.get.uploads)) && (endpoints.skills || (endpoints.get && endpoints.get.skills)) && (endpoints.users || (endpoints.get && endpoints.get.users)) if (endpoints.uploads || (endpoints.get && endpoints.get.uploads)) && (endpoints.skills || (endpoints.get && endpoints.get.skills)) && (endpoints.users || (endpoints.get && endpoints.get.users))
li li
sib-link(next='profile') Mon profil sib-link(next='profile') Mon profil

View File

@ -1,6 +1,6 @@
#header { #header {
max-height: 51px; max-height: 50px;
height: 51px; height: 50px;
display: flex; display: flex;
align-items: center; align-items: center;
background-color: var(--color-header-background); background-color: var(--color-header-background);
@ -76,7 +76,11 @@ sib-notifications {
.sib-notifications__button { .sib-notifications__button {
@include icon('bell'); @include icon('bell');
font-size: 3rem; font-size: 2.5rem;
@include breakpoint(lg) {
font-size: 3rem;
}
&::before { &::before {
margin-left: 0; margin-left: 0;
@ -87,9 +91,14 @@ sib-notifications {
} }
.sib-notifications__counter { .sib-notifications__counter {
left: 2.1rem; left: 2rem;
position: absolute; position: absolute;
top: -3px; top: 1px;
@include breakpoint(lg) {
left: 2.1rem;
top: -3px;
}
} }
} }
@ -234,6 +243,7 @@ sib-notifications {
} }
.mobile-menu-icon { .mobile-menu-icon {
display: none; display: none;
@include breakpoint(sm) { @include breakpoint(sm) {

View File

@ -116,7 +116,7 @@
.project-name { .project-name {
display: block; display: block;
width: 100%; width: calc(80vw - 50px);
@include breakpoint(lg) { @include breakpoint(lg) {
width: 150px; width: 150px;