hackmelbourne/hackmelbourne.github.io

HackMelbourne main website

Getting Startsd

1. Clone the repository
2. Once you've cloned the repo, run npm install to install all of the node_modules

   npm install
   

3. To run the development server, run npm run dev

   npm run dev
   

   • 

Developing MelbourneHack2023

• The Melbourne Hack website is in /melbournehack
• Main source is in ./src/hackathonWebsites/MelbourneHack/2023/index.jsx

hackmelbourne.github.io's Issues

feature: Landing hero

Website background redesign

Create a blurred floating circle background (see figma design) with parallax effect

feature: Navigation bar

Hack Melb landing animations

feature: Description boxes

feature: Add custom font and styling to project

Either implement in tailwind or index.css

HM Mobile nav close button

• Create 'x' on top right hand side of nav popup
• Put HM logo on top left of nav popup

UMSU Integration

Link to join UMSU page
Hide Home button on desktop navbar
Show home on mobile
Add “Join Club”
Design footer to include umsu affiliation

Events/Initiatives animation

Landing page hero banner

Create a landing hero section and make sure it is compatible with mobile

Title Hero Component

Meet the team Component

Team component
Person component

Mobile nav close after click

• Close navbar popup after clicking link
• Slide up animation after clicking link
• Scroll reset position

Update website router

feature: Footer

Optimise images

About us images should be square 128px by 128px. (You will need to crop them in a 3rd party app)

Events page image resolution can be made smaller

bugfix: routing issue serving wrong page to links

Getting 404 error when directly accessing links such as This

bugfix: Mobile menu does not automatically close after new page

feature: Banner standard

Make Event Item Component Responsive

feature: Change font and styling to fit HackMelb design guide

Footer Link seperation

• Make links in footer seperated either: all links one line or links have a bigger gap inbetween

feature: Mobile navigation fullscreen popup

feature: Join the team component

Create button component

Mainly for styling consistency purposes

Event Item Component

Basic Animations for Home Page

Just simple animations like fly in one element in in screen.

Use framer Motion:

Eg:
<motion.div initial={{ opacity: 0, scale: 0.9 }} whileInView={{ opacity: 1, scale: 1 }} className="hidden md:block col-start-2 row-start-2 col-span-1 justify-self-center row-span-1 text-6xl">