Skip to content

Commit

Permalink
Merge pull request #39 from fossuok/dev
Browse files Browse the repository at this point in the history
Dev
  • Loading branch information
SahanHeshan authored Feb 3, 2025
2 parents 2b18ec9 + c29b1ba commit 736b309
Show file tree
Hide file tree
Showing 30 changed files with 1,000 additions and 961 deletions.
121 changes: 56 additions & 65 deletions src/app/(pages)/about/AboutCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,7 @@ import classes from "./AboutCard.module.css";
import { mockdata } from "@/data/AboutUsData";

export default function AboutCard() {
const { image, title, organization, mission, activities, goals, badges } =
mockdata;
const { image, title, organization, mission, activities, goals } = mockdata;

return (
<div className={classes.wrapper}>
Expand All @@ -30,96 +29,88 @@ export default function AboutCard() {
<Card.Section className={classes.section}>
<Group justify="center">
<Badge size="lg" color="violet" variant="light">
{organization}{" "}
{organization}
</Badge>
</Group>
</Card.Section>

{/* Mission Section */}
<Card.Section className={classes.section}>
<Text fz="md" fw={700} mt="md">
Our Mission:
</Text>
<Table withRowBorders={false} mt="xs">
{mission.map((item, index) => {
const [missionTitle, missionDescription] = item.split(":");
return (
<Table.Tr key={index}>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span c="teal.5" fw={600}>
{missionTitle}:
</Text>
</Table.Td>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span>{missionDescription}</Text>
</Table.Td>
</Table.Tr>
);
})}
<Table.Tbody>
{mission.map((item, index) => {
const [missionTitle, missionDescription] = item.split(":");
return (
<Table.Tr key={index}>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span c="teal.5" fw={600}>
{missionTitle}:
</Text>
</Table.Td>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span>{missionDescription}</Text>
</Table.Td>
</Table.Tr>
);
})}
</Table.Tbody>
</Table>
</Card.Section>

{/* Activities Section */}
<Card.Section className={classes.section}>
<Text fz="md" fw={700} mt="md">
What We Do:
</Text>
<Table withRowBorders={false} mt="xs">
{activities.map((item, index) => {
const [serviceTitle, serviceDescription] = item.split(":");
return (
<Table.Tr key={index}>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span c="blue.5" fw={600}>
{serviceTitle}:
</Text>
</Table.Td>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span>{serviceDescription}</Text>
</Table.Td>
</Table.Tr>
);
})}
<Table.Tbody>
{activities.map((item, index) => {
const [serviceTitle, serviceDescription] = item.split(":");
return (
<Table.Tr key={index}>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span c="blue.5" fw={600}>
{serviceTitle}:
</Text>
</Table.Td>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span>{serviceDescription}</Text>
</Table.Td>
</Table.Tr>
);
})}
</Table.Tbody>
</Table>
</Card.Section>

{/* Goals Section */}
<Card.Section className={classes.section}>
<Text fz="md" fw={700} mt="md">
Our Goals:
</Text>
<Table withRowBorders={false} mt="xs">
{goals.map((item, index) => {
const [goalTitle, goalDescription] = item.split(":");
return (
<Table.Tr key={index}>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span c="teal.5" fw={600}>
{goalTitle}:
</Text>
</Table.Td>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span>{goalDescription}</Text>
</Table.Td>
</Table.Tr>
);
})}
<Table.Tbody>
{goals.map((item, index) => {
const [goalTitle, goalDescription] = item.split(":");
return (
<Table.Tr key={index}>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span c="teal.5" fw={600}>
{goalTitle}:
</Text>
</Table.Td>
<Table.Td style={{ verticalAlign: "top" }}>
<Text span>{goalDescription}</Text>
</Table.Td>
</Table.Tr>
);
})}
</Table.Tbody>
</Table>
</Card.Section>

{/* <Card.Section className={classes.section}>
<Text mt="md" className={classes.label} c="dimmed">
Perfect for you, if you enjoy
</Text>
<Group gap={7} mt={5}>
{features}
</Group>
</Card.Section>
<Group pt={20} className={classes.section}>
<Button radius="md" style={{ flex: 1 }}>
Join with Us!
</Button>
<ActionIcon variant="default" radius="md" size={36}>
<IconHeart className={classes.like} stroke={1.5} />
</ActionIcon>
</Group> */}
</Card>
</Container>
</div>
Expand Down
13 changes: 13 additions & 0 deletions src/app/(pages)/about/section1.module.css
Original file line number Diff line number Diff line change
Expand Up @@ -65,3 +65,16 @@
flex: 1;
}
}
.equalColumns {
width: 100%;
}

.equalColumns td {
width: 33.33%;
}

@media (max-width: 600px) {
.equalColumns td {
width: auto;
}
}
26 changes: 16 additions & 10 deletions src/app/(pages)/about/section1.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,18 +28,24 @@ export default function Section1() {
<Table
withRowBorders={false}
style={{ textAlign: "center", margin: "auto" }}
className={classes.equalColumns}
>
<Table.Tr fz={"lg"} fw={600}>
<Table.Td>Founded</Table.Td>
<Table.Td>Members</Table.Td>
<Table.Td>Events</Table.Td>
</Table.Tr>
<Table.Tr fz={"h2"} fw={900}>
<Table.Td>2023</Table.Td>
<Table.Td>150+</Table.Td>
<Table.Td>6+</Table.Td>
</Table.Tr>
<Table.Thead>
<Table.Tr fz="lg" fw={600}>
<Table.Td>Founded</Table.Td>
<Table.Td maw={190}>Members</Table.Td>
<Table.Td>Events</Table.Td>
</Table.Tr>
</Table.Thead>
<Table.Tbody>
<Table.Tr fz="h2" fw={900}>
<Table.Td>2023</Table.Td>
<Table.Td maw={190}>150+</Table.Td>
<Table.Td>6+</Table.Td>
</Table.Tr>
</Table.Tbody>
</Table>

<Button
radius="xl"
size="xl"
Expand Down
Loading

0 comments on commit 736b309

Please sign in to comment.