The new Hack Club Toolbox!
Deals for Hack Clubbers—powered by Next.js, Theme UI & MDX.
All the cards except for the current ones are stored in manifest.js. If you take a look at it, you'll notice it's in JSON:
export default [
{
category: 'Perks',
color: 'primary',
icon: 'bag',
items: [
{
name: 'Zoom Pro Meetings',
description: 'Run Zoom Pro meetings for free in your Hack Club',
icon: 'welcome',
external: false,
url: '/zoom.mdx',
forUseBy: 'clubbers'
},
...
]
},
...
]To add a card to an existing category, you simply add to the cards in the category, like so:
export default [
{
category: 'Perks',
color: 'primary',
icon: 'bag',
items: [
{
name: 'Zoom Pro Meetings',
description: 'Run Zoom Pro meetings for free in your Hack Club',
icon: 'welcome',
external: false,
url: '/zoom.mdx',
forUseBy: 'clubbers'
},
+ {
+ name: 'Theme',
+ description: "Hack Club's theme, using Theme UI",
+ icon: 'grid',
+ external: true,
+ url: 'https://theme.hackclub.com',
+ forUseBy: 'everyone'
+ }
]
},To add a new category, you'll follow a similar pattern at the bottom of the file:
export default [
{
category: 'Perks',
color: 'primary',
icon: 'bag',
items: [
{
name: 'Zoom Pro Meetings',
description: 'Run Zoom Pro meetings for free in your Hack Club',
icon: 'welcome',
external: false,
url: '/zoom.mdx',
forUseBy: 'clubbers'
},
]
},
+ {
+ category: '<Category name>',
+ color: '<Category color>',
+ icon: '<Category icon>'
+ items: [
+ ...
+ ]
+ }
]For color and icon, you can use Hack Club's theme.
When you edit the file to make these changes, you'll be asked to make a pull request.
Let us know if you have any questions in Slack!