import { pageRoutes } from "data/routes";
import React from "react";
import { basePath } from "utils/getBasePath";

import { About } from "@/components/About";
import { CenterWrapper } from "@/components/CenterWrapper";
import { Header } from "@/components/Header";
import { Sections } from "@/components/Sections";
import { Title } from "@/components/Title";

import styles from "./frontpage.module.css";

export default function Home() {
  return (
    <>
      <Header />
      <div className={styles.main}>
        <Title>Home</Title>
        <div className={styles.title}>
          <div className={styles.titleImage}>
            <img
              src={basePath + "/images/frontPageTitle.png"}
              alt="A picture of the University of Waterloo campus"
            />
          </div>
          <div className={styles.blurb}>
            <h1 className={styles.classYear}>UW Computer Science 2022</h1>
            <h1 className={styles.classProfile}>Class Profile</h1>
            <h3>Welcome to UW Computer Science 2022 Class Profile.</h3>
            <a href="#about">
              <button className={styles.viewButton}>View</button>
            </a>
          </div>
          <div className={styles.decoratorSolid} />
          <div className={styles.decoratorDots} />
        </div>
        <About />
        <CenterWrapper>
          <h1>Preface</h1>
          <p>
            The CS Class Profile consists of data relevant to CS, CFM, and
            CS/BBA students. These were combined with the knowledge that
            students in these programs tend to have similar experiences, as many
            of the same CS required courses are shared. In the standard co-op
            offering, CS and CFM take 4 years and 2 semesters to complete, while
            CS/BBA can take up to a full 5 years.
          </p>
          <p>
            Computer Science (and the others) is known to be a very prestigious
            program, and is very well known in Canada as well as across the
            world. For prospective students or anyone who is interested in
            learning more about what the students are like, this CS Class
            Profile will attempt to answer some of your questions, and you may
            even learn a thing or two you didn’t expect!
          </p>
          <p>
            The survey questions were approved by the Institutional Analysis &
            Planning, where all University of Waterloo stakeholders that are
            interested in conducting a non-academic research survey involving a
            large portion of the UWaterloo population are reviewed and approved.
            The entirety of the survey creation, data processing, and the
            creation of this website was done by the{" "}
            <b>
              <a
                href="https://csclub.uwaterloo.ca"
                target="_blank"
                rel="noreferrer"
              >
                UW Computer Science Club
              </a>
            </b>{" "}
            so please check us out if you enjoy what you see! All of the graphs,
            and designs on this website were built by us!
          </p>
        </CenterWrapper>
        <Sections data={pageRoutes} className={styles.homeSectionsStyles} />
      </div>
    </>
  );
}
