Update src/terms_of_use.py

src/terms_of_use.py

@@ -1,44 +1,126 @@
 import streamlit as st
 
 def main():
+    # Custom CSS for Terms of Use page
     st.markdown("""
-    <div class="hero-section">
-        <div style="display: flex; align-items: center; gap: 2rem;">
-            <div style="flex: 1;">
-                <h1 style="font-size: 2.5rem; color: #333333;">Terms of Use</h1>
-                <p style="font-size: 1.2rem; color: #666666;">
-                    Guidelines for using the TrueCheck platform responsibly.
-                </p>
-            </div>
-            <div style="flex: 1;">
-                <img src="https://img.freepik.com/free-vector/terms-conditions-concept-illustration_114360-1353.jpg" style="width: 100%; border-radius: 12px;" alt="Terms of Use">
-            </div>
+    <style>
+        @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap');
+
+        .stApp {
+            font-family: 'Poppins', sans-serif;
+            background: #f8fafc;
+            min-height: 100vh;
+            color: #1a202c;
+        }
+
+        #MainMenu {visibility: visible;}
+        footer {visibility: hidden;}
+        .stDeployButton {display: none;}
+        header {visibility: hidden;}
+        .stApp > header {visibility: hidden;}
+
+        .container {
+            max-width: 1200px;
+            margin: 0 auto;
+            padding: 1.5rem;
+        }
+
+        .header {
+            padding: 1.5rem 0;
+            text-align: center;
+        }
+
+        .header-title {
+            font-size: 2.5rem;
+            font-weight: 700;
+            color: #1a202c;
+            display: inline-flex;
+            align-items: center;
+            gap: 0.5rem;
+        }
+
+        .section {
+            margin-bottom: 2rem;
+        }
+
+        .section-title {
+            font-size: 2rem;
+            font-weight: 600;
+            color: #1a202c;
+            margin-bottom: 0.5rem;
+            display: flex;
+            align-items: center;
+            gap: 0.5rem;
+        }
+
+        .section-text {
+            font-size: 1.1rem;
+            color: #4a5568;
+            line-height: 1.5;
+            max-width: 800px;
+            margin: 0 auto;
+        }
+
+        .stSidebar {
+            background: #ffffff;
+            border-right: 1px solid #e5e7eb;
+        }
+
+        .stSidebar .sidebar-content {
+            padding: 1rem;
+        }
+    </style>
+    """, unsafe_allow_html=True)
+
+
+    # Header
+    st.markdown("""
+    <div class="header">
+        <div class="container">
+            <h1 class="header-title">🛡️ TruthCheck</h1>
         </div>
     </div>
     """, unsafe_allow_html=True)
 
-    st.markdown("### Terms of Use")
+    # Terms of Use Content
     st.markdown("""
-    <div style="background-color: #F4F7FA; padding: 1rem; border-radius: 8px;">
-        <h3 style="color: #333333;">1. Acceptance of Terms</h3>
-        <p style="color: #666666;">
-            By accessing TrueCheck, you agree to be bound by these Terms of Use. If you do not agree, please do not use the platform.
-        </p>
-        
-        <h3 style="color: #333333;">2. Use of Service</h3>
-        <p style="color: #666666;">
-            TrueCheck is provided for personal, non-commercial use to analyze news articles. You may not use the service for illegal purposes.
-        </p>
-        
-        <h3 style="color: #333333;">3. Limitation of Liability</h3>
-        <p style="color: #666666;">
-            TrueCheck is provided "as is" without warranties. We are not liable for any damages arising from the use of this service.
-        </p>
-        
-        <h3 style="color: #333333;">4. Changes to Terms</h3>
-        <p style="color: #666666;">
-            We may update these terms periodically. Continued use of the platform constitutes acceptance of the updated terms.
-        </p>
+    <div class="container">
+        <div class="section">
+            <h2 class="section-title">📋 Terms of Use</h2>
+            <p class="section-text">
+                Welcome to TruthCheck. By using our platform, you agree to the following terms and conditions.
+            </p>
+        </div>
+        <div class="section">
+            <h3 class="section-title">⚖️ Acceptance of Terms</h3>
+            <p class="section-text">
+                By accessing or using TruthCheck, you agree to be bound by these Terms of Use. If you do not agree, please do not use our services.
+            </p>
+        </div>
+        <div class="section">
+            <h3 class="section-title">🔍 Use of Service</h3>
+            <p class="section-text">
+                TruthCheck provides an AI-powered tool for detecting fake news. You may use the service for personal, non-commercial purposes. You agree not to misuse the platform or attempt to interfere with its functionality.
+            </p>
+        </div>
+        <div class="section">
+            <h3 class="section-title">📜 Intellectual Property</h3>
+            <p class="section-text">
+                All content, including text, graphics, and code, is the property of TruthCheck or its licensors. Unauthorized use or reproduction is prohibited.
+            </p>
+        </div>
+        <div class="section">
+            <h3 class="section-title">🚫 Limitation of Liability</h3>
+            <p class="section-text">
+                TruthCheck is provided "as is" without warranties. We are not liable for any damages arising from the use of our service, including inaccuracies in fake news detection.
+            </p>
+        </div>
+        <div class="section">
+            <h3 class="section-title">🔄 Modifications</h3>
+            <p class="section-text">
+                We may update these Terms of Use at any time. Continued use of TruthCheck after changes constitutes acceptance of the new terms.
+            </p>
+        </div>
     </div>
     """, unsafe_allow_html=True)