From 65c6b77fbc10e916fa6b62e05f15fc9ce34cec99 Mon Sep 17 00:00:00 2001
From: Calum Mackervoy <c.mackervoy@gmail.com>
Date: Thu, 21 Nov 2019 20:45:57 +0100
Subject: [PATCH] feature: admin of a circle displayed
- CSS added
- architecture reworked
- new field 'is-admin' used
- members field used instead of team field.
---
src/page-circle-profile.pug | 6 +-
src/styles/components/_index.scss | 2 +-
src/styles/components/tags.scss | 19 +++
src/styles/components/user-role.scss | 9 --
src/styles/layout/circle/circle-edit.scss | 2 +-
src/styles/layout/circle/circle-profile.scss | 147 +++++++++---------
src/styles/layout/circle/circle.scss | 2 +-
src/styles/layout/job-offers/job-offers.scss | 2 +-
src/styles/layout/members/members.scss | 2 +-
.../project-profile/project-profile.scss | 5 -
src/styles/layout/user/user-profile.scss | 2 +-
src/templates/hd-circle-team.pug | 17 +-
12 files changed, 113 insertions(+), 102 deletions(-)
create mode 100644 src/styles/components/tags.scss
delete mode 100644 src/styles/components/user-role.scss
diff --git a/src/page-circle-profile.pug b/src/page-circle-profile.pug
index 5a7302e8..cd4e3022 100644
--- a/src/page-circle-profile.pug
+++ b/src/page-circle-profile.pug
@@ -25,10 +25,10 @@ sib-router(default-route='circle-profile', hidden)
sib-display.block(
bind-resources
- fields='team'
+ fields='members'
- multiple-team=''
- widget-team='circle-team-template'
+ multiple-members=''
+ widget-members='circle-team-template'
)
div.box-button
diff --git a/src/styles/components/_index.scss b/src/styles/components/_index.scss
index ce38dc6d..eecf780c 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 00000000..6fb27dfc
--- /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 4e2c47e4..00000000
--- 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 a491e700..c1e26833 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 7810d26a..73e2b4e7 100644
--- a/src/styles/layout/circle/circle-profile.scss
+++ b/src/styles/layout/circle/circle-profile.scss
@@ -15,87 +15,84 @@
}
}
- >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='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-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 2d483cf2..160ecae0 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 d8324ab5..172e863c 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 79ffa52b..6ee0e9c0 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 287172f4..51893e18 100644
--- a/src/styles/layout/project-profile/project-profile.scss
+++ b/src/styles/layout/project-profile/project-profile.scss
@@ -117,11 +117,6 @@
@include mdi('atom');
align-items: center;
display: flex;
-
- &::before {
- color: $color-43-100-50;
- margin-right: 0.50rem;
- }
}
}
}
diff --git a/src/styles/layout/user/user-profile.scss b/src/styles/layout/user/user-profile.scss
index 60a05c2c..2192233b 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-circle-team.pug b/src/templates/hd-circle-team.pug
index 7db73b73..fa648152 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='account.picture, sup(user.name, is_admin, user.groups), sub(user.profile.city)'
+
+ class-user.name='user-name'
+ class-is_admin='tag-admin'
+ class-user.groups='tag-group'
+ class-user.profile.city='city'
widget-account.picture='hd-user-avatar'
- widget-groups='hd-user-groups'
+ widget-is_admin='hd-user-admin'
+ widget-user.groups='hd-user-groups'
- multiple-groups=''
+ multiple-user.groups=''
)
+sib-widget(name='hd-user-admin')
+ template ${await value ? "Administrator" : ""}
+
sib-widget(name='hd-user-groups')
template ${await value.name}
--
GitLab