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

update: left-menu - ellipsis on large and small screens

Browse Source
This commit is contained in:
gaelle morin 2020-06-03 15:33:10 +02:00
parent ec5326887e
commit 898144fa9a
No known key found for this signature in database
GPG Key ID: 028426702B95CF9C
1 changed files with 22 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/styles/base/menu-left.scss
View File

@ -107,13 +107,20 @@
} }
.project-customer { .project-customer {
width: 150px; width: 100%;
@include breakpoint(lg) {
width: 150px;
}
} }
.project-name { .project-name {
display: block; display: block;
width: calc(150px - 10px); width: 100%;
/* 10px = padding of the sib-set-default = better alignment */
@include breakpoint(lg) {
width: 150px;
}
} }
} }
@ -222,7 +229,10 @@
display: flex; display: flex;
sib-display-div { sib-display-div {
flex: 3; flex: 3;
max-width: 150px;
@include breakpoint(lg) {
max-width: 150px;
}
} }
hubl-counter { hubl-counter {
height: 20px; height: 20px;
@ -243,12 +253,15 @@
} }
sib-display-div { sib-display-div {
max-width: 150px;
>div[name="name"] { @include breakpoint(lg) {
white-space: nowrap; max-width: 150px;
overflow: hidden;
text-overflow: ellipsis; >div[name='name'] {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
} }
} }
} }