91 lines
3.0 KiB
JavaScript
91 lines
3.0 KiB
JavaScript
import React, { Component } from "react";
|
||
import backgroundVideo from "../assets/videos/video.mp4";
|
||
import "../assets/stylesheets/home.scss";
|
||
import { AnimationOnScroll } from "react-animation-on-scroll";
|
||
import Bubble from "./Bubble";
|
||
import * as Scroll from "react-scroll";
|
||
import "animate.css";
|
||
|
||
export default class Home extends Component {
|
||
scrollToContent() {
|
||
var scroll = require("react-scroll");
|
||
scroll = Scroll.animateScroll;
|
||
scroll.scrollTo(920);
|
||
}
|
||
|
||
componentDidMount() {
|
||
window.scrollTo(0, 0);
|
||
}
|
||
|
||
render() {
|
||
return (
|
||
<div className="home">
|
||
<div className="home__content">
|
||
<div className="home__content__panel">
|
||
<label className="home__content__panel__title">
|
||
<p>ILLINOIS TECH</p>
|
||
<p>ROBOTICS</p>
|
||
</label>
|
||
<button
|
||
className="home__content__panel__button"
|
||
onClick={this.scrollToContent}
|
||
>
|
||
⬇️
|
||
</button>
|
||
<video autoPlay loop muted className="home__content__panel__video">
|
||
<source src={backgroundVideo} type="video/mp4" />
|
||
</video>
|
||
</div>
|
||
|
||
<div className="home__content__info">
|
||
<div className="home__content__info__image">
|
||
<AnimationOnScroll
|
||
className="home__content__info_join"
|
||
animateIn="animate__fadeInRight"
|
||
animateOnce="true"
|
||
duration={1}
|
||
delay={1200}
|
||
>
|
||
<img
|
||
src={require("../assets/pics/fenrir.png")}
|
||
alt="Fenrir"
|
||
></img>
|
||
</AnimationOnScroll>
|
||
</div>
|
||
<Bubble top="10vh" left="10vw" h1="Join us at our" h2="GBMs 🤝">
|
||
<span>
|
||
Welcome to the Illinois Tech Robotics Club! We are a student-run
|
||
organization that promotes the field of robotics through
|
||
hands-on projects, competitions and events. Open to students of
|
||
all majors and skill levels, we meet every week at 6:30pm CST to
|
||
work on exciting robotics projects.
|
||
</span>
|
||
</Bubble>
|
||
<Bubble
|
||
top="5vh"
|
||
left="10vw"
|
||
h1="Directions to the"
|
||
h2="ITR Lab 🗺️"
|
||
>
|
||
<span>
|
||
1. Enter through the{" "}
|
||
<a href="https://goo.gl/maps/NJW5LzDDBYoHiD5X6">IIT Tower</a>{" "}
|
||
located at 10 W 35 St, Chicago, IL.
|
||
<br />
|
||
2. Sign in with the front desk, and then take the elevator to
|
||
the basement.
|
||
<br />
|
||
3. Once in the basement, take a right from the elevator and
|
||
enter the last door on the left.
|
||
<br />
|
||
4. Finally, sign in to the Elevate Underground Lab with the CLA
|
||
on guard!
|
||
</span>
|
||
</Bubble>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
}
|