Update pages/introds.py

pages/introds.py

@@ -1,52 +1,84 @@
 import streamlit as st
-import pandas as pd
-import numpy as np
 
-# Add header section
-st.markdown(
-    "<h1 style='text-align: center; color: Black;'>DATA SCIENCE INTRODUCTION</h1>",
-    unsafe_allow_html=True
-)
+# Custom CSS for styling and background
+custom_css = """
+<style>
+    html, body, [data-testid="stAppViewContainer"] {
+        background: linear-gradient(
+            rgba(0, 0, 0, 0.6), 
+            rgba(0, 0, 0, 0.6)
+        ), 
+        url("https://cdn.pixabay.com/photo/2024/01/29/22/47/ai-generated-8540915_1280.jpg") no-repeat center center fixed;
+        background-size: cover;
+        font-family: Arial, sans-serif;
+        color: #ffffff;
+    }
+    h1 {
+        color: #ffffff;
+        text-align: center;
+        font-size: 3rem; 
+        margin-top: 20px;
+        text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.7); 
+    }
+    .division {
+        margin: 20px auto;
+        padding: 30px;
+        background: rgba(255, 255, 255, 0.2); 
+        border-radius: 15px;
+        box-shadow: 0 6px 8px rgba(0, 0, 0, 0.2); 
+    }
+    .division h2 {
+        color: #ffffff;
+        margin-bottom: 15px;
+        font-size: 2.2rem; 
+        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
+    }
+    .division p, .division ul li {
+        font-size: 1.2rem; 
+        line-height: 1.8; 
+        color: #e0e0e0;
+    }
+    .division ul li {
+        margin-bottom: 10px;
+    }
+</style>
+"""
+
+# Inject the CSS styles
+st.markdown(custom_css, unsafe_allow_html=True)
 
-# Main content with properly formatted HTML
+# Header section
+st.markdown("<h1>Welcome to Data Science Introduction</h1>", unsafe_allow_html=True)
+
+# Main content
 st.markdown(
     """
-    <div class="section">
+    <div class="division">
         <h2>What is Data Science?</h2>
         <p>
-           It combines techniques from statistics, computer science, mathematics, and domain expertise to analyze and interpret data effectively.
-           In essence, data science transforms raw data into actionable insights, driving smarter decisions across industries.
-           There are several types of applications, as explained below:
+            Data science combines techniques from statistics, computer science, mathematics, and domain expertise 
+            to analyze and interpret data effectively. It transforms raw data into actionable insights, driving smarter 
+            decisions across industries.
         </p>
         <ul>
-            <li>Analyzing customer reviews to identify product sentiment</li> 
-            <li>Techniques Used: Natural Language Processing (NLP), sentiment analysis.</li>
+            <li>Analyzing customer reviews to identify product sentiment</li>
+            <li>Techniques Used: Natural Language Processing (NLP), sentiment analysis</li>
             <li>Optimizing delivery routes for logistics companies</li>
             <li>Techniques Used: Graph algorithms, optimization techniques</li>
         </ul>
     </div>
 
-    <div class="section">
-        <h2>Few Important Steps in Data Science</h2>
-        <p>
-            Data Science involves several steps, such as:
-        </p>
-        <ul>    
-             <li><strong>Understanding the Given Problem:</strong> First, you need to understand the type of problem you are addressing.</li>
-             <li><strong>Data Collection:</strong> Gather relevant data from various sources to address the defined problem.</li>
-             <li><strong>Data Cleaning and Preprocessing:</strong> Prepare the raw data for analysis by handling inconsistencies, missing values, and errors.</li>
-             <li><strong>Exploratory Data Analysis (EDA):</strong> Gain an initial understanding of the data's main characteristics through visualization and summary statistics.</li>
-             <li><strong>Deployment:</strong> Implement the model into a production environment where it can provide actionable insights or make decisions in real-time.</li>
+    <div class="division">
+        <h2>Key Steps in Data Science</h2>
+        <p>Data Science involves several steps, such as:</p>
+        <ul>
+            <li><strong>Understanding the Problem:</strong> Grasp the problem's nature and define clear objectives.</li>
+            <li><strong>Data Collection:</strong> Gather relevant data from multiple sources.</li>
+            <li><strong>Data Cleaning:</strong> Handle inconsistencies, missing values, and prepare data for analysis.</li>
+            <li><strong>Exploratory Data Analysis (EDA):</strong> Use visualization and summary statistics to understand data.</li>
+            <li><strong>Model Deployment:</strong> Implement models in a production environment for real-time decision-making.</li>
         </ul>
     </div>
     """,
     unsafe_allow_html=True
 )
-
-
-
-
-
-
-
-