style: standardize header icons and update sidebar navigation labels and icons

This commit is contained in:
sazzadulalambd
2026-05-15 02:37:31 +06:00
parent 16e08c930a
commit dfc69faf48
5 changed files with 25 additions and 20 deletions

View File

@@ -7,7 +7,7 @@ import {
ArrowLeft, TrendingUp, Bike, DollarSign, Calendar,
CreditCard, FileText, Download, Check,
Printer, BarChart3, Wallet, Clock, Shield, Percent, Activity, AlertTriangle,
Receipt, CreditCardIcon, Zap, Smartphone, ChevronRight
Receipt, CreditCardIcon, Zap, Smartphone, ChevronRight, Target
} from 'lucide-react';
import { investors, bikes, transactions } from '@/data/mockData';
import toast from 'react-hot-toast';
@@ -57,7 +57,8 @@ export default function InvestorInvestmentDetailPage({ params }: { params: Promi
</button>
<div>
<div className="flex items-center gap-3">
<h1 className="text-xl lg:text-2xl font-extrabold text-slate-800">{investment.planName}</h1>
<h1 className="text-xl lg:text-2xl font-extrabold text-slate-800 flex items-center gap-2">
<Target className="w-5 h-5 lg:w-6 lg:h-6 text-investor" />{investment.planName}</h1>
<span className={`px-2.5 py-1 rounded-full text-xs font-bold ${style.badge} capitalize`}>
{investment.planType} Plan
</span>

View File

@@ -93,7 +93,8 @@ export default function NewInvestmentPage() {
<ArrowLeft className="w-5 h-5 text-slate-600" />
</button>
<div>
<h1 className="text-xl lg:text-2xl font-extrabold text-slate-800">
<h1 className="text-xl lg:text-2xl font-extrabold text-slate-800 flex items-center gap-2">
<Zap className="w-5 h-5 lg:w-6 lg:h-6 text-investor" />
{step === 'select' ? 'Select Investment Plan' : 'Configure New Investment'}
</h1>
<p className="text-sm text-slate-500">

View File

@@ -10,12 +10,15 @@ export default function MyInvestmentsPage() {
const investor = investors[0]; // mock logged-in investor
return (
<div className="p-4 lg:p-6 max-w-6xl mx-auto mb-20 lg:mb-0">
<div className="p-4 lg:p-6 max-w-8xl mx-auto mb-20 lg:mb-0">
<div className="flex flex-col md:flex-row md:items-center justify-between gap-4 mb-8">
<div>
<h1 className="text-2xl lg:text-3xl font-extrabold text-slate-800 mb-2">My Investments</h1>
<p className="text-slate-500">Manage your active portfolios and track your earnings.</p>
<h1 className="text-xl lg:text-2xl font-bold text-slate-800 flex items-center gap-2">
<Target className="w-5 h-5 lg:w-6 lg:h-6 text-investor" /> My Investments
</h1>
<p className="text-sm text-slate-500 mt-1">Manage your active portfolios and track your earnings.</p>
</div>
<Link
href="/investor/plans/new"
className="inline-flex items-center gap-2 px-6 py-3 bg-investor text-white rounded-xl font-bold shadow-lg shadow-investor/20 hover:bg-investor-dark transition-all transform hover:-translate-y-0.5 active:scale-95"
@@ -101,8 +104,7 @@ export default function MyInvestmentsPage() {
<p className="text-[10px] text-slate-400 font-bold uppercase mt-1">+{inv.expectedRoi}% ROI</p>
</td>
<td className="px-6 py-5">
<span className={`inline-flex items-center gap-1.5 px-2.5 py-1 rounded-lg text-[10px] font-bold uppercase ${
inv.status === 'active' ? 'bg-green-50 text-green-700 border border-green-100' : 'bg-slate-50 text-slate-600 border border-slate-100'
<span className={`inline-flex items-center gap-1.5 px-2.5 py-1 rounded-lg text-[10px] font-bold uppercase ${inv.status === 'active' ? 'bg-green-50 text-green-700 border border-green-100' : 'bg-slate-50 text-slate-600 border border-slate-100'
}`}>
<div className={`w-1.5 h-1.5 rounded-full ${inv.status === 'active' ? 'bg-green-500' : 'bg-slate-400'}`} />
{inv.status}

View File

@@ -111,7 +111,9 @@ export default function InvestorWithdrawPage() {
{/* Header */}
<div className="mb-6 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
<div>
<h1 className="text-xl lg:text-2xl font-bold text-slate-800">Withdraw Funds</h1>
<h1 className="text-xl lg:text-2xl font-bold text-slate-800 flex items-center gap-2">
<CreditCard className="w-5 h-5 lg:w-6 lg:h-6 text-investor" /> Withdraw Funds
</h1>
<p className="text-sm text-slate-500 mt-1">Request withdrawals to your bank or mobile banking accounts</p>
</div>
<button

View File

@@ -23,7 +23,7 @@ import {
LogOut,
Calculator,
Wrench,
Target, User
Target, User, History
} from 'lucide-react';
import { getUserName, getUserRole, logout } from '@/lib/auth';
@@ -65,9 +65,9 @@ const bikerNavItems = [
];
const investorNavItems = [
{ label: 'Dashboard', href: '/investor', icon: BarChart3 },
{ label: 'Dashboard', href: '/investor', icon: Bike },
{ label: 'My Investments', href: '/investor/plans', icon: Target },
{ label: 'Rental History', href: '/investor/rental-history', icon: FileText },
{ label: 'Rental History', href: '/investor/rental-history', icon: History },
{ label: 'Withdraw', href: '/investor/withdraw', icon: CreditCard },
{ label: 'My Profile', href: '/investor/profile', icon: User },
];
@@ -105,9 +105,8 @@ export default function Sidebar() {
{ label: 'Fleet', href: '/admin/fleet', icon: Bike },
{ label: 'Users', href: '/admin/users', icon: Users },
] : isInvestor ? [
{ label: 'Home', href: '/investor', icon: BarChart3 },
{ label: 'Investments', href: '/investor/plans', icon: Target },
{ label: 'History', href: '/investor/rental-history', icon: FileText },
{ label: 'Home', href: '/investor', icon: Bike },
{ label: 'History', href: '/investor/rental-history', icon: History },
{ label: 'Withdraw', href: '/investor/withdraw', icon: CreditCard },
{ label: 'Profile', href: '/investor/profile', icon: User },
] : isShop ? [