82 lines
2.4 KiB
JavaScript
82 lines
2.4 KiB
JavaScript
import { useState } from "react";
|
|
import Box from "@mui/material/Box";
|
|
|
|
import ProjectTile from "./ProjectTile.jsx";
|
|
import PhotoHover from "./PhotoHover.jsx";
|
|
|
|
export default function Projects() {
|
|
const [image, setImage] = useState();
|
|
const [open, setOpen] = useState(false);
|
|
|
|
function openPhoto(image) {
|
|
setImage(image);
|
|
setOpen(true);
|
|
}
|
|
|
|
return (
|
|
<Box style={{ padding: 10, scrollMarginTop: "4rem" }} id="portfolio">
|
|
<PhotoHover
|
|
image={image}
|
|
open={open}
|
|
setOpen={setOpen}
|
|
alt={"Missing Project Photo"}
|
|
/>
|
|
<div style={{ display: "flex" }}>
|
|
<h3 style={{ fontSize: "1.75rem", margin: "2rem auto" }}>Portfolio</h3>
|
|
</div>
|
|
<ProjectTile
|
|
image="/portfolio/projects/qualiteer.png"
|
|
title="Qualiteer"
|
|
year="2022"
|
|
openPhoto={openPhoto}
|
|
>
|
|
Manage failing tests and silence unecessary alerts. Check the state of
|
|
your services worldwide and improve developer confidence with a simple
|
|
interface.
|
|
</ProjectTile>
|
|
<ProjectTile
|
|
image="/portfolio/projects/khufu.png"
|
|
title="Khufu"
|
|
year="2021"
|
|
openPhoto={openPhoto}
|
|
>
|
|
Basic cloud file management built on React class components. Simple
|
|
interface allows users to upload, delete, and multiple files.
|
|
</ProjectTile>
|
|
<ProjectTile
|
|
image="/portfolio/projects/codepen.png"
|
|
title="Codepen"
|
|
year="2020"
|
|
openPhoto={openPhoto}
|
|
>
|
|
Visual replication of the website{" "}
|
|
<a
|
|
href="https://codepen.io"
|
|
style={{ color: "black", fontFamily: "inherit" }}
|
|
>
|
|
codepen.io
|
|
</a>{" "}
|
|
webpage in 2020. Simple demonstration of css and html
|
|
</ProjectTile>
|
|
<ProjectTile
|
|
image="/portfolio/projects/movieplayer.png"
|
|
title="Media Player"
|
|
year="2018"
|
|
openPhoto={openPhoto}
|
|
>
|
|
Simple media player built on javafx. Player supports media seeking,
|
|
playback controls, and speed distortion.
|
|
</ProjectTile>
|
|
<ProjectTile
|
|
image="/portfolio/projects/voxelcraft.png"
|
|
title="Voxelcraft"
|
|
year="2018"
|
|
openPhoto={openPhoto}
|
|
>
|
|
Voxel game built on a simple rendering engine written with JavaFX.
|
|
Generate your terrain and form your ideal world by exploring and
|
|
harvesting resources.
|
|
</ProjectTile>
|
|
</Box>
|
|
);
|
|
}
|