Skip to content

Restricted New Users from Dashboard Access #265

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
ShraddhaBhujbal11 wants to merge 3 commits into
base: main
Choose a base branch
from
Open

Restricted New Users from Dashboard Access #265

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
f45e36e
About page enhanced
ShraddhaBhujbal11 Aug 23, 2025
75587b0
Small Update
ShraddhaBhujbal11 Aug 23, 2025
03aff25
Restricted New Users from Dashboard Access
ShraddhaBhujbal11 Aug 23, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
172 changes: 149 additions & 23 deletions src/components/AboutPage.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,29 +1,59 @@
import React, { useState, useEffect } from 'react';
import { Link } from 'react-router-dom';
import { ArrowLeft, User, Mail } from 'lucide-react';
import Footer from './Footer';
import { ArrowLeft, User, Mail, Sparkles, LineChart, BarChart3, Star } from 'lucide-react';
import Footer from './Footer';

const AboutPage = () => {
const [isVisible, setIsVisible] = useState(false);

useEffect(() => {
const timer = setTimeout(() => {
setIsVisible(true);
}, 10);
return () => clearTimeout(timer);
}, []);
}, 10);
return () => clearTimeout(timer);
}, []);

const testimonials = [
{
text: "SmartLog has completely changed how I see my money. The visuals are amazing and make budgeting feel effortless!",
author: "Priya S.",
},
{
text: "I love the simplicity and clean design. Tracking expenses has never been this easy.",
author: "Amit K.",
},
{
text: "The insights are a game-changer. I finally feel in control of my finances. Highly recommend!",
author: "Neha R.",
},
];

const faqs = [
{
question: "Is SmartLog free to use?",
answer: "SmartLog offers a powerful free tier that includes all core features. We also have premium plans for advanced analytics and features.",
},
{
question: "Is my financial data secure?",
answer: "Yes, your data is our top priority. We use industry-standard encryption and security protocols to ensure your information is always safe.",
},
{
question: "Can I sync with my bank account?",
answer: "Currently, SmartLog supports manual expense tracking. We are working on adding secure bank synchronization in a future update.",
},
];

