Update app.py

app.py

@@ -25,7 +25,6 @@ try:
         if isinstance(data, dict):
             stored_embeddings = np.array(data['embeddings'])
         elif isinstance(data, pd.DataFrame):
-            # Fallback for dataframe format
             target_col = next((c for c in ['embedding', 'embeddings', 'vectors'] if c in data.columns), None)
             stored_embeddings = np.vstack(data[target_col].values) if target_col else data
         else:
@@ -45,7 +44,6 @@ def image_to_base64(image_path):
     with open(image_path, "rb") as img_file:
         return base64.b64encode(img_file.read()).decode('utf-8')
 
-# Pre-load the logo
 logo_b64 = image_to_base64("logo.jpg")
 
 # ==========================================
@@ -97,10 +95,11 @@ def magic_pipeline(image_path):
 fb_css = """
 body {background-color: #f0f2f5 !important; font-family: Helvetica, Arial, sans-serif;}
 
+/* --- HEADER --- */
 .fb-header {
     background-color: #ffffff; 
     color: #1877f2; 
-    padding: 12px 20px;
+    padding: 15px 20px;
     box-shadow: 0 2px 4px rgba(0,0,0,0.1);
     border-bottom: 1px solid #ddd;
     margin-bottom: 20px;
@@ -109,11 +108,12 @@ body {background-color: #f0f2f5 !important; font-family: Helvetica, Arial, sans-
 }
 
 .logo-img {
-    height: 40px;
-    width: 40px; 
+    height: 80px;  /* UPDATED SIZE */
+    width: 80px;   /* UPDATED SIZE */
     object-fit: cover;
-    margin-right: 15px;
-    border-radius: 5px;
+    margin-right: 20px;
+    border-radius: 8px;
+    border: 1px solid #eee;
 }
 
 .header-text-col {
@@ -122,32 +122,35 @@ body {background-color: #f0f2f5 !important; font-family: Helvetica, Arial, sans-
     justify-content: center;
 }
 
-.app-title {
-    font-size: 24px; 
-    font-weight: 900; 
-    line-height: 1.1;
-}
-
-.app-slogan {
-    font-size: 14px; 
-    font-weight: normal; 
-    color: #606770;
-}
+.app-title { font-size: 28px; font-weight: 900; line-height: 1.1; }
+.app-slogan { font-size: 16px; font-weight: normal; color: #606770; }
 
+/* --- SIDEBAR NAV --- */
 .sidebar-btn {
     background-color: transparent !important;
     color: #050505 !important;
+    
+    /* ALIGNMENT FIXES */
     text-align: left !important;
+    justify-content: flex-start !important;
+    display: flex !important;
+    align-items: center !important;
+    
     border: none !important;
     font-weight: 600 !important;
-    padding: 12px !important;
+    padding: 15px 10px !important;
     font-size: 16px !important;
     box-shadow: none !important;
     width: 100% !important;
     border-radius: 8px !important;
+    
+    /* SEPARATION EFFECT */
+    border-bottom: 1px solid #e4e6eb !important; 
+    margin-bottom: 8px !important;
 }
 .sidebar-btn:hover { background-color: #e4e6eb !important; }
 
+/* --- CARDS --- */
 .fb-card {
     background: white;
     border-radius: 8px;
@@ -186,12 +189,10 @@ with gr.Blocks(css=fb_css, title="Legacy Kitchen") as demo:
         
         # --- LEFT SIDEBAR ---
         with gr.Column(scale=1, min_width=250):
-            gr.HTML('<div style="display:flex; align-items:center; margin-bottom:20px;"><div class="avatar">👤</div><b>My Profile</b></div>')
+            gr.HTML('<div style="display:flex; align-items:center; margin-bottom:20px; padding-left:10px;"><div class="avatar">👤</div><b>My Profile</b></div>')
             
             nav_feed = gr.Button("📰   Feed", elem_classes=["sidebar-btn"])
             nav_digital = gr.Button("📸   Digitizer", elem_classes=["sidebar-btn"])
-            
-            # --- UPDATED BUTTON ---
             nav_about = gr.Button("ℹ️   About Us", elem_classes=["sidebar-btn"])
             
             gr.Markdown("---")
@@ -248,7 +249,7 @@ with gr.Blocks(css=fb_css, title="Legacy Kitchen") as demo:
                     
                     magic_btn.click(magic_pipeline, input_img, [out_text, out_sim])
             
-            # VIEW 3: ABOUT US (Updated View)
+            # VIEW 3: ABOUT US
             with gr.Group(visible=False) as about_view:
                 gr.Markdown("### ℹ️ About Us", elem_classes=["fb-card"])
                 with gr.Group(elem_classes=["fb-card"]):
@@ -263,7 +264,7 @@ with gr.Blocks(css=fb_css, title="Legacy Kitchen") as demo:
                     *Preserving the Past, Cooking for the Future.*
                     """)
 
-    # Nav Logic (Updated for About Us)
+    # Nav Logic
     nav_feed.click(lambda: (gr.update(visible=True), gr.update(visible=False), gr.update(visible=False)), None, [feed_view, digitalizer_view, about_view])
     nav_digital.click(lambda: (gr.update(visible=False), gr.update(visible=True), gr.update(visible=False)), None, [feed_view, digitalizer_view, about_view])
     nav_about.click(lambda: (gr.update(visible=False), gr.update(visible=False), gr.update(visible=True)), None, [feed_view, digitalizer_view, about_view])