added images

.gitattributes

@@ -37,3 +37,5 @@ space_main_background.jpeg filter=lfs diff=lfs merge=lfs -text
 main_background.png filter=lfs diff=lfs merge=lfs -text
 text_generation.png filter=lfs diff=lfs merge=lfs -text
 space_background.jpeg filter=lfs diff=lfs merge=lfs -text
+tg_toxic.png filter=lfs diff=lfs merge=lfs -text
+toxic-in-chat-mda-toxic.gif filter=lfs diff=lfs merge=lfs -text

app.py

@@ -74,23 +74,48 @@ project_colaborators = """
 """
 
 st.markdown(about, unsafe_allow_html=True)
+static_review_path = "http://imagizer.imageshack.com/v2/667x500q90/r/922/fHrktQ.jpg"
+animated_review_path = (
+    "https://gifdb.com/images/high/neil-patrick-as-a-doctor-zj5buv1gsoe0nsy2.gif"
+)
+
+
 static_toxicity_path = "https://imagizer.imageshack.com/v2/480x360q70/r/924/L4Ditq.jpg"
 animated_toxicity_path = (
     "https://i.kym-cdn.com/photos/images/original/001/264/967/cdc.gif"
 )
+
 animated_enlighten_path = "https://gifdb.com/images/high/zen-meditation-chakras-illustration-6lujnenasnfmn8dt.gif"
 static_enlighten_path = "https://imagizer.imageshack.com/v2/668x500q70/r/922/bpoy6G.jpg"
+# Toxicity image HTML
+# Enlightenment image HTML
+enlighten_html = f"""
+<div class="text-shadow">
+<a href="text_generator" target="_self">
+    <img src="{static_enlighten_path}" width="400" class="enlighten-image" />
+</a>
+<style>
+    /* Define the hover state for the image */
+    .enlighten-image:hover {{
+        content: url("{animated_enlighten_path}");
+        transform: scale(1.1); /* Enlarge the image by 10% */
+        transition: transform 0.5s ease; /* Add smooth transition */
+    }}
+</style>
+</div>
+"""
+
 
 # Toxicity image HTML
 toxicity_html = f"""
 <div class="text-shadow">
 <a href="review_predictor" target="_self">
-    <img src="{static_toxicity_path}" width="400" class="toxicity-image" />
+    <img src="{static_review_path}" width="400" class="toxicity-image" />
 </a>
 <style>
     /* Define the hover state for the image */
     .toxicity-image:hover {{
-        content: url("{animated_toxicity_path}");
+        content: url("{animated_review_path}");
         transform: scale(1.1); /* Enlarge the image by 10% */
         transition: transform 0.5s ease; /* Add smooth transition */
     }}
@@ -98,16 +123,16 @@ toxicity_html = f"""
 </div>
 """
 
-# Enlightenment image HTML
-enlighten_html = f"""
+# Telegram image HTML
+tg_html = f"""
 <div class="text-shadow">
-<a href="text_generator" target="_self">
-    <img src="{static_enlighten_path}" width="400" class="enlighten-image" />
+<a href="telegram" target="_self">
+    <img src="{static_toxicity_path}" width="400" class="tg-image" />
 </a>
 <style>
     /* Define the hover state for the image */
-    .enlighten-image:hover {{
-        content: url("{animated_enlighten_path}");
+    .tg-image:hover {{
+        content: url("{animated_toxicity_path}");
         transform: scale(1.1); /* Enlarge the image by 10% */
         transition: transform 0.5s ease; /* Add smooth transition */
     }}
@@ -115,6 +140,16 @@ enlighten_html = f"""
 </div>
 """
 
+# Page 2 content
+page_3 = """
+<div class="text-shadow">
+<h1>Toxicity Assessment Bot</h1>
+
+<p class="bigger">Find out how toxic comments are</p>
+</div>
+"""
+
+
 # Add shadow to text content
 text_shadow_style = """
 <style>
@@ -135,4 +170,6 @@ st.markdown(page_1, unsafe_allow_html=True)
 st.markdown(toxicity_html, unsafe_allow_html=True)
 st.markdown(page_2, unsafe_allow_html=True)
 st.markdown(enlighten_html, unsafe_allow_html=True)
+st.markdown(page_3, unsafe_allow_html=True)
+st.markdown(tg_html, unsafe_allow_html=True)
 st.markdown(project_colaborators, unsafe_allow_html=True)