visual changes when option 'create household' is checked in user create form

src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/ShowPane.vue

@@ -16,17 +16,16 @@
       </div>
 
       <div v-if="showMessageWhenNoAddress" class="mt-5">
+         <div class="no-address-yet col-sm-8">
+            <i class="fa fa-home" aria-hidden="true"></i>
             <p class="chill-no-data-statement">
                {{ $t('not_yet_address') }}
             </p>
-      </div>
-
-      <address-render-box :address="address" :useDatePane="useDatePane"></address-render-box>
-   </div>
 
             <action-buttons
                :options="this.options"
-      :defaultz="this.defaultz">
+               :defaultz="this.defaultz"
+               class="add-address-btn">
                <template v-slot:action>
                   <button @click.prevent="$emit('openEditPane')"
                      class="btn" :class="getClassButton"
@@ -35,6 +34,11 @@
                   </button>
                </template>
             </action-buttons>
+         </div>
+      </div>
+
+      <address-render-box :address="address" :useDatePane="useDatePane"></address-render-box>
+   </div>
 
 </template>
 
@@ -101,3 +105,19 @@ export default {
    }
 };
 </script>
+
+<style lang="scss">
+.no-address-yet {
+   text-align: center;
+   box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
+   padding:1.5rem;
+   margin-left: auto;
+   i {
+      font-size:2rem;
+      margin-bottom:2rem;
+   }
+   .add-address-btn {
+      display: block
+   }
+}
+</style>