26

app.py

@@ -111,13 +111,21 @@ def load_css():
         margin: 1rem 0;
     }
     
-    /* Ingredient list styling */
-    .ingredient-item {
+    /* Improved ingredient list styling - single div */
+    .ingredients-container {
         background: #f8f9fa;
-        padding: 0.5rem 1rem;
-        margin: 0.25rem 0;
-        border-radius: 20px;
-        border-left: 3px solid #667eea;
+        padding: 1rem 1.5rem;
+        margin: 1rem 0;
+        border-radius: 10px;
+        border-left: 4px solid #667eea;
+        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+        line-height: 1.6;
+        font-size: 1rem;
+    }
+    
+    .ingredients-container strong {
+        color: #495057;
+        font-weight: 600;
     }
     
     /* Footer */
@@ -345,10 +353,14 @@ def main():
                             else:
                                 st.success("✅ Bahan berhasil diambil!")
                                 
-                                # Display ingredients in a nice format
-                                st.markdown("**🧾 Daftar Bahan:**")
-                                for ing in ingredients:
-                                    st.markdown(f'<div class="ingredient-item">• {ing}</div>', unsafe_allow_html=True)
+                                # Display ingredients in a single nice container
+                                ingredients_text = ", ".join(ingredients)
+                                st.markdown(f'''
+                                <div class="ingredients-container">
+                                    <strong>🧾 Daftar Bahan:</strong><br>
+                                    {ingredients_text}
+                                </div>
+                                ''', unsafe_allow_html=True)
                                 
                                 # Predict allergens
                                 joined_ingredients = " ".join(ingredients)