- );
-};
-
-export default FAQ;
+export default Dropdown;
diff --git a/app/components/footer.tsx b/app/components/footer.tsx
index afca7d9..a091229 100644
--- a/app/components/footer.tsx
+++ b/app/components/footer.tsx
@@ -1,31 +1,27 @@
-import {
- Box,
- Button,
- Image,
- Grid,
- Heading,
- Text,
- } from 'theme-ui';
+import { Box, Text } from 'theme-ui';
- const footer = ()=> {
- return (
-
- )
+const Footer = () => {
+ return (
+
+ Made with ❤️ by @bright li & @Scott
+
+ );
}
-export default footer;
\ No newline at end of file
+
+export default Footer;
\ No newline at end of file
diff --git a/app/components/mdx.tsx b/app/components/mdx.tsx
index 640c043..1cb4bd2 100644
--- a/app/components/mdx.tsx
+++ b/app/components/mdx.tsx
@@ -1,18 +1,33 @@
import { Heading, Text } from 'theme-ui'
+
const components = {
- h1: (props) => ,
- h2: (props) => ,
- h3: (props) => ,
- p: (props) => ,
- ol: (props) => ,
- li: (props) => ,
- a: (props) => ,
-
+ h1: (props) => ,
+ h2: (props) => ,
+ h3: (props) => ,
+ p: (props) => ,
+ ol: (props) => ,
+ li: (props) => ,
+ a: (props) => ,
}
+
export default components
\ No newline at end of file
diff --git a/app/components/middle.tsx b/app/components/middle.tsx
index e69de29..0320d8e 100644
--- a/app/components/middle.tsx
+++ b/app/components/middle.tsx
@@ -0,0 +1,50 @@
+import {
+ Box,
+ Heading,
+ Text,
+ } from 'theme-ui';
+
+ const Middle = () => {
+ return (
+
+
+ At the end, Submissions will be peer-reviewed and voted for the top 3. The top 3 will be re-made, and can be given out as gifts!
+
+
+ Frequently Asked Questions
+
+
+ );
+ }
+
+ export default Middle;
\ No newline at end of file
diff --git a/app/components/top.tsx b/app/components/top.tsx
index ce10216..2b0bc6e 100644
--- a/app/components/top.tsx
+++ b/app/components/top.tsx
@@ -1,106 +1,79 @@
-import {
- Box,
- Button,
- Image,
- Grid,
- Heading,
- Text,
- } from 'theme-ui';
- import dynamic from 'next/dynamic';
+import { Box, Button, Heading } from 'theme-ui';
+import dynamic from 'next/dynamic';
- const ModelViewer = dynamic(() => import('../ModelViewer'), { ssr: false });
+const ModelViewer = dynamic(() => import('../ModelViewer'), { ssr: false });
- const tipitytopity = ()=> {
- return (
- {
+ return (
+
+ {typeof window !== 'undefined' && }
+
-
- {typeof window !== 'undefined' && }
- {/*
- */}
-
+
-
- Hacky Holidays!
-
-
- Design a PCB holiday decoration this winter, get one shipped!
-
-
-
+ Hacky Holidays!
+
+
- Learn to Make a Decoration ➜
+ Design a PCB holiday decoration this winter, get one shipped!
+
+
+
+ Learn to Make a Decoration ➜
-
-
-
-
-
-
-
- )
+
+
+
+ );
}
+
export default tipitytopity;
\ No newline at end of file
diff --git a/app/guide/guideMD.mdx b/app/guide/guideMD.mdx
index cb2fb1e..f72594b 100644
--- a/app/guide/guideMD.mdx
+++ b/app/guide/guideMD.mdx
@@ -1,56 +1,68 @@
-
-
-
-# **🎄 Hacky Holidays Guide**
-Hacky Holidays is a limited time YSWS event for making your own PCB tree decorations! There are **3** major steps in making a successful decoration:
+# Hacky Holidays Guide
+
+Hacky Holidays is a limited-time YSWS event for making your own PCB tree decorations! There are **3** major steps in making a successful decoration:
1. Choosing your Parts
2. Designing your PCB
3. Programming your PCB
-### **** This guide serves as a learning tool to help you get started, If you submit the guide PCB you will not be accepted! ****
-
+### **This guide serves as a learning tool to help you get started. If you submit the guide PCB, you will not be accepted!**
+
---
-
-# Choosing Your Parts
-When choosing your parts, think about the function of each component, and try to wither out unneeded components. Unneeded components can reduce your decoration’s battery life!
+## Choosing Your Parts
+
+When choosing your parts, think about the function of each component, and try to eliminate unneeded components. Unneeded components can reduce your decoration’s battery life!
-Parts covered in the guide **(THESE MUST BE ON YOUR PCB TO WORK):**
+Parts covered in the guide:
-- Neopixels
-- MCU (separate guides for the ESP32 and ch552)
-- Batteries
+- Neopixels (4 pin)
+- Xiao ESP32C3
+- Battery Holder
+- Resistors/Diodes
If you want to add any components **not** on the approved list, ask one of the organizers in #hacky-holidays!
-
----
-
-# **Designing your PCB**
-For this guide, we are going to be using KiCad, so if you are using a different tool your steps might be a bit different!
+---
-First, open up KiCad, and go to File → New Project… and name it whatever you want! Just make sure you name it something you remember so you can come back to it :P
+## Designing Your PCB
-![image.png](https://cloud-ho0oo25ks-hack-club-bot.vercel.app/0image__67_.png)
+For this guide, we are going to be using KiCad. If you are using a different tool, your steps might be a bit different!
-Then Click on the **Schematic Editor** Button. It will take you to a blank page where you will start designing your PCB!
+First, open up KiCad, and go to `File → New Project…` and name it whatever you want! Just make sure you name it something you remember so you can come back to it!
-![image (3).png](https://prod-files-secure.s3.us-west-2.amazonaws.com/51907c75-c258-4bc2-9858-58c3dcad7100/4c6c1b0e-1052-4e21-b6f9-44eefa94f9ae/b38b9519-5210-4b7c-9046-fbd9882d3ce7.png)
+![KiCad New Project](https://prod-files-secure.s3.us-west-2.amazonaws.com/51907c75-c258-4bc2-9858-58c3dcad7100/b3897a23-5653-4616-953d-ac8a225d7be7/image.png)
-Now it’s time to branch off…. Click on the link with the microcontroller you plan to use!
+Then click on the **Schematic Editor** button. It will take you to a blank page where you will start designing your PCB!
-Xiao Esp32C3
+![Schematic Editor](https://prod-files-secure.s3.us-west-2.amazonaws.com/51907c75-c258-4bc2-9858-58c3dcad7100/4c6c1b0e-1052-4e21-b6f9-44eefa94f9ae/b38b9519-5210-4b7c-9046-fbd9882d3ce7.png)
-2nd Microcontroller
-
---
-
-# **Programming your PCB**
+
+## Programming Your PCB
To program your PCB, use the Arduino IDE and the Neopixels library! Here is a helpful resource to help you get started:
-https://learn.adafruit.com/adafruit-neopixel-uberguide/arduino-library-use
+[Adafruit Neopixel Uberguide](https://learn.adafruit.com/adafruit-neopixel-uberguide/arduino-library-use)
+
+To simulate your code, you can use [Wokwi](https://wokwi.com/projects/new/esp32-c3).
+
+---
+
+## Submissions & Manufacturing
+
+Once you are ready to submit, create a PR in **OnBoard** with the Hacky-Holidays tag and submit your PR to this form!
+
+PRs must include multiple things:
+
+1. Schematic of your Board
+2. Link to Wokwi with the board working
+
+Once your PR gets approved and you are ready to order, we will order the PCB for you and ship it to your address!
+
+---
+
+## Additional Resources
-# Submissions & Manufacturing
-
\ No newline at end of file
+- [General Info](https://www.notion.so/General-Info-153a1dc89099809d86c0fda32bbf66a9?pvs=21)
+- [How to wire up your LEDs](https://www.notion.so/How-to-wire-up-your-LEDs-154a1dc890998077b10aecd282861452?pvs=21)
\ No newline at end of file
diff --git a/app/guide/page.tsx b/app/guide/page.tsx
index 6724798..4be9fd0 100644
--- a/app/guide/page.tsx
+++ b/app/guide/page.tsx
@@ -1,40 +1,151 @@
"use client";
-import { keyframes } from '@emotion/react'
-import GuideMD from './guideMD.mdx'
-import { MDXProvider } from '@mdx-js/react'
-import components from '../components/mdx'
-const fadeIn = keyframes({ from: { opacity: 0 }, to: { opacity: 1 } })
-import { Box } from 'theme-ui'
-// const components = {
-// h1: (props) => ,
-// h2: (props) => ,
-// h3: (props) => ,
-// p: (props) => ,
-// // Add more custom components as needed
-// }
+import { keyframes } from '@emotion/react';
+import GuideMD from './guideMD.mdx';
+import { MDXProvider } from '@mdx-js/react';
+import components from '../components/mdx';
+import { Box } from 'theme-ui';
+import Image from 'next/image';
+import SideBar from "../components/SideBar";
+import Link from 'next/link';
+
+const fadeIn = keyframes({ from: { opacity: 0 }, to: { opacity: 1 } });
+
export default function guide() {
return (
-
-
-
-
-
-
+
+ {/* Header */}
+
+
+
+
+
+ HACKY HOLIDAYS
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* Sidebar */}
+
+
+
+
+ {/* Main Content */}
+
+
+
+
+
+
-
-);
+ );
}
\ No newline at end of file
diff --git a/app/page.tsx b/app/page.tsx
index 98ca6d1..55ea7cd 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,33 +1,18 @@
"use client";
-
/* eslint-disable @typescript-eslint/no-unused-vars */
import { keyframes } from '@emotion/react';
import Snowfall from 'react-snowfall';
-// import '@google/model-viewer';
-// import Script from 'next/script';
import { useEffect } from 'react';
-// import { tipitytopity } from './components/top'
-// import Image from "next/image";
-import {
- Box,
- Button,
- Container,
- Image,
- Grid,
- Heading,
- Text,
-} from 'theme-ui';
-const Footer = dynamic(() => import('./components/footer'), { ssr: false });
-
+import { Box, Image, Heading, Grid } from 'theme-ui';
import dynamic from 'next/dynamic';
+
+const Footer = dynamic(() => import('./components/footer'), { ssr: false });
const Top = dynamic(() => import('./components/top'), { ssr: false });
-const FAQcard = dynamic(() => import('./components/FAQcard'), {ssr: false});
+const FAQcard = dynamic(() => import('./components/FAQcard'), { ssr: false });
const ThreeGrid = dynamic(() => import('./components/3box'), { ssr: false });
-// const ModelViewer = dynamic(() => import('./ModelViewer'), { ssr: false });
-const ModelViewer = dynamic(() => import('./ModelViewer'), { ssr: false });
-const fall = ( rotationDirection: number) => keyframes`
+const fall = (rotationDirection: number) => keyframes`
from {
transform: translateY(-10%) rotate(0deg);
}
@@ -42,134 +27,100 @@ export default function Home() {
import('@google/model-viewer');
}
}, []);
- return (
-
-
-
-
-
-
+ return (
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
+
-
-
-
-
- Want a cool christmas decoration? A cool gift for someone you know? Design a unique PCB decoration from scratch and submit it via PR to OnBoard before the 30th!
- Once your PR gets approved, you will get your PCB decoration just in time for the holidays!🎄
-
-
-
- At the end, Submissions will be peer-reviewed and voted for the top 3. The top 3 will be re-made, and can be given out as gifts!