mirror of
https://github.com/R0m1k3/Regisflow.git
synced 2026-10-11 17:29:48 +02:00
Modernize the user interface with a cleaner and more professional design
Refactors UI components to implement a modern, angular design with updated color scheme and styling in `NewSaleForm.tsx`, `Dashboard.tsx`, `Login.tsx` and `index.css`. Replit-Commit-Author: Agent Replit-Commit-Session-Id: dec54137-d5a2-4406-8ad4-5f2f9fb110bf Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/0715008c-7244-40f4-befc-26c014852236/6a7de82e-d1f1-4ccf-baa2-a2d2d7172ac9.jpg
This commit is contained in:
michaelschal committed
1 parent
24386f2a60
commit
1821f4feff
5 files changed
+141
-78
No files matched your search
@@ -166,10 +166,10 @@ export default function NewSaleForm() {
|
||||
<Form {...form}>
|
||||
<form onSubmit={form.handleSubmit(onSubmit)} className="mobile-form-responsive">
|
||||
{/* Seller Information */}
|
||||
<div className="modern-card bg-muted bg-opacity-30 mobile-form-section rounded-xl border-l-4 border-primary">
|
||||
<h3 className="mobile-header-responsive font-semibold text-foreground mb-4 sm:mb-6 flex items-center gap-3">
|
||||
<div className="w-8 h-8 sm:w-10 sm:h-10 bg-primary rounded-lg flex items-center justify-center shadow-sm">
|
||||
<User className="h-4 w-4 sm:h-5 sm:w-5 text-white" />
|
||||
<div className="bg-muted border border-border mobile-form-section border-l-4 border-l-primary">
|
||||
<h3 className="font-semibold text-foreground mb-6 flex items-center gap-3">
|
||||
<div className="w-10 h-10 bg-primary text-primary-foreground flex items-center justify-center">
|
||||
<User className="h-5 w-5" />
|
||||
</div>
|
||||
<span className="truncate">Informations Vendeur</span>
|
||||
</h3>
|
||||
@@ -204,10 +204,10 @@ export default function NewSaleForm() {
|
||||
</div>
|
||||
|
||||
{/* Product Information */}
|
||||
<div className="modern-card bg-blue-50 bg-opacity-50 mobile-form-section rounded-xl border-l-4 border-blue-500">
|
||||
<h3 className="mobile-header-responsive font-semibold text-foreground mb-4 sm:mb-6 flex items-center gap-3">
|
||||
<div className="w-8 h-8 sm:w-10 sm:h-10 bg-blue-500 rounded-lg flex items-center justify-center shadow-sm">
|
||||
<Package className="h-4 w-4 sm:h-5 sm:w-5 text-white" />
|
||||
<div className="bg-blue-50 border border-border mobile-form-section border-l-4 border-l-blue-500">
|
||||
<h3 className="font-semibold text-foreground mb-6 flex items-center gap-3">
|
||||
<div className="w-10 h-10 bg-blue-500 text-white flex items-center justify-center">
|
||||
<Package className="h-5 w-5" />
|
||||
</div>
|
||||
<span className="truncate">Informations Produit</span>
|
||||
</h3>
|
||||
@@ -306,10 +306,10 @@ export default function NewSaleForm() {
|
||||
</div>
|
||||
|
||||
{/* Customer Information */}
|
||||
<div className="modern-card bg-emerald-50 bg-opacity-50 mobile-form-section rounded-xl border-l-4 border-emerald-500">
|
||||
<h3 className="mobile-header-responsive font-semibold text-foreground mb-4 sm:mb-6 flex items-center gap-3">
|
||||
<div className="w-8 h-8 sm:w-10 sm:h-10 bg-emerald-500 rounded-lg flex items-center justify-center shadow-sm">
|
||||
<Users className="h-4 w-4 sm:h-5 sm:w-5 text-white" />
|
||||
<div className="bg-emerald-50 border border-border mobile-form-section border-l-4 border-l-emerald-500">
|
||||
<h3 className="font-semibold text-foreground mb-6 flex items-center gap-3">
|
||||
<div className="w-10 h-10 bg-emerald-500 text-white flex items-center justify-center">
|
||||
<Users className="h-5 w-5" />
|
||||
</div>
|
||||
<span className="truncate">Informations Client</span>
|
||||
</h3>
|
||||
@@ -394,10 +394,10 @@ export default function NewSaleForm() {
|
||||
</div>
|
||||
|
||||
{/* Identity Information */}
|
||||
<div className="modern-card bg-amber-50 bg-opacity-50 mobile-form-section rounded-xl border-l-4 border-amber-500">
|
||||
<h3 className="mobile-header-responsive font-semibold text-foreground mb-4 sm:mb-6 flex items-center gap-3">
|
||||
<div className="w-8 h-8 sm:w-10 sm:h-10 bg-amber-500 rounded-lg flex items-center justify-center shadow-sm">
|
||||
<svg className="h-4 w-4 sm:h-5 sm:w-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<div className="bg-amber-50 border border-border mobile-form-section border-l-4 border-l-amber-500">
|
||||
<h3 className="font-semibold text-foreground mb-6 flex items-center gap-3">
|
||||
<div className="w-10 h-10 bg-amber-500 text-white flex items-center justify-center">
|
||||
<svg className="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M10 6H5a2 2 0 00-2 2v9a2 2 0 002 2h14a2 2 0 002-2V8a2 2 0 00-2-2h-5m-4 0V5a2 2 0 114 0v1m-4 0a2 2 0 104 0m-5 8a2 2 0 100-4 2 2 0 000 4zm0 0c1.306 0 2.417.835 2.83 2M9 14a3.001 3.001 0 00-2.83 2M15 11h3m-3 4h2" />
|
||||
</svg>
|
||||
</div>
|
||||
@@ -503,7 +503,7 @@ export default function NewSaleForm() {
|
||||
type="submit"
|
||||
size="lg"
|
||||
disabled={isSubmitting || createSaleMutation.isPending}
|
||||
className="bg-gradient-to-r from-green-600 to-emerald-600 hover:from-green-700 hover:to-emerald-700 text-white border-0 shadow-lg hover:shadow-xl hover:scale-[1.02] smooth-transition touch-friendly-button order-1 sm:order-2"
|
||||
className="bg-primary hover:bg-primary/90 text-primary-foreground border-0 shadow-lg hover:shadow-xl order-1 sm:order-2"
|
||||
>
|
||||
<Save className="h-5 w-5 mr-2" />
|
||||
<span className="hidden sm:inline">{isSubmitting || createSaleMutation.isPending ? 'Enregistrement...' : 'Enregistrer la Vente'}</span>
|
||||
|
||||
+86
-19
@@ -15,18 +15,18 @@
|
||||
--border: hsl(220, 13%, 91%);
|
||||
--input: hsl(220, 13%, 91%);
|
||||
|
||||
/* Modern blue-purple gradient palette */
|
||||
--primary: hsl(232, 97%, 59%);
|
||||
--primary-foreground: hsl(0, 0%, 100%);
|
||||
--secondary: hsl(220, 14%, 96%);
|
||||
--secondary-foreground: hsl(222, 15%, 11%);
|
||||
--accent: hsl(262, 100%, 97%);
|
||||
--accent-foreground: hsl(222, 15%, 11%);
|
||||
/* Modern dark theme palette */
|
||||
--primary: hsl(220, 13%, 18%);
|
||||
--primary-foreground: hsl(0, 0%, 98%);
|
||||
--secondary: hsl(220, 13%, 95%);
|
||||
--secondary-foreground: hsl(220, 13%, 18%);
|
||||
--accent: hsl(220, 13%, 95%);
|
||||
--accent-foreground: hsl(220, 13%, 18%);
|
||||
|
||||
/* Status colors */
|
||||
--destructive: hsl(0, 85%, 60%);
|
||||
--destructive: hsl(0, 72%, 51%);
|
||||
--destructive-foreground: hsl(0, 0%, 98%);
|
||||
--success: hsl(142, 71%, 45%);
|
||||
--success: hsl(142, 69%, 45%);
|
||||
--success-foreground: hsl(0, 0%, 98%);
|
||||
--warning: hsl(38, 92%, 50%);
|
||||
--warning-foreground: hsl(0, 0%, 98%);
|
||||
@@ -34,8 +34,8 @@
|
||||
--info-foreground: hsl(0, 0%, 98%);
|
||||
|
||||
/* Interactive elements */
|
||||
--ring: hsl(232, 97%, 59%);
|
||||
--radius: 0.75rem;
|
||||
--ring: hsl(220, 13%, 18%);
|
||||
--radius: 0.375rem;
|
||||
|
||||
/* Gradient colors */
|
||||
--gradient-from: hsl(232, 97%, 59%);
|
||||
@@ -56,8 +56,8 @@
|
||||
--border: hsl(215, 28%, 17%);
|
||||
--input: hsl(215, 28%, 17%);
|
||||
|
||||
/* Dark mode blue-purple palette */
|
||||
--primary: hsl(232, 97%, 65%);
|
||||
/* Dark mode palette */
|
||||
--primary: hsl(0, 0%, 98%);
|
||||
--primary-foreground: hsl(222, 20%, 4%);
|
||||
--secondary: hsl(215, 28%, 17%);
|
||||
--secondary-foreground: hsl(210, 40%, 95%);
|
||||
@@ -74,12 +74,79 @@
|
||||
--info: hsl(210, 100%, 65%);
|
||||
--info-foreground: hsl(0, 0%, 98%);
|
||||
|
||||
--ring: hsl(232, 97%, 65%);
|
||||
|
||||
/* Dark gradient colors */
|
||||
--gradient-from: hsl(232, 97%, 65%);
|
||||
--gradient-to: hsl(262, 100%, 65%);
|
||||
--gradient-accent: hsl(282, 100%, 65%);
|
||||
--ring: hsl(0, 0%, 98%);
|
||||
}
|
||||
|
||||
/* Modern Design Utilities */
|
||||
.modern-card {
|
||||
border: 1px solid hsl(var(--border));
|
||||
background: hsl(var(--card));
|
||||
box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
|
||||
}
|
||||
|
||||
.modern-button {
|
||||
border: 1px solid hsl(var(--border));
|
||||
background: hsl(var(--background));
|
||||
color: hsl(var(--foreground));
|
||||
font-weight: 500;
|
||||
padding: 8px 16px;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.modern-button:hover {
|
||||
background: hsl(var(--muted));
|
||||
border-color: hsl(var(--primary));
|
||||
}
|
||||
|
||||
.modern-button-primary {
|
||||
background: hsl(var(--primary));
|
||||
color: hsl(var(--primary-foreground));
|
||||
border: 1px solid hsl(var(--primary));
|
||||
}
|
||||
|
||||
.modern-button-primary:hover {
|
||||
background: hsl(var(--primary) / 0.9);
|
||||
}
|
||||
|
||||
.modern-input {
|
||||
border: 1px solid hsl(var(--border));
|
||||
background: hsl(var(--background));
|
||||
color: hsl(var(--foreground));
|
||||
padding: 8px 12px;
|
||||
font-size: 14px;
|
||||
transition: border-color 0.2s ease;
|
||||
}
|
||||
|
||||
.modern-input:focus {
|
||||
outline: none;
|
||||
border-color: hsl(var(--primary));
|
||||
box-shadow: 0 0 0 1px hsl(var(--primary));
|
||||
}
|
||||
|
||||
.modern-section {
|
||||
border: 1px solid hsl(var(--border));
|
||||
background: hsl(var(--card));
|
||||
padding: 24px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.modern-section-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
margin-bottom: 24px;
|
||||
padding-bottom: 12px;
|
||||
border-bottom: 1px solid hsl(var(--border));
|
||||
}
|
||||
|
||||
.modern-icon-container {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background: hsl(var(--primary));
|
||||
color: hsl(var(--primary-foreground));
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* Enhanced keyframes for mobile animations */
|
||||
|
||||
@@ -40,32 +40,31 @@ function DashboardContent() {
|
||||
return (
|
||||
<div className="min-h-screen bg-background">
|
||||
{/* Modern Header */}
|
||||
<header className="sticky top-0 z-50 border-b border-border/40 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
|
||||
<header className="sticky top-0 z-50 border-b border-border bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
|
||||
<div className="max-w-7xl mx-auto mobile-padding">
|
||||
<div className="flex justify-between items-center h-14 sm:h-16">
|
||||
<div className="flex items-center gap-2 sm:gap-4">
|
||||
<div className="flex justify-between items-center h-16">
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="relative">
|
||||
<div className="p-1.5 sm:p-2 bg-gradient-to-br from-primary to-purple-600 rounded-lg sm:rounded-xl shadow-sm">
|
||||
<Package className="h-5 w-5 sm:h-6 sm:w-6 text-white" />
|
||||
<div className="p-2 bg-primary text-primary-foreground">
|
||||
<Package className="h-6 w-6" />
|
||||
</div>
|
||||
<div className="absolute -inset-1 bg-gradient-to-br from-primary to-purple-600 rounded-lg sm:rounded-xl blur opacity-20 -z-10"></div>
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<h1 className="text-lg sm:text-xl font-bold gradient-text truncate">RegisFlow</h1>
|
||||
<p className="text-xs sm:text-sm text-muted-foreground hidden sm:block">Registre des ventes des Feux d'artifice</p>
|
||||
<h1 className="text-xl font-bold text-foreground truncate">RegisFlow</h1>
|
||||
<p className="text-sm text-muted-foreground hidden sm:block">Registre des ventes des Feux d'artifice</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2 sm:gap-4">
|
||||
{/* Store Selector for Admin */}
|
||||
{isAdmin && !isLoadingStores && (
|
||||
<div className="hidden sm:flex items-center gap-2 sm:gap-3 p-1.5 sm:p-2 bg-muted/50 rounded-lg border border-border/50">
|
||||
<div className="hidden sm:flex items-center gap-3 p-2 bg-muted border border-border">
|
||||
<Building2 className="h-4 w-4 text-muted-foreground" />
|
||||
<Select
|
||||
value={selectedStoreId?.toString() || ""}
|
||||
onValueChange={(value) => setSelectedStoreId(parseInt(value))}
|
||||
>
|
||||
<SelectTrigger className="w-32 sm:w-48 border-0 bg-transparent focus:ring-0 text-sm">
|
||||
<SelectTrigger className="w-48 border-0 bg-transparent focus:ring-0 text-sm">
|
||||
<SelectValue placeholder="Magasin" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
@@ -81,7 +80,7 @@ function DashboardContent() {
|
||||
|
||||
{/* Current Store Display for Non-Admin */}
|
||||
{!isAdmin && selectedStore && (
|
||||
<div className="hidden sm:flex items-center gap-2 px-2 sm:px-3 py-1.5 sm:py-2 bg-muted/50 rounded-lg border border-border/50">
|
||||
<div className="hidden sm:flex items-center gap-2 px-3 py-2 bg-muted border border-border">
|
||||
<Building2 className="h-4 w-4 text-primary" />
|
||||
<span className="text-sm font-medium">{selectedStore.name}</span>
|
||||
</div>
|
||||
@@ -116,29 +115,29 @@ function DashboardContent() {
|
||||
<main className="max-w-7xl mx-auto mobile-padding py-4 sm:py-6 lg:py-8">
|
||||
<div className="fade-in">
|
||||
<Tabs value={activeTab} onValueChange={setActiveTab} className="mobile-form-responsive">
|
||||
<TabsList className={`grid w-full ${canAccessAdmin ? 'grid-cols-3' : 'grid-cols-2'} max-w-full sm:max-w-2xl h-12 sm:h-14 bg-muted bg-opacity-50 p-1.5 sm:p-2 rounded-xl sm:rounded-2xl border border-border border-opacity-50`}>
|
||||
<TabsList className={`grid w-full ${canAccessAdmin ? 'grid-cols-3' : 'grid-cols-2'} max-w-full sm:max-w-2xl h-14 bg-muted p-0 border border-border`}>
|
||||
<TabsTrigger
|
||||
value="new-sale"
|
||||
className="h-9 sm:h-10 rounded-lg sm:rounded-xl data-[state=active]:bg-background data-[state=active]:shadow-md smooth-transition font-medium text-xs sm:text-sm"
|
||||
className="h-full data-[state=active]:bg-background data-[state=active]:border-b-2 data-[state=active]:border-primary font-medium text-sm"
|
||||
>
|
||||
<Package className="h-4 w-4 sm:h-5 sm:w-5 mr-1 sm:mr-2" />
|
||||
<Package className="h-5 w-5 mr-2" />
|
||||
<span className="hidden sm:inline">Nouvelle Vente</span>
|
||||
<span className="sm:hidden">Vente</span>
|
||||
</TabsTrigger>
|
||||
<TabsTrigger
|
||||
value="history"
|
||||
className="h-9 sm:h-10 rounded-lg sm:rounded-xl data-[state=active]:bg-background data-[state=active]:shadow-md smooth-transition font-medium text-xs sm:text-sm"
|
||||
className="h-full data-[state=active]:bg-background data-[state=active]:border-b-2 data-[state=active]:border-primary font-medium text-sm"
|
||||
>
|
||||
<History className="h-4 w-4 sm:h-5 sm:w-5 mr-1 sm:mr-2" />
|
||||
<History className="h-5 w-5 mr-2" />
|
||||
<span className="hidden sm:inline">Historique</span>
|
||||
<span className="sm:hidden">Liste</span>
|
||||
</TabsTrigger>
|
||||
{canAccessAdmin && (
|
||||
<TabsTrigger
|
||||
value="admin"
|
||||
className="h-9 sm:h-10 rounded-lg sm:rounded-xl data-[state=active]:bg-background data-[state=active]:shadow-md smooth-transition font-medium text-xs sm:text-sm"
|
||||
className="h-full data-[state=active]:bg-background data-[state=active]:border-b-2 data-[state=active]:border-primary font-medium text-sm"
|
||||
>
|
||||
<Settings className="h-4 w-4 sm:h-5 sm:w-5 mr-1 sm:mr-2" />
|
||||
<Settings className="h-5 w-5 mr-2" />
|
||||
<span className="hidden sm:inline">Administration</span>
|
||||
<span className="sm:hidden">Admin</span>
|
||||
</TabsTrigger>
|
||||
|
||||
+16
-24
@@ -51,41 +51,33 @@ export default function Login() {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-screen flex items-center justify-center gradient-bg mobile-padding py-4 relative overflow-hidden">
|
||||
{/* Background decoration */}
|
||||
<div className="absolute inset-0 overflow-hidden">
|
||||
<div className="absolute -top-40 -right-40 w-80 h-80 bg-gradient-to-br from-white/20 to-white/5 rounded-full blur-3xl"></div>
|
||||
<div className="absolute -bottom-40 -left-40 w-80 h-80 bg-gradient-to-br from-white/20 to-white/5 rounded-full blur-3xl"></div>
|
||||
</div>
|
||||
<div className="min-h-screen flex items-center justify-center bg-background mobile-padding py-4">
|
||||
|
||||
<Card className="w-full max-w-md modern-card-elevated backdrop-blur-sm bg-white/90 border-white/20 slide-in-up relative z-10">
|
||||
<CardHeader className="text-center space-y-4 sm:space-y-6 mobile-card-header">
|
||||
<Card className="w-full max-w-md modern-card border border-border">
|
||||
<CardHeader className="text-center space-y-6">
|
||||
<div className="flex justify-center">
|
||||
<div className="relative">
|
||||
<div className="p-3 sm:p-4 bg-gradient-to-br from-primary to-purple-600 rounded-xl sm:rounded-2xl shadow-lg">
|
||||
<Sparkles className="h-6 w-6 sm:h-8 sm:w-8 text-white" />
|
||||
</div>
|
||||
<div className="absolute -inset-2 bg-gradient-to-br from-primary to-purple-600 rounded-xl sm:rounded-2xl blur opacity-20 -z-10"></div>
|
||||
<div className="modern-icon-container">
|
||||
<Sparkles className="h-8 w-8" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<CardTitle className="responsive-title font-bold gradient-text">RegisFlow</CardTitle>
|
||||
<p className="text-muted-foreground responsive-subtitle">Registre des ventes des Feux d'artifice</p>
|
||||
<CardTitle className="text-2xl font-bold text-foreground">RegisFlow</CardTitle>
|
||||
<p className="text-muted-foreground text-sm">Registre des ventes des Feux d'artifice</p>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent className="mobile-card-content space-y-4 sm:space-y-6">
|
||||
<CardContent className="space-y-6">
|
||||
<Form {...form}>
|
||||
<form onSubmit={form.handleSubmit(onSubmit)} className="mobile-form-responsive">
|
||||
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="username"
|
||||
render={({ field }) => (
|
||||
<FormItem className="space-y-2 sm:space-y-3">
|
||||
<FormLabel className="responsive-body font-semibold text-foreground">Nom d'utilisateur</FormLabel>
|
||||
<FormItem className="space-y-2">
|
||||
<FormLabel className="font-semibold text-foreground">Nom d'utilisateur</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
placeholder="Votre nom d'utilisateur"
|
||||
className="touch-friendly responsive-body border-2 border-border/50 focus:border-primary bg-background/50 backdrop-blur-sm smooth-transition"
|
||||
className="modern-input"
|
||||
{...field}
|
||||
/>
|
||||
</FormControl>
|
||||
@@ -97,13 +89,13 @@ export default function Login() {
|
||||
control={form.control}
|
||||
name="password"
|
||||
render={({ field }) => (
|
||||
<FormItem className="space-y-2 sm:space-y-3">
|
||||
<FormLabel className="responsive-body font-semibold text-foreground">Mot de passe</FormLabel>
|
||||
<FormItem className="space-y-2">
|
||||
<FormLabel className="font-semibold text-foreground">Mot de passe</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
type="password"
|
||||
placeholder="Votre mot de passe"
|
||||
className="touch-friendly responsive-body border-2 border-border/50 focus:border-primary bg-background/50 backdrop-blur-sm smooth-transition"
|
||||
className="modern-input"
|
||||
{...field}
|
||||
/>
|
||||
</FormControl>
|
||||
@@ -113,7 +105,7 @@ export default function Login() {
|
||||
/>
|
||||
<Button
|
||||
type="submit"
|
||||
className="w-full touch-friendly responsive-body font-semibold bg-gradient-to-r from-primary to-purple-600 hover:from-primary/90 hover:to-purple-600/90 hover:shadow-lg hover:scale-[1.02] smooth-transition"
|
||||
className="w-full modern-button-primary"
|
||||
disabled={isLoggingIn}
|
||||
>
|
||||
<LogIn className="h-5 w-5 mr-2" />
|
||||
|
||||
@@ -179,6 +179,11 @@ Preferred communication style: Simple, everyday language.
|
||||
- ✅ Made "Lieu de naissance" field mandatory in new sale form for regulatory compliance
|
||||
- ✅ Removed unnecessary header section from new sale form for cleaner interface
|
||||
- ✅ Created custom favicon with fireworks design representing RegisFlow application
|
||||
- ✅ Implemented modern UI template with angular design elements replacing rounded components
|
||||
- ✅ Updated color scheme to use darker, more professional tones with less vibrant gradients
|
||||
- ✅ Modified card layouts, buttons, and form elements to use rectangular shapes instead of rounded corners
|
||||
- ✅ Enhanced Dashboard with clean, professional navigation tabs using bottom borders instead of rounded active states
|
||||
- ✅ Simplified login page with modern, angular design maintaining accessibility and usability
|
||||
|
||||
### Database Backup & Recovery System (January 9, 2025)
|
||||
- ✅ Added complete database backup and restore functionality in administration panel
|
||||
|
||||
Reference in new issue
Block a user