feat: enhance responsive design and layout consistency across various components, including dashboard, statistics, and rules pages
This commit is contained in:
@@ -238,10 +238,14 @@ export default function RulesPage() {
|
||||
<PageHeader
|
||||
title="Règles de catégorisation"
|
||||
description={
|
||||
<span className="flex items-center gap-2">
|
||||
{transactionGroups.length} groupe
|
||||
{transactionGroups.length > 1 ? "s" : ""} de transactions similaires
|
||||
<Badge variant="secondary">{uncategorizedCount} non catégorisées</Badge>
|
||||
<span className="flex items-center gap-2 flex-wrap">
|
||||
<span className="text-xs md:text-base">
|
||||
{transactionGroups.length} groupe
|
||||
{transactionGroups.length > 1 ? "s" : ""} de transactions similaires
|
||||
</span>
|
||||
<Badge variant="secondary" className="text-[10px] md:text-xs">
|
||||
{uncategorizedCount} non catégorisées
|
||||
</Badge>
|
||||
</span>
|
||||
}
|
||||
actions={
|
||||
@@ -272,14 +276,14 @@ export default function RulesPage() {
|
||||
/>
|
||||
|
||||
{transactionGroups.length === 0 ? (
|
||||
<div className="flex flex-col items-center justify-center py-16 text-center">
|
||||
<Sparkles className="h-12 w-12 text-muted-foreground mb-4" />
|
||||
<h3 className="text-lg font-medium text-foreground mb-2">
|
||||
<div className="flex flex-col items-center justify-center py-12 md:py-16 text-center px-4">
|
||||
<Sparkles className="h-8 w-8 md:h-12 md:w-12 text-muted-foreground mb-3 md:mb-4" />
|
||||
<h3 className="text-base md:text-lg font-medium text-foreground mb-2">
|
||||
{uncategorizedCount === 0
|
||||
? "Toutes les transactions sont catégorisées !"
|
||||
: "Aucun groupe trouvé"}
|
||||
</h3>
|
||||
<p className="text-sm text-muted-foreground max-w-md">
|
||||
<p className="text-xs md:text-sm text-muted-foreground max-w-md">
|
||||
{uncategorizedCount === 0
|
||||
? "Continuez à importer des transactions pour voir les suggestions de règles."
|
||||
: filterMinCount > 1
|
||||
@@ -288,7 +292,7 @@ export default function RulesPage() {
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-3">
|
||||
<div className="space-y-2 md:space-y-3">
|
||||
{transactionGroups.map((group) => (
|
||||
<RuleGroupCard
|
||||
key={group.key}
|
||||
|
||||
Reference in New Issue
Block a user