diff --git a/app.py b/app.py index a0fe604..b93a847 100644 --- a/app.py +++ b/app.py @@ -57,6 +57,15 @@ def home(): def dashboard(): return render_template('dashboard.html') +@app.route('/about') +def about(): + return render_template('about.html') + +@app.route('/contact') +def contact(): + return render_template('contact.html') + + def index(): """Main route with language detection""" diff --git a/static/images/contact-side.jpg b/static/images/contact-side.jpg new file mode 100644 index 0000000..286c68d Binary files /dev/null and b/static/images/contact-side.jpg differ diff --git a/static/style.css b/static/style.css index 3243529..f33c1e6 100644 --- a/static/style.css +++ b/static/style.css @@ -1403,3 +1403,186 @@ body.dark .summary-box p { color: var(--text-secondary-dark); } transform: none !important; /* remove overlapping translation */ margin-top: 0; /* spacing handled by gap */ } + +/*About us*/ +.about-card { + background: var(--card-light); + border-radius: 1.5rem; + box-shadow: var(--shadow-light); + padding: 2rem; + margin: 3rem auto; + max-width: 900px; + backdrop-filter: blur(10px); + border: 1px solid rgba(255, 255, 255, 0.2); +} +body.dark .about-card { + background: var(--card-dark); + box-shadow: var(--shadow-dark); + border-color: rgba(255, 255, 255, 0.1); +} + +.about-card h2 { + color: #6c5ce7; + font-size: 2rem; + font-weight: 800; + text-align: center; + margin-bottom: 1.5rem; +} +.about-card h3 { + color: var(--text-primary-light); + font-size: 1.25rem; + margin-top: 1.5rem; +} +.about-card p { + color: var(--text-secondary-light); + line-height: 1.6; + font-size: 1rem; +} + +.about-card { + background: var(--card-light); + border-radius: 1.5rem; + box-shadow: var(--shadow-light); + padding: 2rem; + margin: 3rem auto; + max-width: 900px; + backdrop-filter: blur(10px); + border: 1px solid rgba(255, 255, 255, 0.2); +} +body.dark .about-card { + background: var(--card-dark); + box-shadow: var(--shadow-dark); + border-color: rgba(255, 255, 255, 0.1); +} + +.about-card h2 { + color: #6c5ce7; + font-size: 2rem; + font-weight: 800; + text-align: center; + margin-bottom: 1.5rem; +} +.about-card h3 { + color: var(--text-primary-light); + font-size: 1.25rem; + margin-top: 1.5rem; +} +.about-card p { + color: var(--text-secondary-light); + line-height: 1.6; + font-size: 1rem; +} + +/*Contact us*/ + +.contact-section { + display: flex; + justify-content: center; + align-items: center; + padding: 3rem 2rem; +} + +.contact-container { + display: grid; + grid-template-columns: 1.2fr 1fr; + gap: 2rem; + max-width: 1000px; + width: 100%; + background: white; + border-radius: 1.5rem; + padding: 2rem; + box-shadow: var(--shadow-light); + backdrop-filter: blur(10px); +} + +.contact-form-box h1 { + color: #6c5ce7; + font-size: 2rem; + font-weight: 800; + margin-bottom: 1rem; +} + +.contact-form-box p { + color: var(--text-secondary-light); + margin-bottom: 1.5rem; +} + +.contact-form .form-group { + margin-bottom: 1.25rem; +} + +.contact-form label { + display: block; + font-weight: 400; + margin-bottom: 0.5rem; + color: var(--text-primary-light); +} + +.contact-form input, +.contact-form textarea { + width: 100%; + padding: 0.75rem; + border-radius: 0.5rem; + border: 2px solid var(--border-light); + font-size: 0.95rem; + background: rgba(255, 255, 255, 0.85); + color: var(--text-primary-light); +} + +.contact-form input:focus, +.contact-form textarea:focus { + outline: none; + border-color: #6c5ce7; +} + +.submit-btn { + background-color: #6c5ce7; + color: #fff; + padding: 0.75rem 1.25rem; + border: none; + border-radius: 0.5rem; + font-weight: 600; + cursor: pointer; + transition: 0.2s; +} + +.submit-btn:hover { + background-color: #5848c2; +} + +.github-btn { + display: inline-flex; + align-items: center; + gap: 0.5rem; + margin-top: 1.5rem; + color: #24292e; + background-color: #f6f8fa; + border: 1px solid #d0d7de; + padding: 0.5rem 1rem; + border-radius: 0.5rem; + text-decoration: none; + font-weight: 600; + transition: 0.2s; +} + +.github-btn:hover { + background-color: #eaeef2; +} + +.contact-image img { + width: 100%; + height: 100%; + object-fit: cover; + border-radius: 1rem; + box-shadow: var(--shadow-light); +} + +@media (max-width: 768px) { + .contact-container { + grid-template-columns: 1fr; + } + .contact-image { + display: none; + } +} + diff --git a/templates/about.html b/templates/about.html new file mode 100644 index 0000000..190d4c3 --- /dev/null +++ b/templates/about.html @@ -0,0 +1,204 @@ + + + + + + About Us - Quick Fact Checker + + + + + + + + +
+
+

About Quick Fact Checker

+

+ QuickFactChecker is a machine learningโ€“based web app that helps detect whether a news article is real or fake. It uses different models (e.g., Naive Bayes, LSTM) trained on the LIAR dataset to evaluate credibility and assist users in identifying potentially misleading information.
+ This project is now an official part of GirlScript Summer of Code โ€“ GSSoC'25!
+ ๐Ÿ’ป We're thrilled to welcome contributors from all over India and beyond to collaborate, build, and grow QuickFactChecker!
+ Letโ€™s make learning and career development smarter โ€“ together! ๐ŸŒŸ
+ + ๐Ÿ‘ฉโ€๐Ÿ’ป GSSoC is one of Indiaโ€™s largest 3-month-long open-source programs that encourages developers of all levels to contribute to real-world projects ๐ŸŒ while learning, collaborating, and growing together. ๐ŸŒฑ
+ + ๐ŸŒˆ With mentorship, community support, and collaborative coding, it's the perfect platform for developers to:
+ + โœจ Improve their skills
+ ๐Ÿค Contribute to impactful projects
+ ๐Ÿ† Get recognized for their work
+ ๐Ÿ“œ Receive certificates and swag!
+

+ +

Our Mission

+

+ We aim to empower individuals to make informed decisions in an era of rapid information sharing. +

+ +

Features

+

+ โœ… Fake news classification using ML models (Naive Bayes, Logistic Regression, Random Forest, and LSTM).
+ โœ… Interactive web app built with Flask and HTML templates.
+ โœ… Automated NLTK Setup to prevent missing resource errors.
+ โœ… Preprocessed dataset included (train.tsv, test.tsv, valid.tsv).
+ โœ… Notebooks for data analysis & experimentation (liar-data-analysis.ipynb, dataset.ipynb).
+ โœ… Easy setup with requirements.txt.
+

+
+
+ + + + + + + + + + + + + diff --git a/templates/contact.html b/templates/contact.html new file mode 100644 index 0000000..c23b8e1 --- /dev/null +++ b/templates/contact.html @@ -0,0 +1,203 @@ + + + + + + About Us - Quick Fact Checker + + + + + + + + +
+
+
+
+

Contact Us

+

Weโ€™d love to hear from you! Please share your feedback, ideas, or questions.

+ +
+
+ + +
+ +
+ + +
+ + +
+
+ + + + + View Us on GitHub + +
+
+ +
+ Contact illustration +
+
+
+ + + + + + + + + + + + diff --git a/templates/dashboard.html b/templates/dashboard.html index fd50110..8356059 100644 --- a/templates/dashboard.html +++ b/templates/dashboard.html @@ -30,7 +30,7 @@