From afa5fa0451b75b0cfaf9264e08b56f49671e59ae Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C3=ABlle=20Morin?= <morin.gaelle@gmail.com>
Date: Mon, 21 Oct 2019 15:02:12 +0200
Subject: [PATCH] new architecture for member list yeah

---
 src/page-circle-edit.pug                      | 12 +++++++---
 .../layout/circle-profile/circle-edit.scss    | 24 +++++++++++++------
 2 files changed, 26 insertions(+), 10 deletions(-)

diff --git a/src/page-circle-edit.pug b/src/page-circle-edit.pug
index f2d8470..adfa132 100644
--- a/src/page-circle-edit.pug
+++ b/src/page-circle-edit.pug
@@ -11,6 +11,8 @@
         )
         span ${await value.profile.city}
 
+  sib-widget(name='circle-delete-template')
+    template
       sib-delete(
         data-src="${await value['@id']}"
         data-label='Delete from circle'
@@ -37,13 +39,17 @@
   
   h3 List of members
 
-  div.table
+  div.table-header
     div.cell.un Name
     div.cell.deux Status
     
-  sib-display(
+  sib-display.table-body(
     bind-resources
-    fields='team'
+    fields='team, members'
+
     multiple-team=''
+    multiple-members=''
+
     widget-team='circle-team-template'
+    widget-members='circle-delete-template'
   )
diff --git a/src/styles/layout/circle-profile/circle-edit.scss b/src/styles/layout/circle-profile/circle-edit.scss
index 42f6548..599639d 100644
--- a/src/styles/layout/circle-profile/circle-edit.scss
+++ b/src/styles/layout/circle-profile/circle-edit.scss
@@ -1,4 +1,4 @@
-.table {
+.table-header {
   background: $color-228-25-79;
   color: white;
   display: flex;
@@ -19,24 +19,34 @@
   }
 }
 
-circle-team-template {
+.table-body>div {
   display: flex;
   justify-content: space-between;
 
   >* {
     flex: 1;
     width: 50%;
-    padding: 1rem;
-    border-right: 1px solid $color-228-25-79;
-    border-bottom: 1px solid $color-228-25-79;
   }
 
-  >*:nth-child(even) {
+  /*>*:nth-child(even) {
     display: flex;
+  }*/
+
+  /*>*:nth-child(odd) {
+    border-left: 1px solid $color-228-25-79;
+  }*/
+
+  circle-team-template {
+    display: block;
+    border-bottom: 1px solid $color-228-25-79;
+    border-left: 1px solid $color-228-25-79;
   }
 
-  >*:nth-child(odd) {
+  circle-delete-template {
+    display: block;
+    border-bottom: 1px solid $color-228-25-79;
     border-left: 1px solid $color-228-25-79;
+    border-right: 1px solid $color-228-25-79;
   }
 }