diff --git a/ui/src/causestarter/components/ProjectCard.tsx b/ui/src/causestarter/components/ProjectCard.tsx index 1f8cbf5d..3aaece1e 100644 --- a/ui/src/causestarter/components/ProjectCard.tsx +++ b/ui/src/causestarter/components/ProjectCard.tsx @@ -1,15 +1,29 @@ -import { Paper, Stack, Typography } from '@mui/material' +import { Box, Paper, Stack, Typography } from '@mui/material' +import { + getProjectStatus, + STATUS_COLORS, + STATUS_LABELS, + STATUS_TOOLTIPS, +} from '@ui/lazy-giving' import { InfoChip, projectPathForAddress } from '@ui/shared' import { Link as RouterLink } from 'react-router-dom' import type { ProjectRelation, UserProject } from '../lib/userProjects' const RELATION_LABEL: Record = { - created: 'Created', + created: 'Owner', contributed: 'Contributed', bookmarked: 'Bookmarked', } +const RELATION_TOOLTIP: Record = { + created: 'This wallet created the project.', + contributed: 'This wallet contributed to this project.', + bookmarked: 'You bookmarked this project.', +} + export function ProjectCard({ project }: { project: UserProject }) { + const status = getProjectStatus(project.project) + return ( `0 8px 24px ${theme.palette.mode === 'light' ? 'rgba(15,118,110,0.12)' : 'rgba(0,0,0,0.35)'}`, + boxShadow: (theme) => `0 4px 12px ${theme.palette.mode === 'light' ? 'rgba(15,118,110,0.10)' : 'rgba(0,0,0,0.28)'}`, }, }} > - - {project.title} - - {project.relations.length > 0 && ( - + + + + {project.title} + + + + {project.relations.map((relation) => ( ))} - )} + ) } diff --git a/ui/src/causestarter/components/YourCauses.tsx b/ui/src/causestarter/components/YourCauses.tsx index d96e56c1..da0ba1a6 100644 --- a/ui/src/causestarter/components/YourCauses.tsx +++ b/ui/src/causestarter/components/YourCauses.tsx @@ -34,11 +34,15 @@ export function YourCauses({ gap: 2, }} > - + Cause boards - + +