Initial Commit

app.py

@@ -7,8 +7,8 @@ from gradio_client import Client
 
 # Set page configuration
 st.set_page_config(
-    page_title="Food Image Recognition with Ingredients",
-    page_icon="🍔",
+    page_title="DelishAI - Your Culinary Assistant",
+    page_icon="🍽️",
     layout="centered",
     initial_sidebar_state="expanded",
 )
@@ -47,24 +47,27 @@ def local_css():
             color: white;
         }
         /* File uploader styling */
-        .css-1y0tads {
-            background-color: #ff4b4b;
-            color: white;
-            border: none;
-            border-radius: 5px;
+        .stFileUploader {
+            border: 2px dashed #ff4b4b;
+            border-radius: 10px;
+            padding: 20px;
+            text-align: center;
+            color: #ff4b4b;
+            background-color: #ffffff;
+            font-weight: bold;
         }
-        .css-1y0tads:hover {
-            background-color: #e04343;
-            color: white;
+        /* File uploader hover effect */
+        .stFileUploader:hover {
+            background-color: #ffe5e5;
         }
         /* Button styling */
         .stButton>button {
             background-color: #ff4b4b;
             color: white;
             border: none;
-            padding: 0.5rem 1rem;
+            padding: 0.7rem 1.5rem;
             border-radius: 5px;
-            font-size: 1rem;
+            font-size: 1.1rem;
             font-weight: bold;
             margin-top: 10px;
         }
@@ -90,8 +93,15 @@ def local_css():
         footer {
             visibility: hidden;
         }
-        /* Mobile responsiveness */
+        /* Hide sidebar on small screens */
         @media only screen and (max-width: 600px) {
+            [data-testid="stSidebar"] {
+                display: none;
+            }
+            .main .block-container {
+                padding-left: 1rem;
+                padding-right: 1rem;
+            }
             .title h1 {
                 font-size: 2rem;
             }
@@ -99,6 +109,24 @@ def local_css():
                 width: 100%;
             }
         }
+        /* Sample images grid */
+        .sample-images {
+            display: flex;
+            justify-content: center;
+            flex-wrap: wrap;
+            gap: 10px;
+        }
+        .sample-images img {
+            width: 150px;
+            height: 150px;
+            object-fit: cover;
+            border-radius: 10px;
+            cursor: pointer;
+            border: 2px solid transparent;
+        }
+        .sample-images img:hover {
+            border: 2px solid #ff4b4b;
+        }
         </style>
         """,
         unsafe_allow_html=True
@@ -147,12 +175,12 @@ def get_ingredients_qwen(food_name):
         return f"Error generating ingredients: {e}"
 
 # Main content
-st.markdown('<div class="title"><h1>Food Image Recognition with Ingredients</h1></div>', unsafe_allow_html=True)
+st.markdown('<div class="title"><h1>DelishAI - Your Culinary Assistant</h1></div>', unsafe_allow_html=True)
 
 # Add banner image
-st.image("IR_IMAGE.png", use_column_width=True)
+st.image("IR_IMAGE.png", use_container_width=True)
 
-# Sidebar for model information
+# Sidebar for model information (hidden on small screens)
 with st.sidebar:
     st.title("Model Information")
     st.write("**Image Classification Model**")
@@ -162,13 +190,34 @@ with st.sidebar:
     st.markdown("---")
     st.markdown("<p style='text-align: center;'>Developed by Muhammad Hassan Butt.</p>", unsafe_allow_html=True)
 
+# Sample images
+st.subheader("Or try one of these sample images:")
+sample_images = {
+    "Burger": "sample_images/burger.jpg",
+    "Pizza": "sample_images/pizza.jpg",
+    "Sushi": "sample_images/sushi.jpg",
+    "Salad": "sample_images/salad.jpg"
+}
+
+cols = st.columns(len(sample_images))
+for idx, (name, file_path) in enumerate(sample_images.items()):
+    with cols[idx]:
+        if st.button(f"{name}", key=name):
+            uploaded_file = file_path
+
 # File uploader
-uploaded_file = st.file_uploader("Choose a food image...", type=["jpg", "png", "jpeg"])
+st.subheader("Upload a food image:")
+uploaded_file = st.file_uploader("", type=["jpg", "png", "jpeg"])
 
-if uploaded_file is not None:
+if 'uploaded_file' in locals() and uploaded_file is not None:
     # Display the uploaded image
-    image = Image.open(uploaded_file)
-    st.image(image, caption="Uploaded Image", use_column_width=True)
+    if isinstance(uploaded_file, str):
+        # Sample image selected
+        image = Image.open(uploaded_file)
+    else:
+        # User uploaded image
+        image = Image.open(uploaded_file)
+    st.image(image, caption="Uploaded Image", use_container_width=True)
 
     # Classification button
     if st.button("Classify"):
@@ -198,3 +247,6 @@ if uploaded_file is not None:
                 st.write(result)
             except Exception as e:
                 st.error(f"Unable to contact RAG: {e}")
+else:
+    st.info("Please select or upload an image to get started.")
+