94 lines
2.4 KiB
JavaScript
94 lines
2.4 KiB
JavaScript
import Groups from "../../app/components/sections/Groups";
|
|
|
|
const vectorIconSrc = [
|
|
"/assets/vector/worker-coop.svg",
|
|
"/assets/vector/mutual-aid.svg",
|
|
"/assets/vector/open-source.svg",
|
|
"/assets/vector/dao.svg",
|
|
];
|
|
|
|
const sampleItems = [
|
|
{
|
|
icon: (
|
|
<img
|
|
alt=""
|
|
aria-hidden
|
|
className="inline-block size-9 object-contain"
|
|
height={36}
|
|
src={vectorIconSrc[0]}
|
|
width={36}
|
|
/>
|
|
),
|
|
title: "Worker's cooperatives",
|
|
description:
|
|
"Employee-owned businesses often need to clarify how power is shared, decisions are made, and how processes operate within their organizations.",
|
|
},
|
|
{
|
|
icon: (
|
|
<img
|
|
alt=""
|
|
aria-hidden
|
|
className="inline-block size-9 object-contain"
|
|
height={36}
|
|
src={vectorIconSrc[1]}
|
|
width={36}
|
|
/>
|
|
),
|
|
title: "Mutual aid groups",
|
|
description:
|
|
"Mutual aid groups must define how resources are shared, decisions are made, and volunteer coordination operates within their organizations.",
|
|
},
|
|
{
|
|
icon: (
|
|
<img
|
|
alt=""
|
|
aria-hidden
|
|
className="inline-block size-9 object-contain"
|
|
height={36}
|
|
src={vectorIconSrc[2]}
|
|
width={36}
|
|
/>
|
|
),
|
|
title: "Open source projects",
|
|
description:
|
|
"Agree to how contributions are managed, technical decisions are made, and community participation operates within their development communities.",
|
|
},
|
|
{
|
|
icon: (
|
|
<img
|
|
alt=""
|
|
aria-hidden
|
|
className="inline-block size-9 object-contain"
|
|
height={36}
|
|
src={vectorIconSrc[3]}
|
|
width={36}
|
|
/>
|
|
),
|
|
title: "DAOs",
|
|
description:
|
|
"Document token-based voting process, proposal patterns, and how community governance operates within their blockchain ecosystems.",
|
|
},
|
|
];
|
|
|
|
export default {
|
|
title: "Components/Sections/Groups",
|
|
component: Groups,
|
|
parameters: {
|
|
layout: "fullscreen",
|
|
docs: {
|
|
description: {
|
|
component:
|
|
"Figma **Section** (**[22084-859062](https://www.figma.com/design/agv0VBLiBlcnSAaiAORgPR/Community-Rule-System?node-id=22084-859062&m=dev)**) — baseline stacked cards; **md+** `22084-859470` hairline grid. **`cards/Icon`** tiles (body **12px/16px** from **`lg`**).",
|
|
},
|
|
},
|
|
},
|
|
tags: ["autodocs"],
|
|
};
|
|
|
|
export const Default = {
|
|
args: {
|
|
title: "Who is this for?",
|
|
items: sampleItems,
|
|
},
|
|
};
|