Add icon to show if product contains (sure or probably) palm oil

Author: Nicolas

app/pages/details/details.html

@@ -23,7 +23,13 @@
             <ion-card-title>
               {{product.product_name || product.code}}
             </ion-card-title>
-            <ion-icon class="icon-palm_oil"></ion-icon>
+            <ion-icon
+              class="idcard-icon icon-palm_oil"
+              [ngClass]="{
+                probably: product.ingredients_that_may_be_from_palm_oil_n > 0,
+                present: product.ingredients_from_palm_oil_n > 0
+              }">
+            </ion-icon>
           </ion-card-content>
         </ion-card>
       </ion-col>

app/pages/details/details.scss

@@ -54,9 +54,21 @@ ion-col {
   margin-bottom: -10px !important;
 }
 
+.idcard-icon {
+  font-size: 2.5rem;
+  color: green;
+}
+
+.idcard-icon.probably {
+  color: orange;
+}
+
+.idcard-icon.present {
+  color: red;
+}
+
 @media screen and (min-width: $grid-responsive-md-break) {
   .product-idcard {
     position: fixed;
   }
 }
-