diff --git a/css/styles.css b/css/styles.css
index 60dc8d96cb4192976549d03ea124d4b4f3dd16f0..acc5b72f8a360c5f790850ce4f23c348bf23ffd7 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -11,12 +11,6 @@ iframe {
     border: none;
 }
 
-.bold {
-    font-weight: bold;
-}
-
-
-
 .addButton {
     height: 40px;
     width: 40px;
@@ -24,13 +18,23 @@ iframe {
     color: #005555;
     position: relative;
     left: 828px;
-    bottom: 45px;
+    bottom: 108px;
     font-size: 30px;
     font-weight: bold;
     border: none;
     border-radius: 5px;
 }
 
+.addButton:focus {
+    outline: none;
+    animation: gotAdded;
+    animation-duration: 1s;
+}
+
+.bold {
+    font-weight: bold;
+}
+
 .bold-btn {
     position: absolute;
     color: white;
@@ -217,7 +221,6 @@ iframe {
     top: 12px;
 }
 
-
 .insc {
     width: 418px;
     display: block;
@@ -275,6 +278,21 @@ iframe {
     overflow-y: scroll;
 }
 
+.mealInfo {
+    position: relative;
+    text-align: center;
+    padding: 2px;
+    width: 380px;
+    height: 16px;
+    left: 300px;
+    bottom: 57px;
+    margin: 4px;
+    border: 3px;
+    border-color: #005555;
+    border-style: solid;
+    border-radius: 10px;
+}
+
 .mealOutline {
     border-radius: 25px;
     background-color: #F2F2F2;
@@ -490,6 +508,11 @@ iframe {
     background-color: #008C8C;
 }
 
+.thicc {
+    font-size: 30px;
+    font-weight: bolder;
+}
+
 .titleBar{
     height: 28px;
     padding: 12px;
@@ -597,6 +620,19 @@ iframe {
     to {opacity: 1;}
 }
 
+@keyframes gotAdded {
+    0% {
+    }
+    50% {
+        height: 55px;
+        width: 55px;
+        left: 821px;
+        bottom: 115px;
+    }
+    100% {
+    }
+}
+
 @media only screen and (min-width:1200px) {
     .app{
         margin: auto;
diff --git a/html/chercherUnRepas.html b/html/chercherUnRepas.html
index 8c2cc6ca1459714109e748d114af80e02b846bd1..b0ffefd46a69c09c4024f3d8e7ee31f9e1310f06 100644
--- a/html/chercherUnRepas.html
+++ b/html/chercherUnRepas.html
@@ -44,6 +44,17 @@
                     '<span class="bold">' + obj.array[index].repas[i].nom + '</span><br>' +
                     obj.array[index].repas[i].type + '<br>' +
                     'Quantité : ' + obj.array[index].repas[i].qt + ' disponibles<br>' +
+                    '<div class = "mealInfo">BB : '+ obj.array[index].repas[i].bb +' </div>' +
+                    '<div class = "mealInfo"> ';
+                if(obj.array[index].repas[i].allergenes.length == 0) {
+                    builtUpHTML += 'Sans allergènes';
+                } else {
+                    builtUpHTML += obj.array[index].repas[i].allergenes[0];
+                    for (let a = 1; a < obj.array[index].repas[i].allergenes.length; a++) {
+                        builtUpHTML += ', ' + obj.array[index].repas[i].allergenes[a];
+                    }
+                }
+                builtUpHTML += '</div>' +
                     '<button class = "addButton" onclick="addToPanier(event,'+i+', '+index+')"> + </button>' +
                     '</div>';
             }
@@ -54,6 +65,9 @@
     }
 
     function addToPanier(event, repas, frigoIndex) {
+        event.target.innerHTML = "<span class = 'thicc'>&#x2713;</span>";
+        setTimeout(() => {event.target.innerHTML = "+"},750);
+        setTimeout(() => {document.activeElement.blur()},769);
         if(sessionStorage.getItem("panier") != null){
             var prev = sessionStorage.getItem("panier");
             sessionStorage.setItem("panier", prev+" "+frigoIndex+"-"+repas);