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

fix: restore tablo overview layout and colors

Browse source
This commit is contained in:
Arthur Belleville 2026-04-16 13:43:30 +02:00
parent e3673b7040
commit 916dba496a
No known key found for this signature in database
3 changed files with 53 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
apps/main/src/pages/tablo-details.layout.test.tsx
View file

@ -318,11 +318,17 @@ describe("TabloDetailsPage overview layout", () => {
expect(screen.getByTestId("single-tablo-overview-grid")).toHaveClass(
"lg:grid-cols-[minmax(0,2fr)_minmax(0,1fr)]"
);
expect(screen.getByRole("button", { name: "Modifier la mise en page" })).toHaveClass(
"bg-primary"
expect(screen.getByRole("link", { name: "Discussion" })).toHaveClass("bg-[#804EEC]");
expect(screen.getByRole("button", { name: "Inviter" })).toHaveClass(
"border-[#804EEC]",
"text-[#804EEC]"
);
expect(screen.getByRole("button", { name: "Ajouter" })).toHaveClass("bg-primary");
expect(screen.getByRole("button", { name: "Ouvrir" })).toHaveClass("bg-primary");
expect(screen.getByRole("button", { name: "Modifier la mise en page" })).toHaveClass(
"border-[#804EEC]",
"text-[#804EEC]"
);
expect(screen.getByRole("button", { name: "Ajouter" })).toHaveClass("bg-[#804EEC]");
expect(screen.getByRole("button", { name: "Ouvrir" })).toHaveClass("text-[#804EEC]");
});
it("shows layout edit toggle for admin users", () => {

30
packages/tablo-views/src/single-tablo/SingleTabloOverview.tsx
View file

@ -126,10 +126,21 @@ export function SingleTabloOverview({
title: "Mes tâches",
actions: (
<div className="flex items-center gap-2">
<Button type="button" size="sm" onClick={onOpenTasks}>
<Button
type="button"
variant="ghost"
size="sm"
className="text-[#804EEC] hover:bg-[#804EEC]/10 hover:text-[#804EEC]"
onClick={onOpenTasks}
>
Voir tout
</Button>
<Button type="button" size="sm" onClick={onCreateTask}>
<Button
type="button"
size="sm"
className="bg-[#804EEC] hover:bg-[#6f3fd4] text-white"
onClick={onCreateTask}
>
Ajouter
</Button>
</div>
@ -170,7 +181,13 @@ export function SingleTabloOverview({
return {
title: "Fichiers",
actions: (
<Button type="button" size="sm" onClick={onOpenFiles}>
<Button
type="button"
variant="ghost"
size="sm"
className="text-[#804EEC] hover:bg-[#804EEC]/10 hover:text-[#804EEC]"
onClick={onOpenFiles}
>
Ouvrir
</Button>
),
@ -241,7 +258,12 @@ export function SingleTabloOverview({
<div className="space-y-6">
{canEditLayout && (
<div className="flex flex-wrap items-center gap-2">
<Button type="button" onClick={onToggleLayoutEditMode}>
<Button
type="button"
variant="outline"
className="border border-[#804EEC] text-[#804EEC] hover:bg-[#804EEC]/10"
onClick={onToggleLayoutEditMode}
>
Modifier la mise en page
</Button>
{isLayoutEditMode && (

22
packages/tablo-views/src/single-tablo/SingleTabloView.tsx
View file

@ -125,22 +125,34 @@ export function SingleTabloView({
const discussionButton =
discussionAction?.kind === "link" ? (
<Button asChild>
<Button
asChild
className="bg-[#804EEC] hover:bg-[#6f3fd4] text-white font-medium py-2.5 px-4 rounded-lg flex items-center justify-center gap-2 transition-colors flex-1 sm:flex-none min-h-[44px]"
>
<Link to={discussionAction.to}>
<MessageCircleIcon className="w-4 h-4" />
<MessageCircleIcon className="w-5 h-5" />
Discussion
</Link>
</Button>
) : discussionAction?.kind === "button" ? (
<Button type="button" onClick={discussionAction.onClick}>
<MessageCircleIcon className="w-4 h-4" />
<Button
type="button"
onClick={discussionAction.onClick}
className="bg-[#804EEC] hover:bg-[#6f3fd4] text-white font-medium py-2.5 px-4 rounded-lg flex items-center justify-center gap-2 transition-colors flex-1 sm:flex-none min-h-[44px]"
>
<MessageCircleIcon className="w-5 h-5" />
Discussion
</Button>
) : null;
const inviteButton =
canInviteMembers && onOpenInviteDialog ? (
<Button type="button" variant="outline" onClick={onOpenInviteDialog}>
<Button
type="button"
variant="outline"
onClick={onOpenInviteDialog}
className="border border-[#804EEC] text-[#804EEC] hover:bg-[#804EEC]/10 font-medium py-2.5 px-4 rounded-lg flex items-center justify-center gap-2 transition-colors flex-1 sm:flex-none min-h-[44px]"
>
Inviter
</Button>
) : null;