Update app.py

app.py

@@ -1,51 +1,125 @@
 import streamlit as st
 import math
 from functools import reduce
+
+# Custom CSS for background, fonts, and text styling
+st.markdown("""
+    <style>
+    body {
+        background-color: #f5f5f5;
+    }
+    h1 {
+        color: #d63384;
+        font-family: 'Arial', sans-serif;
+        font-weight: bold;
+        text-align: center;
+    }
+    h2 {
+        color: #1f77b4;
+        font-family: 'Arial', sans-serif;
+        font-weight: bold;
+    }
+    h3 {
+        color: #6c757d;
+        font-family: 'Arial', sans-serif;
+    }
+    .custom-subheader {
+        color: #2ca02c;
+        font-family: 'Arial', sans-serif;
+        margin-bottom: 0;
+    }
+    p {
+        font-family: 'Georgia', serif;
+        line-height: 1.6;
+        color: #343a40;
+    }
+    .icon-bullet {
+        list-style-type: none;
+    }
+    .icon-bullet li::before {
+        content: "✔️";
+        padding-right: 10px;
+    }
+    </style>
+    """, unsafe_allow_html=True)
+
+# Title Section
 st.title(":red[**1 : INTRODUCTION TO STATISTICS**]")
-st.markdown("""In this field we will be dealing with data by using programing language python. The term DATA
-ANALYSIS itself say’s that it will be dealing with data. In this we will be collecting the data and
-will be cleaning the data and then we will be analyzing the to get the insights from them. Now
-let us understand the term data.""") 
-st.header("*What does term data refers to?*")
+st.markdown("""
+    In this field, we will be dealing with data using the programming language Python. The term **DATA ANALYSIS** itself indicates working with data. We will collect, clean, and analyze the data to gain insights. Let's first understand the term *data*.
+""")
+
+# Header Section
+st.header("*What does the term data refer to?*")
 st.subheader(":blue[DATA]")
-st.markdown("""Data is collection of information which is gathered from observation. There are wide
-sources of information. Some of the best examples of data are given below. \n * IMAGE is one of the best source of data. \n * TEXT is one of the best source of data.
-\n * VIDEO is one of the best source of data. \n * AUDIO is one of the best source of data.
+
+st.markdown("""
+    Data is a collection of information gathered from observation. There are many sources of information. Below are some examples:
 """)
-st.header("DATA is classified into 3-types.")
-st.subheader("Structured Data", divider=True)
-st.subheader("Unstructured Data", divider=True)
-st.subheader("Semi Structured Data", divider=True)
+st.markdown("""
+<ul class="icon-bullet">
+    <li>IMAGE</li>
+    <li>TEXT</li>
+    <li>VIDEO</li>
+    <li>AUDIO</li>
+</ul>
+""", unsafe_allow_html=True)
+
+# Data Classification Section
+st.header("DATA is classified into 3 types.")
 st.subheader("**Structured Data**")
-st.markdown("""This type of data will be having a effective or well organized
-format.\nThis type of data is aligned in terms of row’s and column’s. Some of the best example’s of
-structured data are given below.\n * EXCEL DOCUMENT \n * STRUCTURED QUERY LANGUAGE DATABASE 
-""")
+st.markdown("""
+    This type of data is well-organized, typically in rows and columns. Examples include:
+    <ul class="icon-bullet">
+        <li>EXCEL DOCUMENT</li>
+        <li>STRUCTURED QUERY LANGUAGE DATABASE</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("""This type of data will not be having any effective or well
-organized format. This type of data doesn’t have any row’s and column’s. Some of the best
-example’s of unstructured data are given below.\n * IMAGE\n * VIDEO\n * TEXT\n *Social Media Feeds 
-""")
+st.markdown("""
+    This type of data is not organized in a predefined manner. Examples include:
+    <ul class="icon-bullet">
+        <li>IMAGE</li>
+        <li>VIDEO</li>
+        <li>TEXT</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("""This type of data can be called as combination of
-structured data as well as unstructured data. Some of the best examples of semi structured
-data are given below.\n * COMMA SEPERATED VARIABLE\n *JSON FILES\n * E-MAILS\n * HTML
-""")
+
+st.subheader("**Semi-Structured Data**")
+st.markdown("""
+    This data combines elements of both structured and unstructured data. Examples include:
+    <ul class="icon-bullet">
+        <li>COMMA SEPARATED VARIABLE (CSV)</li>
+        <li>JSON FILES</li>
+        <li>E-MAILS</li>
+        <li>HTML</li>
+    </ul>
+""", unsafe_allow_html=True)
 st.image("https://cdn-uploads.huggingface.co/production/uploads/64c972774515835c4dadd754/Nupc6BePInRVo9gJwLfWH.png", width=400)
+
+# Introduction to Statistics
 st.title("2 : INTRODUCTION TO STATISTICS")
-st.markdown("""_The term statistics is a branch of mathematics and also can be called as a huge field in which
-we are going to deal with data which involves collecting, analyzing, interpreting, and
-structuring the data. Statistics is classified into two types.
-_""")
-st.subheader("2.1 Descriptive Statistics",divider=True)
-st.subheader("2.2 Inferential Statistics",divider=True)
-st.subheader("**2.1 Descriptive Statistics**")
-st.markdown("""This Descriptive Statistics describe the main feature of data. This
-descriptive statistics can be performed on sample data as well as population data. Some of
-the key points of descriptive statistics are stated below.\n KEY COCEPTS\n * Measurement of Central Tendency which involves finding Mean, Median, and Mode.\n * Measurement of Dispersion which involves finding Range, Variance and Standard Deviation.\n * Distribution which gives how frequently the data is occurring some of examples of distribution are Gaussian, Random, and Normal distribution""")
-st.subheader("**2.2 Inferential Statistics**")
-st.markdown("""This Inferential Statistics will describe the population based
-on a sample data. This statistics will give predictions about a population based on sample.
-""")
+st.markdown("""
+    _Statistics is a branch of mathematics focused on collecting, analyzing, interpreting, and structuring data. It is classified into two types:_
+""")
+
+# Descriptive Statistics Section
+st.subheader("2.1 Descriptive Statistics")
+st.markdown("""
+    Descriptive Statistics describes the main features of data. It can be performed on sample data as well as population data. Key concepts include:
+    <ul class="icon-bullet">
+        <li>Measurement of Central Tendency (Mean, Median, Mode)</li>
+        <li>Measurement of Dispersion (Range, Variance, Standard Deviation)</li>
+        <li>Distribution (e.g., Gaussian, Random, Normal)</li>
+    </ul>
+""", unsafe_allow_html=True)
+
+# Inferential Statistics Section
+st.subheader("2.2 Inferential Statistics")
+st.markdown("""
+    Inferential Statistics makes predictions about a population based on sample data.
+""")