Update app.py

app.py

@@ -1,20 +1,11 @@
 import streamlit as st
-
+import pandas as pd
 st.markdown("""
     <style>
-    /* Set a soft background color with gradient animation */
-    @keyframes gradientBackground {
-        0% { background-position: 0% 50%; }
-        50% { background-position: 100% 50%; }
-        100% { background-position: 0% 50%; }
-    }
-
+    /* Set a soft background color */
     body {
-        background: linear-gradient(270deg, #e91e63, #03a9f4, #3f51b5, #00bcd4);
-        background-size: 800% 800%;
-        animation: gradientBackground 15s ease infinite;
+        background-color: #eef2f7;
     }
-
     /* Style for main title */
     h1 {
         color: #00FFFF;
@@ -23,7 +14,6 @@ st.markdown("""
         text-align: center;
         margin-bottom: 25px;
     }
-
     /* Style for headers */
     h2 {
         color: #FFFACD;
@@ -31,46 +21,56 @@ st.markdown("""
         font-weight: 600;
         margin-top: 30px;
     }
-
+    
     /* Style for subheaders */
-    h3 {
+     h3 {
         color: #ba95b0;
         font-family: 'Roboto', sans-serif;
         font-weight: 500;
         margin-top: 20px;
     }
-
+    .custom-subheader {
+        color: #00FFFF;
+        font-family: 'Roboto', sans-serif;
+        font-weight: 600;
+        margin-bottom: 15px;
+    }
     /* Paragraph styling */
     p {
         font-family: 'Georgia', serif;
         line-height: 1.8;
-        color: #FFFFFF;
+        color: #FFFFFF; /* Darker text color for better visibility */
         margin-bottom: 20px;
     }
-
     /* List styling with checkmark bullets */
     .icon-bullet {
         list-style-type: none;
         padding-left: 20px;
     }
-
     .icon-bullet li {
         font-family: 'Georgia', serif;
         font-size: 1.1em;
         margin-bottom: 10px;
-        color: #FFFFF0;
+        color: #FFFFF0; /* Darker text color for better visibility */
     }
-
     .icon-bullet li::before {
         content: "✔️";
         padding-right: 10px;
         color: #17a2b8;
     }
+    /* Sidebar styling */
+    .sidebar .sidebar-content {
+        background-color: #ffffff;
+        border-radius: 10px;
+        padding: 15px;
+    }
+    .sidebar h2 {
+        color: #495057;
+    }
     </style>
-""", unsafe_allow_html=True)
-
+    """, unsafe_allow_html=True)
 st.title("INTRODUCTION TO DATA ANALYSIS")
-st.header("What does the term data refer to?")
+st.header("What does the term data refers to?")
 st.subheader("Data")
 st.markdown("""
     Data refers to a collection of information gathered from various sources. Here are a few examples:
@@ -82,5 +82,45 @@ st.markdown("""
 <li>Videos</li>
 <li>Audio recordings</li>
 </ul>
-""", unsafe_allow_html=True)
+""",unsafe_allow_html=True)
 st.image("https://cdn-uploads.huggingface.co/production/uploads/64c972774515835c4dadd754/qpmLGi47ucDCWYEi8eZhE.png",caption="An Example of Data",width=400)
+st.header("What is Data Analysis?")
+st.subheader("Data Analysis")
+st.markdown("""Data analysis is the process of inspecting, cleansing, transforming, and modeling data with the goal of discovering useful information, drawing conclusions, and supporting decision-making
+based on the problem statement.This applied on various filed like business,science,health care etc""") 
+st.image("https://cdn-uploads.huggingface.co/production/uploads/64c972774515835c4dadd754/QMUIDv2eboPvohbRe2yua.png",caption="An Example of Data Analysis",width=400)
+st.header("Data Classification")
+st.subheader("Structured Data")
+st.markdown("""
+    Structured data is organized and formatted, making it easy to search, analyze, and store in databases. Common examples include:
+    <ul class="icon-bullet">
+        <li>Excel Documents</li>
+        <li>SQL Databases</li>
+    </ul>
+""", unsafe_allow_html=True)
+
+st.image('https://cdn-uploads.huggingface.co/production/uploads/64c972774515835c4dadd754/dSbyOXaQ6N_Kg2TLxgEyt.png', width=400)
+st.subheader("Unstructured Data")
+st.markdown("""
+    Unstructured data doesn't follow a specific format and is often difficult to organize. Examples include:
+    <ul class="icon-bullet">
+        <li>Images</li>
+        <li>Videos</li>
+        <li>Text documents</li>
+        <li>Social Media Feeds</li>
+    </ul>
+""", unsafe_allow_html=True)
+
+st.image("https://cdn-uploads.huggingface.co/production/uploads/64c972774515835c4dadd754/xhaNBRanDaj8esumqo9hl.png", width=400)
+st.subheader("Semi-Structured Data")
+st.markdown("""
+    Semi-structured data contains elements of both structured and unstructured data. Examples include:
+    <ul class="icon-bullet">
+        <li>CSV Files</li>
+        <li>JSON Files</li>
+        <li>Emails</li>
+        <li>HTML Documents</li>
+    </ul>
+""", unsafe_allow_html=True)
+
+st.image("https://cdn-uploads.huggingface.co/production/uploads/64c972774515835c4dadd754/Nupc6BePInRVo9gJwLfWH.png", width=400)