return (
<div className={`min-h-screen flex flex-col transition-colors duration-300 bg-gradient-to-br from-slate-50 via-blue-50 to-purple-50 text-gray-900
}`}>
<div className={`min-h-screen flex flex-col transition-colors duration-300 bg-gradient-to-br from-slate-50 via-blue-50 to-purple-50 text-gray-900`}>
<main className="flex-1 w-full p-6 flex items-center justify-center">
<div className="max-w-4xl w-full">

<div
className={`p-8 md:p-12 rounded-2xl shadow-2xl border transition-all duration-1000 bg-white/70 border-gray-200 backdrop-blur-sm
} ${isVisible ? 'opacity-100 translate-y-0' : 'opacity-0 translate-y-8'}`}
${isVisible ? 'opacity-100 translate-y-0' : 'opacity-0 translate-y-8'}`}
>

{/* Main Title */}
<h1
className={`text-4xl text-center font-black bg-gradient-to-r from-blue-600 via-purple-600 to-pink-600 bg-clip-text text-transparent mb-6 transition-all duration-1000 ${
isVisible ? 'opacity-100 translate-y-0' : 'opacity-0 -translate-y-4'
Expand All @@ -33,45 +63,141 @@ const AboutPage = () => {
About SmartLog
</h1>

{/* Introduction */}
<p
className={`text-lg text-center mb-8 transition-all duration-100 ${isVisible ? 'opacity-100 translate-y-0' : 'opacity-0 -translate-y-4'}`}
style={{ transitionDelay: '400ms' }}
>
SmartLog is a modern, intuitive application designed to help you effortlessly track your expenses and manage your finances. Our goal is to provide a clean, simple, and powerful tool that gives you clear insights into your spending habits.
SmartLog is a modern, intuitive application designed to help you effortlessly track your expenses and manage your finances. We believe that **financial wellness should be accessible to everyone**, and our goal is to provide a clean, simple, and powerful tool that gives you clear insights into your spending habits.
</p>

<div
className={`border-t my-8 transition-all duration-1000 ${isVisible ? 'opacity-100' : 'opacity-0'}`}
className={`border-t border-gray-200 my-8 transition-all duration-1000 ${isVisible ? 'opacity-100' : 'opacity-0'}`}
style={{ transitionDelay: '600ms' }}
></div>

{/* Core Philosophy Section */}
<div
className={`transition-all duration-1000 ${isVisible ? 'opacity-100 translate-y-0' : 'opacity-0 translate-y-4'}`}
style={{ transitionDelay: '800ms' }}
style={{ transitionDelay: '700ms' }}
>
<h2 className="text-2xl font-bold text-center mb-6">Developer Details</h2>
<div className={`flex flex-col sm:flex-row justify-center items-center gap-6 text-gray-700`}>
<div className="flex items-center gap-3">
<User className="w-5 h-5 text-purple-400" />
<span>Tanmay Kalra</span>
<h2 className="text-2xl font-bold text-center mb-6 text-purple-600">Our Core Philosophy</h2>
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 text-gray-700">

<div className="flex flex-col items-center text-center p-4 rounded-lg bg-gray-100/50">
<Sparkles className="w-10 h-10 text-blue-500 mb-3" />
<h3 className="font-semibold text-lg mb-1">Simplicity</h3>
<p className="text-sm">We've built SmartLog to be intuitive and easy to use, so you can focus on what matters.</p>
</div>
<div className="flex items-center gap-3">
<Mail className="w-5 h-5 text-purple-400" />
<span>tanmaykalra0910@gmail.com</span>

<div className="flex flex-col items-center text-center p-4 rounded-lg bg-gray-100/50">
<LineChart className="w-10 h-10 text-purple-500 mb-3" />
<h3 className="font-semibold text-lg mb-1">Clarity</h3>
<p className="text-sm">Get clear, actionable insights through beautiful visualizations and smart analytics.</p>
</div>

<div className="flex flex-col items-center text-center p-4 rounded-lg bg-gray-100/50">
<BarChart3 className="w-10 h-10 text-pink-500 mb-3" />
<h3 className="font-semibold text-lg mb-1">Empowerment</h3>
<p className="text-sm">Our tools help you set goals and track progress to take full control of your finances.</p>
</div>

</div>
</div>

<div
className={`text-center mt-12 transition-all duration-1000 ${isVisible ? 'opacity-100' : 'opacity-0'}`}
className={`border-t border-gray-200 my-8 transition-all duration-1000 ${isVisible ? 'opacity-100' : 'opacity-0'}`}
style={{ transitionDelay: '1000ms' }}
></div>

{/* Testimonials Section */}
<div
className={`transition-all duration-1000 ${isVisible ? 'opacity-100 translate-y-0' : 'opacity-0 translate-y-4'}`}
style={{ transitionDelay: '1200ms' }}
>
<h2 className="text-2xl font-bold text-center mb-6 text-blue-600">What Our Users Say</h2>
<div className="grid grid-cols-1 sm:grid-cols-3 gap-6 text-gray-700">
{testimonials.map((testimonial, index) => (
<div key={index} className="bg-gray-100/50 p-6 rounded-xl shadow-inner">
<div className="flex items-center mb-2">
{[...Array(5)].map((_, i) => (
<Star key={i} className="w-4 h-4 text-yellow-400 fill-current" />
))}
</div>
<p className="italic text-sm mb-3">"{testimonial.text}"</p>
<p className="font-semibold text-sm">- {testimonial.author}</p>
</div>
))}
</div>
</div>

<div
className={`border-t border-gray-200 my-8 transition-all duration-1000 ${isVisible ? 'opacity-100' : 'opacity-0'}`}
style={{ transitionDelay: '1400ms' }}
></div>

{/* FAQ Section */}
<div
className={`transition-all duration-1000 ${isVisible ? 'opacity-100 translate-y-0' : 'opacity-0 translate-y-4'}`}
style={{ transitionDelay: '1600ms' }}
>
<h2 className="text-2xl font-bold text-center mb-6 text-purple-600">Frequently Asked Questions</h2>
<div className="space-y-4 text-gray-700">
{faqs.map((faq, index) => (
<div key={index} className="p-4 rounded-lg bg-gray-100/50">
<h3 className="font-bold text-md mb-1">{faq.question}</h3>
<p className="text-sm">{faq.answer}</p>
</div>
))}
</div>
</div>

<div
className={`border-t border-gray-200 my-8 transition-all duration-1000 ${isVisible ? 'opacity-100' : 'opacity-0'}`}
style={{ transitionDelay: '1800ms' }}
></div>

{/* Developer Details */}
<div
className={`transition-all duration-1000 ${isVisible ? 'opacity-100 translate-y-0' : 'opacity-0 translate-y-4'}`}
style={{ transitionDelay: '2000ms' }}
>
<h2
className="text-2xl font-bold text-center mb-6 bg-gradient-to-r from-blue-600 via-purple-600 to-pink-600 bg-clip-text text-transparent"
>
Meet the Developer
</h2>
<div className={`flex flex-col items-center gap-4 text-gray-700`}>
<p className="text-center max-w-2xl mx-auto">
SmartLog was created with a passion for building effective tools that simplify everyday tasks. Your feedback is invaluable, so please don't hesitate to reach out with any questions or suggestions.
</p>
<div className="flex flex-col sm:flex-row justify-center items-center gap-6 mt-4">
<div className="flex items-center gap-3">
<User className="w-5 h-5 text-purple-400" />
<span>Tanmay Kalra</span>
</div>
<div className="flex items-center gap-3">
<Mail className="w-5 h-5 text-purple-400" />
<a href="mailto:tanmaykalra0910@gmail.com" className="hover:underline">tanmaykalra0910@gmail.com</a>
</div>
</div>
</div>
</div>

{/* Back Button */}
<div
className={`text-center mt-12 transition-all duration-1000 ${isVisible ? 'opacity-100' : 'opacity-0'}`}
style={{ transitionDelay: '2200ms' }}
>
<Link
to="/dashboard"
className={`inline-flex items-center gap-2 px-6 py-3 rounded-lg transition-colors duration-200 text-sm font-semibold bg-gray-200 text-gray-700 hover:bg-gray-300`}
to="/login"
className={`inline-flex items-center gap-2 px-8 py-4 rounded-lg transition-all duration-300 text-sm font-semibold text-white
bg-gradient-to-r from-purple-500 to-pink-500
hover:from-purple-600 hover:to-pink-600
hover:shadow-lg hover:scale-105`}
>
<ArrowLeft size={16} />
Back to Dashboard
Want to start the journey
</Link>
</div>
</div>
Expand Down
5 changes: 3 additions & 2 deletions src/components/HomePage.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,8 @@ export default function HomePage() {
}
}, [darkMode]);

const handleGetStarted = () => navigate('/dashboard');
// Corrected function to navigate to the signup page for new users
const handleGetStarted = () => navigate('/signup');

const cardVariants = {
initial: { opacity: 0, y: 80, scale: 0.9 },
Expand Down Expand Up @@ -218,4 +219,4 @@ export default function HomePage() {
<Footer />
</div>
);
}
}