website refactor

This commit is contained in:
2026-01-18 16:18:18 +01:00
parent 0b301feb61
commit 13567d51af
329 changed files with 4701 additions and 4750 deletions

View File

@@ -2,7 +2,6 @@ import React from 'react';
import { Trophy, Crown, Users } from 'lucide-react';
import type { TeamSummaryViewModel } from '@/lib/view-models/TeamSummaryViewModel';
import { getMediaUrl } from '@/lib/utilities/media';
import { Box } from '@/ui/Box';
import { Stack } from '@/ui/Stack';
import { Text } from '@/ui/Text';
import { Icon } from '@/ui/Icon';
@@ -75,7 +74,7 @@ export function TopThreePodium({ teams, onClick }: TopThreePodiumProps) {
p={0}
transition
>
<Box
<Stack
bg={getBgColor(position)}
rounded="xl"
border
@@ -85,18 +84,18 @@ export function TopThreePodium({ teams, onClick }: TopThreePodiumProps) {
>
{/* Crown for 1st place */}
{position === 1 && (
<Box position="absolute" top="-4" left="1/2" translateX="-1/2">
<Box position="relative">
<Box animate="pulse">
<Stack position="absolute" top="-4" left="1/2" translateX="-1/2">
<Stack position="relative">
<Stack animate="pulse">
<Icon icon={Crown} size={8} color="var(--warning-amber)" />
</Box>
<Box position="absolute" inset="0" bg="bg-yellow-400" bgOpacity={0.3} blur="md" rounded="full" />
</Box>
</Box>
</Stack>
<Stack position="absolute" inset="0" bg="bg-yellow-400" bgOpacity={0.3} blur="md" rounded="full" />
</Stack>
</Stack>
)}
{/* Team logo */}
<Box h="20" w="20" display="flex" center rounded="xl" bg="bg-deep-graphite" border borderColor="border-charcoal-outline" overflow="hidden" mb={3}>
<Stack h="20" w="20" display="flex" center rounded="xl" bg="bg-deep-graphite" border borderColor="border-charcoal-outline" overflow="hidden" mb={3}>
<Image
src={team.logoUrl || getMediaUrl('team-logo', team.id)}
alt={team.name}
@@ -104,7 +103,7 @@ export function TopThreePodium({ teams, onClick }: TopThreePodiumProps) {
height={80}
objectFit="cover"
/>
</Box>
</Stack>
{/* Team name */}
<Text weight="bold" size="sm" color="text-white" textAlign="center" block truncate maxWidth="28">
@@ -134,7 +133,7 @@ export function TopThreePodium({ teams, onClick }: TopThreePodiumProps) {
<Text size="xs" color="text-gray-400">{team.memberCount}</Text>
</Stack>
</Stack>
</Box>
</Stack>
</Button>
}
/>