arthur/xtablo-source
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions 5

Apply purple #804EEC theme to tablo events section

Browse source 
- Create event button: solid #804EEC purple
- Date badge: #F4F3FF background with #7F56D9 text (matching events page)
- Loading spinner: purple instead of blue
- Empty state button: solid purple instead of outline

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Arthur Belleville 2026-02-22 09:54:20 +01:00
parent bbf9d695ba
commit 6b39f175b3
No known key found for this signature in database
1 changed files with 6 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
apps/main/src/components/TabloEventsSection.tsx
View file

@ -65,7 +65,7 @@ export const TabloEventsSection = ({ tablo, isAdmin }: TabloEventsSectionProps)
{t("tablo:events.description")}
</TypographyMuted>
{!isReadOnly && (
<Button onClick={handleCreateEvent} className="flex items-center gap-2 mt-4">
<Button onClick={handleCreateEvent} className="flex items-center gap-2 mt-4 bg-[#804EEC] hover:bg-[#6f3fd4] text-white">
<Plus className="w-4 h-4" />
{t("tablo:events.createEvent")}
</Button>
@ -77,7 +77,7 @@ export const TabloEventsSection = ({ tablo, isAdmin }: TabloEventsSectionProps)
<div className="bg-card rounded-lg border border-border">
{isLoading ? (
<div className="flex items-center justify-center p-8">
<div className="animate-spin rounded-full h-6 w-6 border-b-2 border-blue-500"></div>
<div className="animate-spin rounded-full h-6 w-6 border-b-2 border-[#804EEC]"></div>
<span className="ml-3 text-sm text-gray-500 dark:text-gray-400">
Chargement des événements...
</span>
@ -111,13 +111,13 @@ export const TabloEventsSection = ({ tablo, isAdmin }: TabloEventsSectionProps)
<div key={event.event_id} className="p-6">
<div className="flex items-start space-x-4">
{/* Date Badge */}
<div className="shrink-0 w-16 h-16 bg-primary/10 dark:bg-primary/20 rounded-lg flex flex-col items-center justify-center">
<span className="text-xs font-medium text-primary uppercase">
<div className="shrink-0 w-14 h-14 bg-[#F4F3FF] dark:bg-purple-900/20 rounded-[8px] flex flex-col items-center justify-center">
<span className="text-[10px] font-semibold text-[#7F56D9] dark:text-purple-400 uppercase tracking-wide leading-none">
{new Date(event.start_date).toLocaleDateString("fr-FR", {
month: "short",
})}
</span>
<span className="text-2xl font-bold text-primary">
<span className="text-xl font-bold text-[#7F56D9] dark:text-purple-400 leading-none mt-0.5">
{new Date(event.start_date).getDate()}
</span>
</div>
@ -172,7 +172,7 @@ export const TabloEventsSection = ({ tablo, isAdmin }: TabloEventsSectionProps)
Aucun événement à venir pour ce tablo
</p>
{!isReadOnly && (
<Button onClick={handleCreateEvent} variant="outline" className="mt-4">
<Button onClick={handleCreateEvent} className="mt-4 bg-[#804EEC] hover:bg-[#6f3fd4] text-white">
<Plus className="w-4 h-4 mr-2" />
Créer le premier événement
</Button>