Update pages/0_Problem-Statement_and_Aim.py

pages/0_Problem-Statement_and_Aim.py

@@ -0,0 +1,67 @@
+import streamlit as st 
+import pandas as pd 
+import numpy as np 
+
+st.markdown("<h1 style='text-align:center; color:white;'>Problem Statement and Aim for this Project</h1>",unsafe_allow_html=True)
+
+
+# Title of the Streamlit app
+st.header("Analyzing and classifying the consumer electronics sales.")
+
+# Problem statement section
+st.subheader("Problem Statement :")
+
+# Text explaining the problem
+st.write("""
+    **Title:** Analyzing and predicting the electronics sales and consumer purchase intent Using Machine Learning
+    
+    **Problem Statement:** Given a dataset of consumer electronics sales, which includes customer demographics, product details, and satisfaction metrics, Whether we can develop a classification model that can accurately predict whether a customer intends to purchase a product or not ?
+
+    **Aim for this project:** The goal of this project is to build a robust end-to-end machine learning pipeline to classify customer purchase intent using the provided features. The steps will include data preprocessing, exploratory data analysis (EDA), feature engineering, model training, and evaluation. The final goal is to achieve the highest possible accuracy and generalization on unseen data.
+
+    **Key Objectives :**
+        - Data Preprocessing, Feature Engineering
+        - Exploratory Data Analysis
+        - Model Creation & Evaluation
+""")
+st.markdown(
+    """
+    <div style="text-align: center;">
+        <img src="https://cdn-uploads.huggingface.co/production/uploads/67441c51a784a9d15cb12871/o_hx-CUYhb2kbgFHZpd9l.jpeg)" width="70%" />
+    </div>
+    """, 
+    unsafe_allow_html=True
+)
+background_image_url = "https://cdn-uploads.huggingface.co/production/uploads/67441c51a784a9d15cb12871/clljdAv7f_LGL8dH5vCZQ.jpeg"
+
+# Apply custom CSS for the background image and overlay
+st.markdown(
+    f"""
+    <style>
+        .stApp {{
+            background-image: url("{background_image_url}");
+            background-size: cover;
+            background-position: center;
+            height: 100vh;
+        }}
+        
+        /* Semi-transparent overlay */
+        .stApp::before {{
+            content: "";
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background: rgba(0, 0, 0, 0.4);  /* Adjust transparency here (0.4 for 40% transparency) */
+            z-index: -1;
+        }}
+         /* Styling the content to ensure text visibility */
+        .stMarkdown {{
+            color: white;  /* White text to ensure visibility */
+            font-size: 50px;  /* Adjust font size for better readability */
+        }}
+    </style>
+    """, 
+    unsafe_allow_html=True
+)