Update app.py

app.py

@@ -111,7 +111,7 @@ if st.session_state.current_page == "Model Pipeline":
 
     st.markdown(
         """
-        <div style="text-align: center; margin-top: 30px;">
+        <div style="text-align: center;">
             <a href="https://github.com/Yashvj22/Life_Expectancy_Model" target="_blank" style="
                 background-color: #007bff;
                 color: white;
@@ -132,7 +132,7 @@ if st.session_state.current_page == "Model Pipeline":
     st.markdown("<hr style='border:1px solid #ddd;'>", unsafe_allow_html=True)
     
     st.markdown('''
-    <h2 style="color:#5d3fd3; text-align:center;"> About Author</h2>
+    <h2 style="text-align:center;"> About Author</h2>
     <div style="background-color:#f5f5f5; border-radius:10px; padding:20px; margin-top:20px;">
         <p style="font-size:16px; text-align:center; font-family:Georgia; line-height:1.6; color:#000;">
             Hello! I’m <b>Yash Jadhav</b>, a passionate <span style="color:#FF6347;">Data Scientist</span> 
@@ -312,6 +312,8 @@ elif st.session_state.current_page == "Simple EDA":
 elif st.session_state.current_page == "Data Pre-processing":
     st.markdown("<h1 class='title'>Data Preprocessing</h1>", unsafe_allow_html=True)
 
+    st.markdown("<hr style='border:1px solid #ddd;'>", unsafe_allow_html=True)
+
     st.markdown("<h2 class='subtitle' style='text-align: center;'>Handling Missing Values</h2>", unsafe_allow_html=True)
     
     st.markdown("<br>", unsafe_allow_html=True)
@@ -320,46 +322,68 @@ elif st.session_state.current_page == "Data Pre-processing":
         <h5 style="text-align: center;">
             <b>Using "Median" Imputation to Fill Highly Skewed Data</b>
         </h5>
-        <p style="text-align: justify;">
-            Median imputation is used to handle missing values in columns where data distribution is skewed. 
-            This method is more robust than mean imputation in such cases, as it prevents the effect of outliers 
-            from distorting the dataset. For example, GDP, Population, and Adult Mortality tend to have extreme values, 
-            making median a better choice for filling in missing data.
-        </p>
     """, unsafe_allow_html=True)
 
-    st.markdown("<br>", unsafe_allow_html=True)
+    st.markdown("""
+        <div style="
+            border: 1px solid #ddd;
+            border-radius: 8px;
+            padding: 15px;
+            background-color: #f9f9f9;
+            text-align: justify;">
+            Median imputation is used for columns where data distribution is highly skewed. 
+            This approach ensures that extreme values do not overly influence the dataset. 
+            Examples include GDP, Population, and Adult Mortality.
+        </div>
+    """, unsafe_allow_html=True)
+
+    st.markdown("<hr style='border:1px solid #ddd;'>", unsafe_allow_html=True)
 
     st.markdown("""
         <h5 style="text-align: center;">
             <b>Mean Imputation for Columns with Small Missing Values and Normally Distributed Data</b>
         </h5>
-        <p style="text-align: justify;">
-            Mean imputation is applied to columns where missing values are relatively small and the data follows a normal 
-            distribution. This method ensures that the overall distribution remains unchanged. Columns like BMI, Polio, 
-            and Schooling are typically well-suited for this approach as they do not contain extreme outliers that could 
-            distort the mean.
-        </p>
     """, unsafe_allow_html=True)
 
-    st.markdown("<br>", unsafe_allow_html=True)
+    st.markdown("""
+        <div style="
+            border: 1px solid #ddd;
+            border-radius: 8px;
+            padding: 15px;
+            background-color: #f9f9f9;
+            text-align: justify;">
+            Mean imputation is applied when missing values are small and the data is normally distributed. 
+            This helps maintain the overall dataset structure without being affected by extreme values. 
+            Suitable columns include BMI, Polio, and Schooling.
+        </div>
+    """, unsafe_allow_html=True)
+
+    st.markdown("<hr style='border:1px solid #ddd;'>", unsafe_allow_html=True)
 
     st.markdown("""
         <h5 style="text-align: center;">
             <b>Applying One-Hot Encoding on "Status" Column</b>
         </h5>
-        <p style="text-align: justify;">
-            The "Status" column contains categorical data, differentiating countries as either <b>Developed</b> or 
-            <b>Developing</b>. Since machine learning models work better with numerical data, we apply One-Hot Encoding, 
-            which converts this categorical variable into a numerical format. We use the "drop='first'" parameter to avoid 
-            multicollinearity by keeping only one of the binary categories.
-        </p>
     """, unsafe_allow_html=True)
 
-    st.markdown("<br>", unsafe_allow_html=True)
+    st.markdown("""
+        <div style="
+            border: 1px solid #ddd;
+            border-radius: 8px;
+            padding: 15px;
+            background-color: #f9f9f9;
+            text-align: justify;">
+            The "Status" column categorizes countries as either Developed or Developing. 
+            One-Hot Encoding is used to convert this categorical variable into a numerical format 
+            suitable for machine learning models. The "drop='first'" parameter is applied to prevent 
+            multicollinearity.
+        </div>
+    """, unsafe_allow_html=True)
+
 
     if st.button("🔙 Go Back to Model Pipeline"):
         switch_page("Model Pipeline")
+
  
        
 elif st.session_state.current_page == "EDA":