reorganise styles sheets in person/chill/scss

src/Bundle/ChillPersonBundle/Resources/public/chill/scss/flex_table.scss

@@ -1,8 +1,9 @@
 /*
- *  flex-table overwrite: precision and exceptions
+ *  FLEX-TABLE ASSETS OVERRIDE
+ *  precisions, exceptions and specific styles
  */
 
-///
+/// AccompanyingCourse Resume Page
 div.accompanyingcourse-resume {
     div.associated-persons {
         .flex-table .item-row .item-col:first-child {
@@ -11,7 +12,7 @@ div.accompanyingcourse-resume {
     }
 }
 
-///
+/// AccompanyingPeriod list
 div.accompanyingcourse-list, div.household-members {
     .flex-table .item-bloc .item-row {
         &:nth-child(2) {
@@ -23,9 +24,76 @@ div.accompanyingcourse-list, div.household-members {
     }
 }
 
-///
+/// Search Page (list_with_period.html.twig)
 div.list-with-period {
+
+    /// override flex-table
     div.flex-table div.item-row div.item-col:first-child {
         flex-basis: 33%;
     }
+
+    // override wrap-list
+    div.wrap-list.periods-list {
+        div.wl-row {
+            flex-wrap: nowrap;
+            div.wl-col {
+                &.title {
+                    width: 34%;
+                    @include media-breakpoint-up(md) {
+                        margin-left: 0;
+                    }
+                }
+                &.list {
+                    display: flex;
+                    flex-wrap: wrap; //
+                    margin: unset;
+                }
+            }
+            @include media-breakpoint-down(sm) {
+                flex-wrap: wrap;
+                div.wl-col {
+                    &.title, &.list {
+                        width: 100%;
+                    }
+                    &.title {
+                        text-align: left;
+                        div {
+                            display: inline-block;
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    div.periods-list {
+        div.title {
+            text-align: right;
+            div.date {}
+            div.user {}
+        }
+        div.list {
+            span.more {
+                font-style: italic;
+            }
+        }
+    }
+}
+
+
+/// TODO
+
+/// dans householdmembereditor/Concerned.vue
+div.positions {
+    div.list-household-members {
+        div.participation-details {}
+    }
+}
+
+/// dans householdmembereditor/Concerned.vue et dans household/summary
+div.list-household-members {
+    div.move_to {
+        p.move_hint {}
+    }
+    div.comment {}
 }