move and rename vue HouseholdRenderBox

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/HouseholdRenderBox.vue

@@ -1,5 +1,5 @@
-<template>
-  <div class="chill-entity chill-entity__household">
+<template>A
+  <section class="chill-entity entity-household">
     <!-- identifier -->
     <div v-if="isHouseholdNew()" class="identifier">
       <i class="fa fa-home"></i>
@@ -34,45 +34,36 @@
       <i class="fa fa-where"></i>
       <p class="chill-no-data-statement">{{ $t('no_current_address') }}</p>
     </div>
-  </div>
+  </section>B
 </template>
 
 <style lang="scss">
-.chill-entity__household {
-  display: grid;
-  grid-template-areas:
-    "identifier identifier where"
-    "who        who        where"
-    ;
-  grid-template-columns:
-    auto        auto       30%
-    ;
-
-  .identifier {
-    grid-area: identifier;
-
-    font-size: 1.3em;
-    font-weight: 700;
-    color: var(--chill-blue);
-
-  }
-  .members {
-    grid-area: who;
-
-    .current-members {
-      font-weight: 700;
-    }
-  }
-  .where {
-    grid-area: where
-  }
-
-
+section.chill-entity {
+   &.entity-household {
+      display: grid;
+      grid-template-columns: auto auto 30%;
+      grid-template-areas:
+         "iden iden where"
+         "who  who  where";
+      .identifier {
+         grid-area: iden;
+         font-size: 1.3em;
+         font-weight: 700;
+         color: var(--chill-blue);
+      }
+      .members {
+         grid-area: who;
+         .current-members {
+            font-weight: 700;
+         }
+      }
+      .where {
+         grid-area: where
+      }
+   }
 }
 </style>
 
-
-
 <script>
 
 import Person from 'ChillPersonAssets/vuejs/_components/Person/Person.vue';