feat(pages): add profile page

fix(ui): fix minor ui bugs on some pages
This commit is contained in:
shafin-r
2026-01-19 14:06:05 +06:00
parent d208a9336f
commit d5a39add17
11 changed files with 154 additions and 116 deletions

View File

@ -1,25 +1,7 @@
import { Outlet, NavLink, useNavigate } from "react-router-dom";
import {
Home,
BookOpen,
TrendingUp,
Award,
User,
Menu,
Video,
} from "lucide-react";
import { useAuthStore } from "../../stores/authStore";
import { Outlet, NavLink } from "react-router-dom";
import { Home, BookOpen, Award, User, Video } from "lucide-react";
export function StudentLayout() {
// const user = useAuthStore((state) => state.user);
const logout = useAuthStore((state) => state.logout);
const navigate = useNavigate();
const handleLogout = () => {
logout();
navigate("/login");
};
const navItems = [
{ to: "/student/home", icon: Home, label: "Home" },
{ to: "/student/drills", icon: BookOpen, label: "Drills" },
@ -30,38 +12,13 @@ export function StudentLayout() {
return (
<div className="flex flex-col min-h-screen bg-gray-50">
{/* Top Header */}
{/* <header className="bg-white shadow-sm sticky top-0 z-10">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex justify-between items-center h-22">
<div className="flex items-center gap-3">
<img
src="../../src/assets/ed_logo.png"
alt="EdBridge logo"
className="h-10 w-auto object-contain"
draggable={false}
/>
</div>
<button
onClick={handleLogout}
className="flex items-center gap-2 text-slate-600 hover:text-slate-700 transition px-3 py-2 rounded-lg hover:bg-red-50"
>
<Menu size={22} />
<span className="text-sm font-medium hidden sm:inline">
Logout
</span>
</button>
</div>
</div>
</header> */}
{/* Main Content */}
<main className="flex-1 pb-20 overflow-y-auto">
<Outlet />
</main>
{/* Bottom Tab Navigation */}
<nav className="fixed bottom-0 left-0 right-0 bg-white border-t border-gray-200 shadow-lg z-20">
<nav className="fixed rounded-t-4xl pt-2 bottom-0 left-0 right-0 bg-white border-t border-gray-200 shadow-4xl z-20">
<div className="max-w-7xl mx-auto px-2">
<div className="flex justify-around items-center">
{navItems.map((item) => (
@ -69,9 +26,9 @@ export function StudentLayout() {
key={item.to}
to={item.to}
className={({ isActive }) =>
`flex flex-col items-center justify-center py-3 px-4 flex-1 transition-all duration-200 ${
`flex flex-col items-center justify-center py-3 px-4 flex-1 transition-all duration-200 font-satoshi tracking-wide ${
isActive
? "text-indigo-600"
? "text-purple-600"
: "text-gray-500 hover:text-gray-700"
}`
}