diff --git a/package-lock.json b/package-lock.json index 08dd40d..26962fc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,6 +21,7 @@ "@types/node": "^16.18.113", "@types/react": "^18.3.11", "@types/react-dom": "^18.3.1", + "framer-motion": "^11.17.0", "react": "^18.3.1", "react-dom": "^18.3.1", "react-multi-carousel": "^2.8.5", @@ -9434,6 +9435,32 @@ "url": "https://github.com/sponsors/rawify" } }, + "node_modules/framer-motion": { + "version": "11.17.0", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.17.0.tgz", + "integrity": "sha512-uTNLH9JPMD3ad14WBt3KYRTR+If4tGPLgKTKTIIPaEBMkvazs6EkWNcmCh65qA/tyinOqIbQiuCorXX0qQsNoQ==", + "dependencies": { + "motion-dom": "^11.16.4", + "motion-utils": "^11.16.0", + "tslib": "^2.4.0" + }, + "peerDependencies": { + "@emotion/is-prop-valid": "*", + "react": "^18.0.0 || ^19.0.0", + "react-dom": "^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@emotion/is-prop-valid": { + "optional": true + }, + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, "node_modules/fresh": { "version": "0.5.2", "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz", @@ -12488,6 +12515,19 @@ "mkdirp": "bin/cmd.js" } }, + "node_modules/motion-dom": { + "version": "11.16.4", + "resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-11.16.4.tgz", + "integrity": "sha512-2wuCie206pCiP2K23uvwJeci4pMFfyQKpWI0Vy6HrCTDzDCer4TsYtT7IVnuGbDeoIV37UuZiUr6SZMHEc1Vww==", + "dependencies": { + "motion-utils": "^11.16.0" + } + }, + "node_modules/motion-utils": { + "version": "11.16.0", + "resolved": "https://registry.npmjs.org/motion-utils/-/motion-utils-11.16.0.tgz", + "integrity": "sha512-ngdWPjg31rD4WGXFi0eZ00DQQqKKu04QExyv/ymlC+3k+WIgYVFbt6gS5JsFPbJODTF/r8XiE/X+SsoT9c0ocw==" + }, "node_modules/ms": { "version": "2.1.3", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", diff --git a/package.json b/package.json index 052e2ae..6ea4a8c 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "@types/node": "^16.18.113", "@types/react": "^18.3.11", "@types/react-dom": "^18.3.1", + "framer-motion": "^11.17.0", "react": "^18.3.1", "react-dom": "^18.3.1", "react-multi-carousel": "^2.8.5", diff --git a/src/components/InfoPage.tsx b/src/components/InfoPage.tsx index cfe4bae..92df173 100644 --- a/src/components/InfoPage.tsx +++ b/src/components/InfoPage.tsx @@ -3,6 +3,7 @@ import Typography from '@mui/joy/Typography'; import Card from '@mui/joy/Card'; import CardContent from '@mui/joy/CardContent'; import React, {useState, useEffect} from 'react'; +import { motion } from 'framer-motion'; export default function InfoPage() { const [isMobile, setIsMobile] = useState(false); @@ -22,121 +23,157 @@ export default function InfoPage() { return (
{!isMobile && (
- - - Where Boundaries Fade and Ideas Flourish - MVHacks is proud to give a platform for aspiring tech enthusiasts to grow and learn by making unique projects that progress society. - - - - - Workshops and advice to help you grow - With specialized judges that are currently in the tech industry, at MVHacks you'll receive the best feedback to help you improve. - - - - - Real world collaboration and innovation - The MVHacks schedule is currently in development, but expect team-building exercises, workshops, and challenges! - - + + + Where Boundaries Fade and Ideas Flourish + MVHacks is proud to give a platform for aspiring tech enthusiasts to grow and learn by making unique projects that progress society. + + + + + + + Workshops and advice to help you grow + With specialized judges that are currently in the tech industry, at MVHacks you'll receive the best feedback to help you improve. + + + + + + + Real world collaboration and innovation + The MVHacks schedule is currently in development, but expect team-building exercises, workshops, and challenges! + + +
)} {isMobile && (
- - - Where Boundaries Fade and Ideas Flourish - MVHacks is proud to give a platform for aspiring tech enthusiasts to grow and learn by making unique projects that progress society. - - - - - Workshops and advice to help you grow - With specialized judges that are currently in the tech industry, at MVHacks you'll receive the best feedback to help you improve. - - - + + + Where Boundaries Fade and Ideas Flourish + MVHacks is proud to give a platform for aspiring tech enthusiasts to grow and learn by making unique projects that progress society. + + + + + + + Workshops and advice to help you grow + With specialized judges that are currently in the tech industry, at MVHacks you'll receive the best feedback to help you improve. + + + + - - Real world collaboration and innovation - The MVHacks schedule is currently in development, but expect team-building exercises, workshops, and challenges! - - + + + Real world collaboration and innovation + The MVHacks schedule is currently in development, but expect team-building exercises, workshops, and challenges! + + +
)}
); diff --git a/src/components/Title.tsx b/src/components/Title.tsx index 9342663..17b1470 100644 --- a/src/components/Title.tsx +++ b/src/components/Title.tsx @@ -58,7 +58,7 @@ export default function Title() { level="body-lg" variant="plain" textColor="common.white" - sx={{maxWidth: "500px", marginLeft: "10%", marginRight: "10%", marginBottom:"20px", fontSize: {xs: "4vw", sm: "4vw", md: "3vw", lg: "1.25vw"} }} + sx={{maxWidth: "500px", marginLeft: "10%", marginRight: "10%", marginBottom:"20px", marginTop: "10px", fontSize: {xs: "4vw", sm: "4vw", md: "3vw", lg: "1.25vw"} }} > Each year, high school hackers from across the Bay Area come together at MVHacks to create cool projects, learn from experts, and participate in 12 hours of hacking! Hackers of all skill levels are welcome to compete, individually or as a group. The date and time of this event are not finalized yet, but will be in Spring 2025 in the Bay Area.