mmintel/gridpilot.gg
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

website refactor

Browse Source
This commit is contained in:
Marc Mintel
2026-01-15 18:52:03 +01:00
parent f035cfe7ce
commit 5ef149b782
39 changed files with 564 additions and 518 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
apps/website/templates/LeagueSettingsTemplate.tsx
View File

@@ -10,7 +10,7 @@ import { Grid } from '@/ui/Grid';
import { GridItem } from '@/ui/GridItem';
import { Icon } from '@/ui/Icon';
import { Surface } from '@/ui/Surface';
import { Settings, Users, Trophy, Shield, Clock } from 'lucide-react';
import { Settings, Users, Trophy, Shield, Clock, LucideIcon } from 'lucide-react';
import type { LeagueSettingsViewData } from '@/lib/view-data/leagues/LeagueSettingsViewData';
interface LeagueSettingsTemplateProps {
@@ -32,7 +32,7 @@ export function LeagueSettingsTemplate({ viewData }: LeagueSettingsTemplateProps
<Card>
<Stack gap={4}>
<Stack direction="row" align="center" gap={3}>
<Surface variant="muted" rounded="lg" padding={2} style={{ backgroundColor: 'rgba(59, 130, 246, 0.1)' }}>
<Surface variant="muted" rounded="lg" padding={2} bg="bg-blue-500/10">
<Icon icon={Settings} size={5} color="#3b82f6" />
</Surface>
<Box>
@@ -48,7 +48,7 @@ export function LeagueSettingsTemplate({ viewData }: LeagueSettingsTemplateProps
<InfoItem label="Description" value={viewData.league.description} />
</GridItem>
<InfoItem label="Created" value={new Date(viewData.league.createdAt).toLocaleDateString()} />
<InfoItem label="Owner ID" value={viewData.league.ownerId} mono />
<InfoItem label="Owner ID" value={viewData.league.ownerId} />
</Grid>
</Stack>
</Card>
@@ -57,7 +57,7 @@ export function LeagueSettingsTemplate({ viewData }: LeagueSettingsTemplateProps
<Card>
<Stack gap={4}>
<Stack direction="row" align="center" gap={3}>
<Surface variant="muted" rounded="lg" padding={2} style={{ backgroundColor: 'rgba(16, 185, 129, 0.1)' }}>
<Surface variant="muted" rounded="lg" padding={2} bg="bg-green-500/10">
<Icon icon={Trophy} size={5} color="#10b981" />
</Surface>
<Box>
@@ -70,7 +70,7 @@ export function LeagueSettingsTemplate({ viewData }: LeagueSettingsTemplateProps
<ConfigItem icon={Users} label="Max Drivers" value={viewData.config.maxDrivers} />
<ConfigItem icon={Shield} label="Require Approval" value={viewData.config.requireApproval ? 'Yes' : 'No'} />
<ConfigItem icon={Clock} label="Allow Late Join" value={viewData.config.allowLateJoin ? 'Yes' : 'No'} />
<ConfigItem icon={Trophy} label="Scoring Preset" value={viewData.config.scoringPresetId} mono />
<ConfigItem icon={Trophy} label="Scoring Preset" value={viewData.config.scoringPresetId} />
</Grid>
</Stack>
</Card>
@@ -78,10 +78,10 @@ export function LeagueSettingsTemplate({ viewData }: LeagueSettingsTemplateProps
{/* Note about forms */}
<Card>
<Stack align="center" py={8} gap={4}>
<Surface variant="muted" rounded="full" padding={4} style={{ backgroundColor: 'rgba(245, 158, 11, 0.1)' }}>
<Surface variant="muted" rounded="full" padding={4} bg="bg-amber-500/10">
<Icon icon={Settings} size={8} color="#f59e0b" />
</Surface>
<Box style={{ textAlign: 'center' }}>
<Box textAlign="center">
<Heading level={3}>Settings Management</Heading>
<Text size="sm" color="text-gray-400" block mt={2}>
Form-based editing and ownership transfer functionality will be implemented in future updates.
@@ -94,22 +94,22 @@ export function LeagueSettingsTemplate({ viewData }: LeagueSettingsTemplateProps
);
}
function InfoItem({ label, value, capitalize, mono }: { label: string, value: string, capitalize?: boolean, mono?: boolean }) {
function InfoItem({ label, value, capitalize }: { label: string, value: string, capitalize?: boolean }) {
return (
<Box>
<Text size="sm" weight="medium" color="text-gray-400" block mb={1}>{label}</Text>
<Text color="text-white" style={{ textTransform: capitalize ? 'capitalize' : 'none', fontFamily: mono ? 'monospace' : 'inherit' }}>{value}</Text>
<Text color="text-white">{capitalize ? value.toUpperCase() : value}</Text>
</Box>
);
}
function ConfigItem({ icon, label, value, mono }: { icon: React.ElementType, label: string, value: string | number, mono?: boolean }) {
function ConfigItem({ icon, label, value }: { icon: LucideIcon, label: string, value: string | number }) {
return (
<Stack direction="row" align="center" gap={3}>
<Icon icon={icon as any} size={5} color="#9ca3af" />
<Icon icon={icon} size={5} color="#9ca3af" />
<Box>
<Text size="sm" weight="medium" color="text-gray-400" block>{label}</Text>
<Text color="text-white" style={{ fontFamily: mono ? 'monospace' : 'inherit' }}>{value}</Text>
<Text color="text-white">{value}</Text>
</Box>
</Stack>
);