File size: 10,928 Bytes
f9f959f
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
import streamlit as st

def main():
    # Main Container
    st.markdown('<div class="main-container">', unsafe_allow_html=True)

    # Custom CSS with Poppins font
    st.markdown("""
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap');

        * {
            font-family: 'Poppins', sans-serif !important;
            box-sizing: border-box;
        }

        .stApp {
            background: #ffffff;
            min-height: 100vh;
            color: #1f2a44;
        }

        #MainMenu {visibility: hidden;}
        footer {visibility: hidden;}
        .stDeployButton {display: none;}
        header {visibility: hidden;}
        .stApp > header {visibility: hidden;}

        /* Main Container */
        .main-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 1rem 2rem;
        }

        /* Header Section */
        .header-section {
            text-align: center;
            margin-bottom: 2.5rem;
            padding: 1.5rem 0;
            background: linear-gradient(135deg, #f4f7fa 0%, #e8f0fe 100%);
            border-radius: 12px;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
        }

        .header-title {
            font-size: 2.25rem;
            font-weight: 700;
            color: #1f2a44;
            margin: 0;
        }

        /* Section Styling */
        .section {
            margin-bottom: 2.5rem;
            max-width: 1200px;
            margin-left: auto;
            margin-right: auto;
            padding: 0 1rem;
        }

        .section-title {
            font-size: 1.5rem;
            font-weight: 600;
            color: #1f2a44;
            margin-bottom: 1rem;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .section-text {
            font-size: 0.95rem;
            color: #6b7280;
            line-height: 1.6;
            max-width: 800px;
            margin: 0 auto;
        }

        .code-block {
            background: #f4f7fa;
            padding: 1.2rem;
            border-radius: 8px;
            font-size: 0.9rem;
            color: #1f2a44;
            margin: 1rem 0;
            overflow-x: auto;
            border-left: 4px solid #6366f1;
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
        }

        .code-block pre {
            margin: 0;
            font-family: 'Poppins', sans-serif;
            white-space: pre-wrap;
            line-height: 1.5;
        }

        .step-list {
            list-style-type: decimal;
            padding-left: 2rem;
            margin: 1rem 0;
        }

        .step-list li {
            margin-bottom: 0.8rem;
            color: #4a5568;
        }

        .highlight {
            color: #2d3748;
            font-weight: 500;
        }

        /* Footer */
        .footer {
            border-top: 1px solid #e5e7eb;
            padding: 2.5rem 0;
            text-align: center;
            max-width: 1200px;
            margin: 2rem auto 0;
            background: linear-gradient(135deg, #e8f0fe 0%, #f8f9fa 100%);
            border-radius: 12px;
            box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
        }

        .footer-content {
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }

        .footer p {
            font-size: 0.9rem;
            color: #4b5eaa;
            font-weight: 600;
            margin: 0;
        }

        .footer a {
            color: #3b82f6;
            text-decoration: none;
            transition: color 0.3s ease;
        }

        .footer a:hover {
            color: #1e40af;
            text-decoration: underline;
        }

        .footer .social-links {
            display: flex;
            justify-content: center;
            gap: 1.5rem;
            margin-top: 1rem;
        }

        .footer .social-links a {
            font-size: 1.2rem;
            color: #4b5eaa;
            transition: color 0.3s ease;
        }

        .footer .social-links a:hover {
            color: #3b82f6;
        }

        /* Responsive Design */
        @media (max-width: 1024px) {
            .main-container {
                padding: 1rem;
            }
            .section {
                padding: 0 0.5rem;
            }
        }

        @media (max-width: 768px) {
            .header-title {
                font-size: 1.75rem;
            }
            .section-title {
                font-size: 1.25rem;
            }
            .section-text {
                font-size: 0.9rem;
            }
            .code-block {
                font-size: 0.85rem;
            }
        }

        @media (max-width: 480px) {
            .header-title {
                font-size: 1.5rem;
            }
            .section-title {
                font-size: 1.1rem;
            }
            .section-text {
                font-size: 0.85rem;
            }
            .code-block {
                font-size: 0.8rem;
            }
            .footer-content {
                gap: 0.5rem;
            }
        }
    </style>
    """, unsafe_allow_html=True)

    # Header Section
  
    st.markdown('<h1 class="header-title">🌐 TruthCheck - Open Source</h1>', unsafe_allow_html=True)
    st.markdown('</div>', unsafe_allow_html=True)

    # Open Source Initiative
    st.markdown('<div class="section">', unsafe_allow_html=True)
    st.markdown('<h2 class="section-title">ℹ️ Open Source Vision</h2>', unsafe_allow_html=True)
    st.markdown('<p class="section-text">TruthCheck is an open-source powerhouse dedicated to combating misinformation with cutting-edge AI. We warmly invite innovators, developers, and data enthusiasts worldwide to join us. Your expertise can elevate our hybrid BERT-BiLSTM model, expand its reach, and redefine digital trust—together, we can make a lasting impact!</p>', unsafe_allow_html=True)
    st.markdown('</div>', unsafe_allow_html=True)

    # Getting Started
    st.markdown('<div class="section">', unsafe_allow_html=True)
    st.markdown('<h2 class="section-title">🚀 Get Started Now</h2>', unsafe_allow_html=True)
    st.markdown('<p class="section-text">Dive into TruthCheck by cloning and running it locally from our Hugging Face repository. Follow these steps to begin your journey:</p>', unsafe_allow_html=True)
    st.markdown('<ol class="step-list">', unsafe_allow_html=True)
    st.markdown('<li><span class="highlight">Clone the Repository:</span> Secure the codebase with this command:</li>', unsafe_allow_html=True)
    st.markdown('<div class="code-block"><pre>git clone https://huggingface.co/spaces/adnaan05/TruthCheck</pre></div>', unsafe_allow_html=True)
    st.markdown('<li><span class="highlight">Navigate to Directory:</span> Enter the project folder:</li>', unsafe_allow_html=True)
    st.markdown('<div class="code-block"><pre>cd TruthCheck</pre></div>', unsafe_allow_html=True)
    st.markdown('<li><span class="highlight">Install Dependencies:</span> Set up the environment with:</li>', unsafe_allow_html=True)
    st.markdown('<div class="code-block"><pre>pip install -r requirements.txt</pre></div>', unsafe_allow_html=True)
    st.markdown('<li><span class="highlight">Launch the App:</span> Start the application with:</li>', unsafe_allow_html=True)
    st.markdown('<div class="code-block"><pre>streamlit run app.py</pre></div>', unsafe_allow_html=True)
    st.markdown('</ol>', unsafe_allow_html=True)
    st.markdown('<p class="section-text">Explore the full codebase and details on our <a href="https://huggingface.co/spaces/adnaan05/TruthCheck" target="_blank">Hugging Face page</a>.</p>', unsafe_allow_html=True)
    st.markdown('</div>', unsafe_allow_html=True)

    # Contributing via Pull Requests
    st.markdown('<div class="section">', unsafe_allow_html=True)
    st.markdown('<h2 class="section-title">🤝 Contribute with Pull Requests</h2>', unsafe_allow_html=True)
    st.markdown('<p class="section-text">Your contributions shape TruthCheck’s future. Here’s how to submit a pull request on Hugging Face:</p>', unsafe_allow_html=True)
    st.markdown('<ol class="step-list">', unsafe_allow_html=True)
    st.markdown('<li><span class="highlight">Fork the Repository:</span> Create your own copy at <a href="https://huggingface.co/spaces/adnaan05/TruthCheck" target="_blank">https://huggingface.co/spaces/adnaan05/TruthCheck</a>.</li>', unsafe_allow_html=True)
    st.markdown('<li><span class="highlight">Clone Your Fork:</span> Download it locally:</li>', unsafe_allow_html=True)
    st.markdown('<div class="code-block"><pre>git clone https://huggingface.co/spaces/your-username/TruthCheck</pre></div>', unsafe_allow_html=True)
    st.markdown('<li><span class="highlight">Create a Branch:</span> Start your work with:</li>', unsafe_allow_html=True)
    st.markdown('<div class="code-block"><pre>git checkout -b feature/your-feature-name</pre></div>', unsafe_allow_html=True)
    st.markdown('<li><span class="highlight">Make Changes:</span> Implement your improvements and commit:</li>', unsafe_allow_html=True)
    st.markdown('<div class="code-block"><pre>git add .\ngit commit -m "Add your detailed message here"</pre></div>', unsafe_allow_html=True)
    st.markdown('<li><span class="highlight">Push to Your Fork:</span> Upload your branch:</li>', unsafe_allow_html=True)
    st.markdown('<div class="code-block"><pre>git push origin feature/your-feature-name</pre></div>', unsafe_allow_html=True)
    st.markdown('<li><span class="highlight">Open a Pull Request:</span> Submit via the Hugging Face interface, detailing your changes and linking to issues.</li>', unsafe_allow_html=True)
    st.markdown('</ol>', unsafe_allow_html=True)
    st.markdown('<p class="section-text">Join discussions and find tasks on the <a href="https://huggingface.co/spaces/adnaan05/TruthCheck/discussions" target="_blank">community tab</a>.</p>', unsafe_allow_html=True)
    st.markdown('</div>', unsafe_allow_html=True)

    # Why Contribute
    st.markdown('<div class="section">', unsafe_allow_html=True)
    st.markdown('<h2 class="section-title">🌍 Why Contribute?</h2>', unsafe_allow_html=True)
    st.markdown('<p class="section-text">Contributing to TruthCheck means joining a global mission to empower truth. Enhance our AI with new datasets, add multilingual capabilities, or refine the UI—your input drives progress. Let’s build a trustworthy digital future together!</p>', unsafe_allow_html=True)
    st.markdown('</div>', unsafe_allow_html=True)

    # Footer
    st.markdown("---")
    st.markdown(
        '<p style="text-align: center; font-weight: 600; font-size: 16px;">💻 Developed with ❤️ using Streamlit | © 2025</p>',
        unsafe_allow_html=True
    )

    st.markdown('</div>', unsafe_allow_html=True)  # Close main-container

if __name__ == "__main__":
    main()