From f8c62adfe96a93e8dc2d3fea2f029142697e28ee Mon Sep 17 00:00:00 2001
From: Jean-Baptiste Pasquier <contact@jbpasquier.eu>
Date: Wed, 5 Jun 2019 10:50:33 +0200
Subject: [PATCH] feature: sib-badge for users messages
---
src/menu-left.pug | 23 ++++++++++++++---------
src/styles/base/menu-left.scss | 28 +++++++++++++++++++++++++++-
2 files changed, 41 insertions(+), 10 deletions(-)
diff --git a/src/menu-left.pug b/src/menu-left.pug
index c5a82092..104aadac 100644
--- a/src/menu-left.pug
+++ b/src/menu-left.pug
@@ -1,3 +1,6 @@
+sib-widget(name='hd-counter')
+ template
+ sib-badge(data-src="${id}")
nav#main__menu
sib-router#navbar-router(default-route='members')
sib-route.menu(name='members')
@@ -16,12 +19,12 @@ nav#main__menu
div.menu-label Projects
div.menu-icon.icon-folder-alt
sib-route(hidden,name='project', id-prefix=`${sdn}/projects/`, rdf-type='hd:project', use-id='')
- div.sub-menu
+ div.sub-menu.menu-notification
sib-display(
- data-src=`${sdn}/sources/projects/`,
- data-fields='project',
- set-project='customer.name, dash, name',
- value-dash=' - ',
+ data-src=`${sdn}/sources/projects/`
+ data-fields='project'
+ set-project='customer.name, dash, name'
+ value-dash=' - '
next='project'
)
//- div.divider
@@ -47,12 +50,14 @@ nav#main__menu
div.menu-label Chat
div.menu-icon.icon-envelope-letter
sib-route(hidden, name='messages', id-prefix=`${sdn}/users/`, rdf-type='foaf:user', use-id='')
- div.sub-menu
+ div.sub-menu.menu-notification
sib-display(
- data-src=`${sdn}/users/`,
- data-fields='username',
- widget-user.username='sib-display-div',
+ data-src=`${sdn}/users/`
+ data-fields='username, account.user'
+ widget-username='sib-display-div'
+ widget-account.user='hd-counter'
next='messages'
)
+
div.divider
diff --git a/src/styles/base/menu-left.scss b/src/styles/base/menu-left.scss
index 4f10076e..f28dd2ab 100644
--- a/src/styles/base/menu-left.scss
+++ b/src/styles/base/menu-left.scss
@@ -109,7 +109,33 @@
}
}
}
- }
+
+ &.menu-notification {
+ > sib-display > div > sib-display > div {
+ display: flex;
+ sib-display-div {
+ flex: 3;
+ }
+ hd-counter {
+ height: 20px;
+ width: 20px;
+ margin-right: 1em;
+ div:not(:empty) {
+ text-align: center;
+ display: block;
+ background-color: var(--sib-notifications-theme, gray);
+ border-radius: 50%;
+ font-size: 12px;
+ line-height: 20px;
+ width: 20px;
+ height: 20px;
+ padding-bottom: 0;
+ color: $color-216-4-22;
+ }
+ }
+ }
+ }
+ }
.divider {
height: 1px;
--
GitLab