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

29
apps/website/templates/AdminUsersTemplate.tsx
View File

@@ -65,11 +65,11 @@ export function AdminUsersTemplate({
}
};
const getRoleBadgeStyle = (role: string) => {
const getRoleBadgeProps = (role: string): { bg: string; color: string; borderColor: string } => {
switch (role) {
case 'owner': return { backgroundColor: 'rgba(168, 85, 247, 0.2)', color: '#d8b4fe', border: '1px solid rgba(168, 85, 247, 0.3)' };
case 'admin': return { backgroundColor: 'rgba(59, 130, 246, 0.2)', color: '#93c5fd', border: '1px solid rgba(59, 130, 246, 0.3)' };
default: return { backgroundColor: 'rgba(115, 115, 115, 0.2)', color: '#d1d5db', border: '1px solid rgba(115, 115, 115, 0.3)' };
case 'owner': return { bg: 'bg-purple-500/20', color: '#d8b4fe', borderColor: 'border-purple-500/30' };
case 'admin': return { bg: 'bg-blue-500/20', color: '#93c5fd', borderColor: 'border-blue-500/30' };
default: return { bg: 'bg-neutral-500/20', color: '#d1d5db', borderColor: 'border-neutral-500/30' };
}
};
@@ -86,7 +86,7 @@ export function AdminUsersTemplate({
onClick={onRefresh}
disabled={loading}
variant="secondary"
icon={<Icon icon={RefreshCw} size={4} className={loading ? 'animate-spin' : ''} />}
icon={<Icon icon={RefreshCw} size={4} animate={loading ? 'spin' : 'none'} />}
>
Refresh
</Button>
@@ -117,7 +117,7 @@ export function AdminUsersTemplate({
<Card p={0}>
{loading ? (
<Stack center py={12} gap={3}>
<Box className="animate-spin" style={{ borderRadius: '9999px', height: '2rem', width: '2rem', borderBottom: '2px solid #3b82f6' }} />
<Box animate="spin" rounded="full" h="2rem" w="2rem" borderBottom borderColor="border-primary-blue" />
<Text color="text-gray-400">Loading users...</Text>
</Stack>
) : !viewData.users || viewData.users.length === 0 ? (
@@ -149,7 +149,7 @@ export function AdminUsersTemplate({
<TableRow key={user.id}>
<TableCell>
<Stack direction="row" align="center" gap={3}>
<Surface variant="muted" rounded="full" padding={2} style={{ backgroundColor: 'rgba(59, 130, 246, 0.2)' }}>
<Surface variant="muted" rounded="full" padding={2} bg="bg-primary-blue/20">
<Icon icon={Shield} size={4} color="#3b82f6" />
</Surface>
<Box>
@@ -167,21 +167,18 @@ export function AdminUsersTemplate({
<TableCell>
<Stack direction="row" gap={1} wrap>
{user.roles.map((role, idx) => {
const style = getRoleBadgeStyle(role);
const badgeProps = getRoleBadgeProps(role);
return (
<Surface
key={idx}
variant="muted"
rounded="full"
padding={1}
style={{
paddingLeft: '0.5rem',
paddingRight: '0.5rem',
backgroundColor: style.backgroundColor,
color: style.color,
borderColor: style.border,
border: '1px solid'
}}
px={2}
bg={badgeProps.bg}
color={badgeProps.color}
borderColor={badgeProps.borderColor}
border
>
<Text size="xs" weight="medium">{role.charAt(0).toUpperCase() + role.slice(1)}</Text>
</Surface>