Fix collaborateurs, reprise des BU suite à la reco.

src/app/components/businessunit/businessunit.component.html

@@ -1,36 +1,46 @@
 <div xmlns="">
   <h2 class = mb-4>Business Unit</h2>
 
-  <table class = mb-5>
+  <div style="overflow-x:auto;" class="mb-5 col-12">
+    <table class="table">
+      <thead>
         <tr>
-      <th class="spaced">Name</th>
+          <th scope="col">ID</th>
+          <th scope="col">Nom</th>
         </tr>
+      </thead>
+      <tbody>
         <tr *ngFor="let businessunit of businessunits">
-      <td class="spaced"> {{businessunit.name}} </td>
-      <td class="spaced"> <a routerLink="{{businessunit.id}}"> Modifier </a></td>
+          <th scope="row">{{businessunit.id}}</th>
+          <td> {{businessunit.name}} </td>
+          <td> <a routerLink="{{businessunit.id}}"> Modifier </a></td>
         </tr>
+      </tbody>
     </table>
+  </div>
+  <h3>Ajouter une Business Unit : </h3>
 
-  <h3>Ajouter une businessunit : </h3>
+  <div class="row mb-4">
 
-  <div class = mb-3>
-    <table>
-      <tr>
-        <th>Name</th>
-      </tr>
-      <tr>
-        <td>
-          <input id="businessunit-name" [(ngModel)]="businessunit.name" placeholder="name">
-        </td>
-      </tr>
-    </table>
+    <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
+      <label for="businessunit-name" class="form-label">Nom</label>
+      <input class="form-control" id="businessunit-name" [(ngModel)]="businessunit.name" placeholder="Nom">
+    </div>
+
+  </div>
 
-    <select name="agence" id="agence-select" [(ngModel)]="businessunit.agenceId">
-      <option value="">-- Choisissez l'agence de cette business Unit --</option>
+  <div class="row mb-5">
+
+    <div class="form-group col-12 col-md-6">
+      <label class="form-label">Agence</label>
+      <select class="form-select" name="agence" id="agence-select" [(ngModel)]="businessunit.agenceId">
+        <option value="" disabled selected>Choisissez l'agence de cette business Unit</option>
         <option *ngFor="let agence of agences" [ngValue]="agence.id">{{agence.name}}</option>
       </select>
     </div>
 
+  </div>
+
   <button class="add-button" (click)="add(businessunit)">
     Ajouter une businessunit
   </button>

src/app/components/collaborateur/collaborateur.component.html

@@ -1,7 +1,7 @@
 <div xmlns="">
   <h2 class = mb-4>Collaborateurs</h2>
 
-  <div style="overflow-x:auto;" class="mb-5">
+  <div style="overflow-x:auto;" class="mb-5 col-12">
     <table class="table">
       <thead>
         <tr>