test purge css for netlify

components/badge/Status.vue

 <template>
     <small>
         <span class="badge"
-          :class="'badge-'+ this.displayStatus(membre).class">
+          :class="this.displayStatus(membre).class">
             {{ this.displayStatus(membre).str }}
         </span>
     </small>
@@ -20,17 +20,17 @@ export default {
             console.log(member.limitDate)
             switch (member.status) {
                 case 'NEWCOMER':
-                    return {str: 'Futur membre',class: 'info'}
+                    return {str: 'Futur membre',class: 'badge-info'}
                 case 'MISSING':
-                    return {str: 'Adhésion perdue',class: 'danger'}
+                    return {str: 'Adhésion perdue',class: 'badge-danger'}
                 case 'MEMBER':
                     if (this.$options.filters.dateStatus(member.limitDate) == 'warning') {
-                        return {str: 'Adhésion à renouveler',class: 'warning'}
+                        return {str: 'Adhésion à renouveler',class: 'badge-warning'}
                     } else {
-                        return {str: 'Membre',class: 'success'}
+                        return {str: 'Membre',class: 'badge-success'}
                     }
                 case 'REVOKED':
-                    return {str: 'Membre revoqué',class: 'secondary'}
+                    return {str: 'Membre revoqué',class: 'badge-secondary'}
                 default:
                     return 'N/A'
             }

pages/index.vue

@@ -4,11 +4,7 @@
   <div class="row">
     <div class="col-6 m-auto text-center">
       <button class="btn btn-primary mb-3" @click="helloWorld($event)" data-response="Hello world !">Hello ?</button>
-      <p class="badge-warning text-warning">{{ hello }}</p>
-      <p class="badge-danger text-danger">{{ hello }}</p>
-      <p class="badge-secondary text-secondary">{{ hello }}</p>
-      <p class="badge-success text-success">{{ hello }}</p>
-      <p class="badge-info text-info">{{ hello }}</p>
+      <p>{{ hello }}</p>
     </div>
   </div>
 </main>