diff --git a/src/menu-left.pug b/src/menu-left.pug
index 26a72fb38b3cb6e3716b8b8ce3f4426a321f0188..ce611052e54d77bb02ee340e2d50673f33f8278b 100644
--- a/src/menu-left.pug
+++ b/src/menu-left.pug
@@ -28,10 +28,12 @@ nav#main__menu
div.menu-icon.icon-folder-alt
sib-route(name='project', rdf-type='hd:project', use-id='', hidden)
div.sub-menu.menu-notification
- sib-display(
+ sib-display.project-tab(
bind-user
nested-field='projects'
fields='line(project.customer.name, dash, project.name), project'
+ class-project.customer.name='project-customer'
+ class-project.name='project-name'
empty-widget='hd-create'
empty-value='project'
value-dash=' - '
diff --git a/src/page-project-profile.pug b/src/page-project-profile.pug
index f8b72ff27baae4a7563550cada298aa219468474..aefb717d932d0e069d5b476c71b60acd342068e5 100644
--- a/src/page-project-profile.pug
+++ b/src/page-project-profile.pug
@@ -7,6 +7,7 @@ sib-router(default-route='project-profile', hidden)
include templates/hd-captain.pug
include templates/hd-circle-team.pug
include templates/hd-customer.pug
+ include templates/hd-project-team.pug
.content-box__info
@@ -65,10 +66,10 @@ sib-router(default-route='project-profile', hidden)
sib-display(
bind-resources
- fields='team'
+ fields='members'
- widget-team='circle-team-template'
- multiple-team
+ widget-members='hd-project-team'
+ multiple-members
)
sib-widget(name='project-leave-button')
diff --git a/src/styles/base/menu-left.scss b/src/styles/base/menu-left.scss
index 2ab72732d89ed955aa9bf272db1a62a054c31d98..606db3c3c50eee488aa8abe139651f9ae624221f 100644
--- a/src/styles/base/menu-left.scss
+++ b/src/styles/base/menu-left.scss
@@ -113,8 +113,12 @@
width: calc(150px - 10px);
/* 10px = padding of the sib-set-default = better alignment */
}
+ }
+
+ .project-tab>div>sib-display[fields='project(customer.name, name), badge']>div:hover {
+ background-color: $color-233-20-17;
- &:hover {
+ sib-set-default[name='project'] {
background-color: $color-233-20-17;
box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.26);
color: $color-218-100-98;
@@ -126,6 +130,10 @@
.project-name {
width: auto;
}
+
+ .project-name {
+ font-weight: normal;
+ }
}
}
diff --git a/src/styles/components/_index.scss b/src/styles/components/_index.scss
index ce38dc6dc5c0fcaf487ad75015cbe4af9a2bdd27..eecf780c4384c4ac8265ced29bd7325d065b6a90 100644
--- a/src/styles/components/_index.scss
+++ b/src/styles/components/_index.scss
@@ -4,4 +4,4 @@
@import 'howto';
@import 'sidebar';
@import 'skills';
-@import 'user-role';
\ No newline at end of file
+@import 'tags';
\ No newline at end of file
diff --git a/src/styles/components/tags.scss b/src/styles/components/tags.scss
new file mode 100644
index 0000000000000000000000000000000000000000..6fb27dfca732fd1b373c00873e935e5010747fd1
--- /dev/null
+++ b/src/styles/components/tags.scss
@@ -0,0 +1,19 @@
+%tag-role {
+ border: 1px solid $color-45-95-54;
+ border-radius: 3px;
+ color: $color-210-4-50;
+ font-size: 1.4rem;
+ font-weight: 400;
+ margin-right: 0.6rem;
+ padding: 0.2rem 0.98rem;
+}
+
+%tag-admin {
+ border: 1px solid $color-244-73-62;
+ border-radius: 3px;
+ color: $color-244-73-62;
+ font-size: 1.4rem;
+ font-weight: 400;
+ margin-left: 0.6rem;
+ padding: 0.3rem 0.98rem;
+}
\ No newline at end of file
diff --git a/src/styles/components/user-role.scss b/src/styles/components/user-role.scss
deleted file mode 100644
index 4e2c47e4a0e94ca143032f6470a97c755db2316e..0000000000000000000000000000000000000000
--- a/src/styles/components/user-role.scss
+++ /dev/null
@@ -1,9 +0,0 @@
-%user-role {
- border: 1px solid $color-45-95-54;
- border-radius: 3px;
- color: $color-210-4-50;
- font-size: 1.4rem;
- font-weight: 400;
- margin-right: 0.4rem;
- padding: 0.2rem 0.98rem;
- }
\ No newline at end of file
diff --git a/src/styles/layout/circle/circle-edit.scss b/src/styles/layout/circle/circle-edit.scss
index a491e70015cfa8d5f2e97b9df45049bb8860fb4f..c1e26833e7953d0baa4590e353559d6f25d3167f 100644
--- a/src/styles/layout/circle/circle-edit.scss
+++ b/src/styles/layout/circle/circle-edit.scss
@@ -133,7 +133,7 @@
display: flex;
[name='groups'] {
- @extend %user-role;
+ @extend %tag-role;
}
}
}
diff --git a/src/styles/layout/circle/circle-profile.scss b/src/styles/layout/circle/circle-profile.scss
index 7810d26a129f58bbcd47d4c8c11f0db4daac704d..96e50e5f2525141afc0e6504682015391549cf04 100644
--- a/src/styles/layout/circle/circle-profile.scss
+++ b/src/styles/layout/circle/circle-profile.scss
@@ -15,87 +15,85 @@
}
}
- >div { /* peut-être à mettre dans main.scss */
-
- >sib-multiple {
+ /* peut-être à mettre dans main.scss */
+
+ circle-team-template>sib-display>div {
+ display: grid;
+ grid-column-gap: 1.6rem;
+ grid-template-columns: 7vh auto;
+ grid-template-rows: repeat(2, 5.2vh);
+
+ >[name='user.account.picture'] {
+ align-items: center;
+ align-self: center;
+ background-color: $color-213-20-91;
+ border-radius: 50%;
+ display: flex;
+ grid-column: 1 / span 1;
+ grid-row: 1 / span 2;
+ height: 7vh;
+ justify-content: center;
+ overflow: hidden;
+ position: relative;
+ width: 7vh;
+
+ img {
+ background-color: white;
+ height: 100%;
+ left: 0;
+ object-fit: cover;
+ position: absolute;
+ top: 0;
+ width: 100%;
+ }
- label {
- display: none;
+ object {
+ height: 45%;
+ width: 45%;
}
+ }
- >div>circle-team-template[name='team']>sib-display>div {
- display: grid;
- grid-column-gap: 1.6rem;
- grid-template-columns: 7vh auto;
- grid-template-rows: repeat(2, 5.2vh);
-
- >[name='account.picture'] {
- align-items: center;
- align-self: center;
- background-color: $color-213-20-91;
- border-radius: 50%;
- display: flex;
- grid-column: 1 / span 1;
- grid-row: 1 / span 2;
- height: 7vh;
- justify-content: center;
- overflow: hidden;
- position: relative;
- width: 7vh;
-
- img {
- background-color: white;
- height: 100%;
- left: 0;
- object-fit: cover;
- position: absolute;
- top: 0;
- width: 100%;
- }
-
- object {
- height: 45%;
- width: 45%;
- }
- }
+ >[name='sup'] {
+ align-items: center;
+ align-self: end;
+ display: flex;
+ grid-column: 2 / span 1;
+ grid-row: 1 / span 1;
+ margin-bottom: 0.50rem;
+
+ .user-name {
+ font-weight: 600;
+ }
+
+ .tag-group {
+ display: flex;
+ margin-bottom: 1px;
+ margin-left: 0.6rem;
- >[name='sup'] {
- align-self: end;
- display: flex;
- grid-column: 2 / span 1;
- grid-row: 1 / span 1;
- margin-bottom: 0.50rem;
-
- [name='name'] {
- font-weight: 600;
- }
-
- sib-multiple {
- display: flex;
- margin-left: 1rem;
-
- [name='groups'] {
- @extend %user-role;
- }
- }
+ [name='user.groups'] {
+ @extend %tag-role;
}
+ }
+
+ .tag-admin:not(:empty) {
+ @extend %tag-admin;
+ }
+ }
+
+ >[name='sub'] {
+ align-self: start;
+ grid-column: 2 / span 1;
+ grid-row: 2 / span 1;
+ margin-top: 0.50rem;
+
+ >.city:not(:empty) {
+ @include mdi('atom');
+ align-items: center;
+ display: flex;
- >[name='sub'] {
- align-self: start;
- grid-column: 2 / span 1;
- grid-row: 2 / span 1;
- margin-top: 0.50rem;
-
- >[name$='profile.city']:not(:empty) {
- @include mdi('atom');
- align-items: center;
- display: flex;
-
- &::before {
- color: $color-43-100-50;
- margin-right: 0.50rem;
- }
- }
+ &::before {
+ color: $color-43-100-50;
+ margin-right: 0.50rem;
}
}
}
diff --git a/src/styles/layout/circle/circle.scss b/src/styles/layout/circle/circle.scss
index 2d483cf23c56fed5b5fd8d141f8e3247f5a94b46..160ecae070c138b00e8074ea1544ef0656296fc8 100644
--- a/src/styles/layout/circle/circle.scss
+++ b/src/styles/layout/circle/circle.scss
@@ -135,7 +135,7 @@
display: flex;
[name='groups'] {
- @extend %user-role;
+ @extend %tag-role;
}
}
}
diff --git a/src/styles/layout/job-offers/job-offers.scss b/src/styles/layout/job-offers/job-offers.scss
index d8324ab5dd4586d5fafd3a88d7cdb6f9016c86af..172e863c38957cfa9fc2d27ce52f13d869763c79 100644
--- a/src/styles/layout/job-offers/job-offers.scss
+++ b/src/styles/layout/job-offers/job-offers.scss
@@ -88,7 +88,7 @@ sib-job-board {
}
>* {
- @extend %user-role;
+ @extend %tag-role;
}
}
diff --git a/src/styles/layout/members/members.scss b/src/styles/layout/members/members.scss
index 79ffa52b516fdf07b342fe90b559deb11c64f522..6ee0e9c0951baf2af0e99f788c844951050757c7 100644
--- a/src/styles/layout/members/members.scss
+++ b/src/styles/layout/members/members.scss
@@ -32,7 +32,7 @@
}
member-info-groups {
- @extend %user-role;
+ @extend %tag-role;
}
#members-list {
diff --git a/src/styles/layout/project-profile/project-profile.scss b/src/styles/layout/project-profile/project-profile.scss
index 287172f40902a20b9c05200f706a2d7ad4b41258..b2c594e285aa7fb419b5138bcef3120c3394cd41 100644
--- a/src/styles/layout/project-profile/project-profile.scss
+++ b/src/styles/layout/project-profile/project-profile.scss
@@ -50,7 +50,7 @@
}
hd-captain>sib-display>div,
- circle-team-template>sib-display>div { /* Maybe move it in main.scss. /!\ some fields are different */
+ hd-project-team>sib-display>div { /* Maybe move it in main.scss. /!\ some fields are different */
display: grid;
grid-column-gap: 1.6rem;
grid-template-columns: 7vh auto;
@@ -93,7 +93,7 @@
grid-row: 1 / span 1;
margin-bottom: 0.50rem;
- [name='name'] {
+ .user-name {
font-weight: 600;
}
@@ -101,8 +101,9 @@
display: flex;
margin-left: 1rem;
- [name='groups'] {
- @extend %user-role;
+ [name='groups'],
+ [name='user.groups'] {
+ @extend %tag-role;
}
}
}
@@ -117,12 +118,28 @@
@include mdi('atom');
align-items: center;
display: flex;
+ margin-right: 1.6rem;
&::before {
color: $color-43-100-50;
margin-right: 0.50rem;
}
}
+
+ >[name$='name']:not(:empty),
+ >[name='is_lead'] {
+ @include icon('eyeglass');
+ align-items: center;
+ display: flex;
+
+ &::before {
+ color: $color-43-100-50;
+ font-size: 1.9rem;
+ font-weight: bold;
+ margin-left: 0;
+ margin-right: 0.50rem;
+ }
+ }
}
}
diff --git a/src/styles/layout/user/user-profile.scss b/src/styles/layout/user/user-profile.scss
index 60a05c2c8f4475e027284ef19338993725168b78..2192233b2edd9d83264c0d227073c291b0db48df 100644
--- a/src/styles/layout/user/user-profile.scss
+++ b/src/styles/layout/user/user-profile.scss
@@ -35,7 +35,7 @@
padding-left: 1.4rem;
groups-name {
- @extend %user-role;
+ @extend %tag-role;
}
}
}
diff --git a/src/templates/hd-captain.pug b/src/templates/hd-captain.pug
index f16a51ab10f6f7ecf7ea9a8c70fa2ac91e6ac727..7119ea21f240060245b68c066f7ab02bffbc67b4 100644
--- a/src/templates/hd-captain.pug
+++ b/src/templates/hd-captain.pug
@@ -4,8 +4,14 @@ sib-widget(name='hd-captain')
template
sib-display(
data-src="${await value}"
- fields='account.picture, sup(name), sub(profile.city)'
+ fields='account.picture, sup(name), sub(profile.city, is_lead)'
+
+ class-name='user-name'
+ class-profile.city='city'
widget-account.picture='hd-user-avatar'
+ widget-is_lead='hd-user-lead'
)
+sib-widget(name='hd-user-lead')
+ template Project lead
diff --git a/src/templates/hd-circle-team.pug b/src/templates/hd-circle-team.pug
index 7db73b7319f323a061b06ce651bfa5f490ebd9e9..ff90ce09f972b44e9b5730a458376038cfe582ee 100644
--- a/src/templates/hd-circle-team.pug
+++ b/src/templates/hd-circle-team.pug
@@ -3,14 +3,23 @@ include hd-user-avatar.pug
sib-widget(name='circle-team-template')
template
sib-display(
- data-src="${await value}"
- fields='account.picture, sup(name, groups), sub(profile.city)'
+ data-src='${await value}'
+ fields='user.account.picture, sup(user.name, is_admin, user.groups), sub(user.profile.city)'
- widget-account.picture='hd-user-avatar'
- widget-groups='hd-user-groups'
+ class-user.name='user-name'
+ class-is_admin='tag-admin'
+ class-user.groups='tag-group'
+ class-user.profile.city='city'
- multiple-groups=''
+ widget-user.account.picture='hd-user-avatar'
+ widget-is_admin='hd-user-admin'
+ widget-user.groups='hd-user-groups'
+
+ multiple-user.groups=''
)
+sib-widget(name='hd-user-admin')
+ template ${await value ? "Administrator" : ""}
+
sib-widget(name='hd-user-groups')
template ${await value.name}
diff --git a/src/templates/hd-project-team.pug b/src/templates/hd-project-team.pug
new file mode 100644
index 0000000000000000000000000000000000000000..639e2ff7476255e33d0d34f6f7be971a68dc6147
--- /dev/null
+++ b/src/templates/hd-project-team.pug
@@ -0,0 +1,20 @@
+include hd-user-avatar.pug
+
+sib-widget(name='hd-project-team')
+ template
+ sib-display(
+ data-src='${await value}'
+ fields='account.picture, sup(user.name, user.groups), sub(user.profile.city, name)'
+
+ class-user.name='user-name'
+ class-user.groups='tag-group'
+ class-user.profile.city='city'
+
+ widget-account.picture='hd-user-avatar'
+ widget-user.groups='hd-user-groups'
+
+ multiple-user.groups=''
+ )
+
+sib-widget(name='hd-user-groups')
+ template ${await value.name}