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

feature: ellipsis - refactoring

This commit is contained in:
gaelle morin 2020-12-18 18:29:54 +01:00
parent d34a0dceba
commit d772bbb8d7
No known key found for this signature in database
GPG Key ID: 028426702B95CF9C
2 changed files with 42 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/styles/left-nav/_index.scss
View File

@ -30,6 +30,7 @@ nav {
margin-right: 3px; margin-right: 3px;
opacity: 0.8; opacity: 0.8;
vertical-align: top; vertical-align: top;
width: 12px;
div { div {
font-family: simple-line-icons; font-family: simple-line-icons;
@ -37,19 +38,39 @@ nav {
} }
} }
.sub-menu-name {
margin-right: 14px; /* Ellipsis */
.ellipsis {
hubl-menu-fix-url-circle,
hubl-menu-fix-url-project {
display: block;
}
.ellipsis-content,
.ellipsis-content>div {
@media(min-width: 1024px) {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
} }
.sub-menu-name {
margin-right: 15px;
}
/* Ellipsis for project tab */ /* Ellipsis for project tab */
.circle-tab,
.project-tab { .project-tab {
hubl-menu-fix-url-project {
display: block;
}
.project-customer, .project-customer,
.project-name { .project-name {
@ -57,7 +78,7 @@ nav {
width: calc(80vw - 96px); width: calc(80vw - 96px);
@media(min-width: 1024px) { @media(min-width: 1024px) {
width: calc(100% - 10px); width: 100%;
} }
} }

23
src/views/partials/menu-left.pug
View File

@ -49,10 +49,17 @@ solid-widget(name='hubl-menu-fix-url-circle')
solid-link.segment.lg-full(data-src="${value}" next="circle") solid-link.segment.lg-full(data-src="${value}" next="circle")
solid-display( solid-display(
data-src='${value}' data-src='${value}'
fields='status, name, jabberID, badge' fields='segment(status, circle(name, jabberID), badge)'
class-status='sub-menu-icon' class-segment="segment lg-full padding-top-xxsmall padding-right-small padding-left-medium"
class-name='sub-menu-name ellipsis'
class-badge='sub-menu-badge' class-status='segment sub-menu-icon'
class-circle='segment lg-three-quarter sub-menu-name'
class-name='segment ellipsis-content'
class-badge='segment badge'
value-badge='${value}' value-badge='${value}'
widget-status='hubl-menu-publicprivate' widget-status='hubl-menu-publicprivate'
widget-badge='hubl-counter' widget-badge='hubl-counter'
@ -73,8 +80,8 @@ solid-widget(name='hubl-menu-fix-url-project')
class-project='segment lg-three-quarter sub-menu-name' class-project='segment lg-three-quarter sub-menu-name'
class-customer.name='segment project-customer' class-customer.name='segment ellipsis-content'
class-name='segment project-name' class-name='segment ellipsis-content'
class-badge='segment badge text-top' class-badge='segment badge text-top'
@ -141,7 +148,7 @@ solid-router#navbar-router(default-route='dashboard')
div div
div div
div div
solid-display.project-tab.text-color-white( solid-display.ellipsis.text-color-white(
bind-user bind-user
nested-field='projects' nested-field='projects'
fields='project' fields='project'
@ -170,7 +177,7 @@ solid-router#navbar-router(default-route='dashboard')
div div
div div
div div
solid-display.circle-tab.segment.lg-full( solid-display.ellipsis.text-color-white(
bind-user bind-user
nested-field='circles' nested-field='circles'
fields='circle' fields='circle'