Update app.py

app.py

@@ -16,6 +16,16 @@ with open("./max_dict.json", "r") as f:
 with open("./cities_geo.json", "r") as f:
     cities_geo = json.load(f)
 
+# Custom CSS to adjust the slider width
+st.markdown("""
+    <style>
+    .slider-container {
+        max-width: 400px;  /* Adjust the width to your preference */
+        margin-bottom: 20px;
+    }
+    </style>
+    """, unsafe_allow_html=True)
+
 # Create two columns: one for the city and one for the map
 col1, col2 = st.columns([1, 2])  # Adjust the width ratios as needed
 
@@ -25,6 +35,8 @@ with col1:
     with st.container(height=800, border=False):
         city = st.selectbox('City', list(cities_geo.keys()))  # Display city dropdown in the first column
         waterfront = st.checkbox('Waterfront', value=False)
+        
+        st.markdown('<div class="slider-container">', unsafe_allow_html=True)
         bedrooms = st.slider('Bedrooms', min_value=min_dict['bedrooms'], max_value=max_dict['bedrooms'], value=3)
         bathrooms = st.slider('Bathrooms', min_value=min_dict['bathrooms'], max_value=max_dict['bathrooms'], value=2)
         sqft_living = st.slider('Square Feet (Living)', min_value=min_dict['sqft_living'], max_value=max_dict['sqft_living'], value=1000)
@@ -36,6 +48,7 @@ with col1:
         sqft_basement = st.slider('Square Feet (Basement)', min_value=min_dict['sqft_basement'], max_value=max_dict['sqft_basement'], value=0)
         yr_built = st.slider('Year Built', min_value=min_dict['yr_built'], max_value=max_dict['yr_built'], value=2000)
         yr_renovated = st.slider('Year Renovated', min_value=min_dict['yr_renovated'], max_value=min_dict['yr_renovated'], value=2010)
+        st.markdown('</div>', unsafe_allow_html=True)
 
     st.markdown('</div>', unsafe_allow_html=True)
     
@@ -70,6 +83,4 @@ with col2:
         f"<h1 style='font-size: 24px;'>Predicted Price: ${predicted_price[0][0]:,.2f}</h1>",
         unsafe_allow_html=True)
     map_data = pd.DataFrame(cities_geo[city])
-    st.map(map_data, zoom=11)
-    # with st.container(height=500, border=False):
-
+    st.map(map_data, zoom=11)