app look

app.py

@@ -29,6 +29,13 @@ st.markdown("""
         font-family: 'Amazon Ember', sans-serif;
     }
     
+    .logo-container {
+    margin-bottom: 3rem;  /* Increase spacing between logo and cards */
+    position: relative;
+    z-index: 1;
+}
+
+
     .block-container {
         padding-top: 5rem;
     }
@@ -125,37 +132,23 @@ st.markdown("""
 
 
 # Header with logo and title
-extra, col_logo, col_title = st.columns([3,31, 66])
+col_logo, col_title = st.columns([31, 66])
 with col_logo:
-    st.image("/home/user/app/images/OS_AI_1_cropped.png", use_column_width=True)
-
-st.write("")
-st.write("")
-st.write("")
-st.write("")
-
-    #st.image("/home/ubuntu/images/OS_AI_1.png", use_column_width=True)
-# with col_title:
-#     st.write("")
-#     st.markdown('<div class="title">OpenSearch AI demos</div>', unsafe_allow_html=True)
-
-# def demo_link_block(icon, title, target_page):
-#     st.markdown(f"""
-#         <a href="/{target_page}" target="_self" style="text-decoration: none;">
-#             <div class="demo-card">
-#                 <div class="demo-text">
-#                     <span>{icon} {title}</span>
-#                     <span class="demo-arrow">→</span>
-#                 </div>
-#             </div>
-#         </a>
-#     """, unsafe_allow_html=True)
+    st.markdown("""
+    <div class="logo-container" style="position: absolute; top: 2rem; left: 2rem;">
+        <img src="images/OS_AI_1_cropped.png" style="width: 180px;">
+    </div>
+""", unsafe_allow_html=True)
 
+    # Optional: Add a margin-top to the demo section to avoid overlap
+    st.markdown("<div style='margin-top: 160px;'></div>", unsafe_allow_html=True)
 
 # st.write("")
-# demo_link_block("🔍", "AI Search", "Semantic_Search")
-# demo_link_block("💬","Multimodal Conversational Search", "Multimodal_Conversational_Search")
-# demo_link_block("🛍️","Agentic Shopping Assistant", "AI_Shopping_Assistant")
+# st.write("")
+# st.write("")
+# st.write("")
+
+
 
 
 col1, col2, col3 = st.columns(3)