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

update: better look of user panel on mobile

This commit is contained in:
gaelle morin 2020-06-09 12:10:13 +02:00
parent 57d775fa01
commit eaa7478196
No known key found for this signature in database
GPG Key ID: 028426702B95CF9C
1 changed files with 25 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -127,9 +127,13 @@ sib-notifications {
} }
&:focus { &:focus {
background-color: var(--color-user-panel-header-background-open); background-color: transparent;
color: var(--color-user-panel-header-text-open); color: var(--color-user-panel-header-text-open);
outline: none; outline: none;
@include breakpoint(lg) {
background-color: var(--color-user-panel-header-background-open);
}
} }
} }
@ -143,14 +147,14 @@ sib-notifications {
} }
hubl-user-avatar { hubl-user-avatar {
height: 4.8rem; height: 3.3rem;
margin-right: 2rem; margin-right: 0;
width: 4.8rem; width: 3.3rem;
@include breakpoint(sm) { @include breakpoint(lg) {
height: 3.3rem; height: 4.8rem;
margin-right: 0; margin-right: 2rem;
width: 3.3rem; width: 4.8rem;
} }
} }
@ -178,8 +182,14 @@ sib-notifications {
position: absolute; position: absolute;
right: 0; right: 0;
z-index: 1; z-index: 1;
width: 100%; /* Quick fix for mobile version */
top: 83px; width: 215px;
top: 42px;
@include breakpoint (lg) {
width: 100%;
top: 83px;
}
> nav { > nav {
background-color: var(--color-user-panel-list-background); background-color: var(--color-user-panel-list-background);
@ -245,12 +255,12 @@ sib-notifications {
.mobile-menu-icon { .mobile-menu-icon {
display: none; display: block;
padding-left: 0;
font-size: 24px;
@include breakpoint(sm) { @include breakpoint(lg) {
display: block; display: none;
padding-left: 0;
font-size: 24px;
} }
} }