diff --git a/src/Header/Header.js b/src/Header/Header.js index e1c2d6c..2368017 100644 --- a/src/Header/Header.js +++ b/src/Header/Header.js @@ -76,7 +76,7 @@ export default function Header() {
  • OUR VEHICLES
  • - +
  • HISTORY
  • diff --git a/src/History/History.css b/src/History/History.css new file mode 100644 index 0000000..e69de29 diff --git a/src/History/History.jsx b/src/History/History.jsx new file mode 100644 index 0000000..0f964c0 --- /dev/null +++ b/src/History/History.jsx @@ -0,0 +1,109 @@ +import UpdateBanner from "../Header/UpdateBanner"; +import "./History.css"; + +import { Link } from "react-router-dom"; + +export default function History() { + let historyTimeLineInfo = [ + { + year: "2024-2025", + competitionCarImg: "https://picsum.photos/200", + competitions: [ + { location: "California", placement: "26th" }, + { location: "Williamsport", placement: "65th" }, + ], + }, + { + year: "2023-2024", + competitionCarImg: "https://picsum.photos/200", + competitions: [ + { location: "California", placement: "26th" }, + { location: "Williamsport", placement: "65th" }, + ], + }, + ]; + + return ( +
    + +
    +

    + The history of our cars are below. They include overall competition + results (as well as old competition stats if u wanna include that). + Learn more about what we do at competitoin here. +

    + + + +
    + + {historyTimeLineInfo.map((yearInfo, index) => { + return ( + + {index % 2 === 0 ? ( + <> + + + + + ) : ( + <> + + + + + )} + + ); + })} +
    + {yearInfo.year + {/* Star or circle spot */}* + + + + {/* Star or circle spot */}* + {yearInfo.year +
    +
    + ); +} + +function CompetitionInfo({ year, competitions }) { + return ( + <> +

    {year}

    +

    Overall Competition Results

    + + + ); +} diff --git a/src/index.js b/src/index.js index f5c9ec4..b0396c9 100644 --- a/src/index.js +++ b/src/index.js @@ -12,6 +12,7 @@ import Gallery from "./Gallery/Gallery"; import "./index.css"; import MockPage from "./MockDB/MockPage"; import Home from "./Home/Home"; +import History from "./History/History"; const root = ReactDOM.createRoot(document.getElementById("root")); root.render( @@ -44,6 +45,9 @@ root.render( }> + }>