
Co-authored-by: dunemask <dunemask@gmail.com> Reviewed-on: https://gitea.dunemask.dev/elysium/nile/pulls/10
100 lines
3.2 KiB
JavaScript
100 lines
3.2 KiB
JavaScript
import { useState } from "react";
|
|
import Box from "@mui/material/Box";
|
|
import Typography from "@mui/material/Typography";
|
|
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" }}>
|
|
<Typography variant="h2" sx={{ margin: "2rem auto", fontSize: 30 }}>
|
|
Projects
|
|
</Typography>
|
|
</div>
|
|
<ProjectTile
|
|
image="/portfolio/projects/minecluster.png"
|
|
title="Minecluster"
|
|
year="2023"
|
|
link="https://gitea.dunemask.dev/elysium/minecluster"
|
|
openPhoto={openPhoto}
|
|
>
|
|
Deploy and monitor MInecraft servers in your kubernetes cluster. Easily
|
|
scales and provides a stateful experience to make managing multiple
|
|
servers simple.
|
|
</ProjectTile>
|
|
<ProjectTile
|
|
image="/portfolio/projects/qualiteer.png"
|
|
title="Qualiteer"
|
|
year="2022"
|
|
link="https://gitea.dunemask.dev/elysium/qualiteer"
|
|
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"
|
|
link="https://gitea.dunemask.dev/elysium/khufu"
|
|
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"
|
|
link="https://gitea.dunemask.dev/dunemask/codepen"
|
|
openPhoto={openPhoto}
|
|
>
|
|
Visual replication of the website{" "}
|
|
<a
|
|
href="https://codepen.io"
|
|
style={{ color: "black", fontFamily: "inherit", fontSize: "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"
|
|
link="https://legacy-21.dunemask.net/files/java/MoviePlayer.jar"
|
|
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"
|
|
link="https://gitea.dunemask.dev/dunemask/voxelcraft"
|
|
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>
|
|
);
|
|
}
|