Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Update site for 2024 launch #238

Merged
merged 2 commits into from
Feb 15, 2024
Merged

Update site for 2024 launch #238

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
c5d7fe5
update site for 2024 launch
waalbert Feb 15, 2024
93a9021
fix: build issues
waalbert Feb 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified public/favicon.ico
View file
Open in desktop
Binary file not shown.
32 changes: 7 additions & 25 deletions src/App.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,34 +1,16 @@
import React from 'react';
import { Route, Switch, Router } from 'react-router-dom';
import history from './history';
import './App.scss';
import React from "react";
import { Route, Switch, Router } from "react-router-dom";
import history from "./history";
import "./App.scss";

import {
Home,
Schedule,
Resources,
Workshops,
NotFound
} from 'app/views';

import {
Nav
} from 'app/components';
import { Home, NotFound } from "app/views";

function App() {
return (
<div className='App'>
<div className="App">
<Router history={history}>
<Nav history={history} />
<Switch>
<Route exact path='/' component={Home} />
<Route exact path='/schedule' component={Schedule} />
<Route exact path='/resources' component={Resources} />
<Route exact path='/workshops' component={Workshops} />
<Route exact path='/devpost' component={() => window.location.replace("https://venushacks-2023.devpost.com/")} />
<Route exact path='/feedback' component={() => window.location.replace("https://docs.google.com/forms/d/e/1FAIpQLSeZn-cH2uNgX1w-WbBIzqTQ2qpT81Sk6jDdcDxvYAbJFe1UVg/viewform")} />
<Route exact path='/midway' component={() => window.location.replace("https://forms.gle/3imPJg2UWXGXjvGT7")} />
<Route exact path='/report' component={() => window.location.replace("https://forms.gle/xzPqKT4YgSWWdRqv8")} />
<Route exact path="/" component={Home} />
<Route path="*" component={NotFound} />
</Switch>
</Router>
Expand Down
8 changes: 4 additions & 4 deletions src/App.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,22 +21,22 @@

h4 {
font-size: 30px;
margin-bottom: .5em;
margin-bottom: 0.5em;
}

h3 {
font-size: 40px;
margin-bottom: .5em;
margin-bottom: 0.5em;
}

h2 {
font-size: 60px;
margin-bottom: .5em;
margin-bottom: 0.5em;
}

h1 {
font-size: 80px;
margin-bottom: .3em;
margin-bottom: 0.3em;
}

button {
Expand Down
215 changes: 39 additions & 176 deletions src/app/views/home/Home.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,82 +1,46 @@
import React from "react";
import './Home.scss';

import FAQs from '../../components/faqs/FAQs';
import Footer from '../../components/footer/Footer';
import Team from '../../components/meet-team/team';
import Speakers from "../../components/speakers/speakers";

import "./Home.scss";

// TITLES
import vh_title from 'assets/images/titles/vh-worded-logo.png';
import about_title from 'assets/images/titles/vh-about.png';
import faq_title from 'assets/images/titles/vh-faq.png';
import sponsors_title from 'assets/images/titles/vh-sponsors.png';
import partners_title from 'assets/images/titles/vh-partners.png';
import speakers_title from 'assets/images/titles/vh-speakers.png';
import meet_team_title from 'assets/images/titles/vh-meet-the-team.png';


// SPONSORS
import coxenterprises from 'assets/images/sponsors/coxenterprises.png';
import odit from 'assets/images/sponsors/odit.png';
import costar from 'assets/images/sponsors/costar.png';
import corelogic from 'assets/images/sponsors/corelogic.png';
import antrepreneurcenter from 'assets/images/sponsors/antrepreneurcenter.png';

// PARTNERS
import acm from 'assets/images/partners/acm.png';
import ai from 'assets/images/partners/ai.png';
import ctc from 'assets/images/partners/ctc.png';
import design from 'assets/images/partners/design.png';
import googlecloud from 'assets/images/partners/googlecloud.png';
import hack from 'assets/images/partners/hack.png';
import icssc from 'assets/images/partners/icssc.png';
import vgdc from 'assets/images/partners/vgdc.jpeg';
import wics from 'assets/images/partners/wics.png';

import { VenusButton } from "app/components";

const VH_DATE = 'May 26-28, 2023';
const CONTACT_EMAIL = '[email protected]';
const CORPORATE_EMAIL = '[email protected]';
import vh_title from "assets/images/titles/vh-title-launch.svg";

// const VH_DATE = "May 26-28, 2023";
const VH_DATE = "Coming Soon!";
export default class Home extends React.Component {

constructor(props) {
super(props);
this.state = {
this.state = {
/* Number of "pages" needed to contain all content under
the about section (faqs, sponsors, meet team, etc).
This number is calculated in updateParallaxLayerHeight().
*/
contentHeight: 8
contentHeight: 8,
};
this.updateParallaxLayerHeight = this.updateParallaxLayerHeight.bind(this);
}

componentDidMount() {
window.addEventListener('resize', this.updateParallaxLayerHeight);
window.addEventListener("resize", this.updateParallaxLayerHeight);
}

componentWillUnmount() {
window.removeEventListener('resize', this.updateParallaxLayerHeight);
window.removeEventListener("resize", this.updateParallaxLayerHeight);
}

/**
* Calculates number of pages that all content under
* the about section (faqs, sponsors, meet team, etc)
* Calculates number of pages that all content under
* the about section (faqs, sponsors, meet team, etc)
* needs and updates this parallax layer
*/
updateParallaxLayerHeight() {
if (this._element && this._element.clientHeight) {
let contentHeight = this._element.clientHeight/window.innerHeight
let contentHeight = this._element.clientHeight / window.innerHeight;
this.setState({ contentHeight: contentHeight });
}
}

/**
* Used to remove floating effect of hero & about
* Used to remove floating effect of hero & about
* sections on smaller screens
*/
isMobileScreen() {
Expand All @@ -92,25 +56,25 @@ export default class Home extends React.Component {
renderSponsorLink(imgId, imgSrc, url) {
return (
<a href={url} target="_blank" rel="noopener noreferrer">
<img
id={imgId}
<img
id={imgId}
className="logo"
src={imgSrc}
src={imgSrc}
alt={"Sponsor: " + imgId}
// needed to resize parallax layer as each image loads
onLoad={this.updateParallaxLayerHeight}
/>
</a>
)
);
}

render() {
/**
* There are 3 main parallax layers:
* There are 3 main parallax layers:
* (1) hero section
* (2) about section
* (3) all other sections
*
*
* (1) and (2) take up one "page" each, where each page
* is equal to 100vh. All other sections are put into
* 1 parallax layer since each sections' number of pages vary
Expand All @@ -119,129 +83,28 @@ export default class Home extends React.Component {
*/
return (
<div className="Home">

{/* HERO **********************/}
<section id="hero">

<div id="astronaut-animation">
{/* These assets are a background of a div instead of imgs to prevent
{/* HERO **********************/}
<section id="hero">
<div id="astronaut-animation">
{/* These assets are a background of a div instead of imgs to prevent
them from being able to be saved to camera roll on iOS */}
<div id="boba" />
<div id="astronaut" />
<div id="laptop" />
<div id="cat" />
</div>

<div id="hero-right">
<img id="venushacks-title" src={vh_title} alt="VenusHacks Title Logo"/>
<h4 id="date">{VH_DATE}</h4>
<p id="tagline">UC Irvine's largest women-centric hackathon</p>
{/* <p id="tagline">Apps are now closed! If you applied, please check your email for your application status.</p> */}
<VenusButton text="DEVPOST" url="/devpost"/>
<VenusButton text="OPENING SLIDES" url="https://docs.google.com/presentation/d/1T5tyLHiz6wc2yIEScvUzOKGqBmmSwFMk8ldt_koBGPs"/>
<VenusButton text="FEEDBACK" url="/feedback"/>
<VenusButton text="MIDWAY CHECK IN" url="/midway"/>
</div>
<div id="planet" />
</section>

{/* ABOUT **********************/}
<section id="about">
<img className="section-title" src={about_title} alt="About"/>
<div id="about-text-container">
<p>
Planned in collaboration with&nbsp;
<a href="https://wics.ics.uci.edu/" target="_blank" rel="noopener noreferrer">WICS</a> and&nbsp;
<a href="https://hack.ics.uci.edu/" target="_blank" rel="noopener noreferrer">Hack at UCI</a>,&nbsp;
VenusHacks is UCI’s largest women-centric hackathon and will take place fully in-person in Spring 2023!
</p>
<p>
Our mission is to empower underrepresented groups by providing an
inclusive community to foster growth and creativity in computing.
VenusHacks will be open to participants of all experience levels, as
we aim to increase diversity in tech through support, exposure, and
community. Join us as we welcome high school (18+), undergraduate, and
graduate students to participate in our 36-hour (non-overnight) event that
includes networking, fun activities, educational workshops, and lots of coding!
</p>
</div>
</section>

<div ref={ref => {this._element = ref}}>

{/* FAQ ************************/}
<section id="faq">
<img className="section-title" src={faq_title} alt="FAQ" />
<FAQs/>
<p id="faq-contact-us">
Additional logistic questions? Contact us at&nbsp;
<a href={`mailto:${CONTACT_EMAIL}`} target="_top">
{CONTACT_EMAIL}
</a>.
</p>
</section>

{/* SPONSORS **********************/}
<section id="sponsors">
<img className="section-title" src={sponsors_title} alt="Sponsor" />
<div id="sponsors-container">
<div className="logo-wrapper largest">
{this.renderSponsorLink("coxenterprises", coxenterprises, "https://www.coxenterprises.com/")}
{this.renderSponsorLink("odit", odit, "https://odit.uci.edu/")}
</div>
<div className="logo-wrapper large">
{this.renderSponsorLink("costar", costar, "https://www.costar.com/")}
</div>
<div className="logo-wrapper medium">
{this.renderSponsorLink("corelogic", corelogic, "https://www.corelogic.com/")}
{this.renderSponsorLink("antrepreneurcenter", antrepreneurcenter, "https://antrepreneur.uci.edu/")}
</div>
</div>
<p className="sponsor-contact-us">
Join our movement, contact us at&nbsp;
<a href={`mailto:${CORPORATE_EMAIL}`} target="_top">
{CORPORATE_EMAIL}
</a>.
</p>
</section>

{/* PARTNERS **********************/}
<section id="partners">
<img className="section-title" src={partners_title} alt="Partners" />
<div id="partners-container">
<div className="logo-wrapper medium">
{this.renderSponsorLink("acm", acm, "https://acm-uci.org/")}
{this.renderSponsorLink("ai", ai, "https://aiclub.ics.uci.edu/")}
{this.renderSponsorLink("ctc", ctc, "https://ctc-uci.com/")}
{this.renderSponsorLink("design", design, "https://designatuci.com/")}
{this.renderSponsorLink("google cloud", googlecloud, "https://cloud.google.com/")}
{this.renderSponsorLink("hack", hack, "https://hack.ics.uci.edu/")}
{this.renderSponsorLink("icssc", icssc, "https://studentcouncil.ics.uci.edu/")}
{this.renderSponsorLink("vgdc", vgdc, "https://sites.google.com/uci.edu/vgdcuci/home")}
{this.renderSponsorLink("wics", wics, "https://wics.ics.uci.edu/")}
</div>
</div>
</section>

{/* SPEAKERS ******************/}
<section id="speakers">
<img className="section-title" src={speakers_title} alt="Speakers" />
<Speakers/>
</section>

{/* MEET THE TEAM ******************/}
{/* Use padding if there's no org photos */}
{/* <section id="padding" /> */}
<section id="meet-team">
<img className="section-title" src={meet_team_title} alt="Meet the Team" />
<Team/>
</section>
<div id="boba" />
<div id="astronaut" />
<div id="laptop" />
<div id="shiba-inu" />
</div>

{/* FOOTER ******************/}
<Footer/>

<div id="hero-right">
<img
id="venushacks-title"
src={vh_title}
alt="VenusHacks Title Logo"
/>
<h4 id="date">{VH_DATE}</h4>
<p id="tagline">UC Irvine's largest women-centric hackathon</p>
</div>
</section>
</div>
)
);
}
}
Loading
Loading