[FEATURE] Adjusted order and styles (#11)
Co-authored-by: dunemask <dunemask@gmail.com> Reviewed-on: https://gitea.dunemask.dev/elysium/nile/pulls/11
This commit is contained in:
parent
6ea87ae742
commit
7cc7539c94
11 changed files with 61 additions and 35 deletions
|
@ -17,7 +17,7 @@
|
|||
<meta name="og:site_name" content="dunemask.net" />
|
||||
<meta name="og:url" content="dunemask.net" />
|
||||
<meta name="og:type" content="website" />
|
||||
<meta name="og:image" content="/images/og.jpg" />
|
||||
<meta name="og:image" content="/images/og.png" />
|
||||
<meta name="author" content="Elijah Parker (Dunemask)" />
|
||||
<meta
|
||||
name="keywords"
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
h1 {
|
||||
font-family: "Dejavu Sans";
|
||||
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
|
||||
font-size: 33px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
|
@ -9,7 +9,7 @@ h1 {
|
|||
|
||||
h2,
|
||||
label {
|
||||
font-family: "Dejavu Sans";
|
||||
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
|
||||
font-size: 28px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
|
@ -18,7 +18,7 @@ label {
|
|||
}
|
||||
|
||||
h3 {
|
||||
font-family: "Dejavu Sans";
|
||||
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
|
||||
font-size: 24px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
|
@ -28,7 +28,7 @@ h3 {
|
|||
|
||||
p,
|
||||
a {
|
||||
font-family: "Dejavu Sans";
|
||||
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
|
||||
font-size: 18px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
|
@ -37,7 +37,7 @@ a {
|
|||
}
|
||||
|
||||
blockquote {
|
||||
font-family: "Dejavu Sans";
|
||||
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
|
||||
font-size: 21px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
|
@ -47,7 +47,7 @@ blockquote {
|
|||
|
||||
pre,
|
||||
span {
|
||||
font-family: "Dejavu Sans";
|
||||
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
|
||||
font-size: 13px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
|
|
BIN
public/images/og.png
Normal file
BIN
public/images/og.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 103 KiB |
Before Width: | Height: | Size: 39 KiB After Width: | Height: | Size: 39 KiB |
|
@ -18,9 +18,9 @@ import MenuIcon from "@mui/icons-material/Menu";
|
|||
|
||||
const links = [
|
||||
// { url: "/", title: "Home" },
|
||||
{ url: "/#about", title: "About" },
|
||||
{ url: "/#portfolio", title: "Portfolio" },
|
||||
// { url: "/#achievements", title: "Achievements" },
|
||||
{ url: "/#about", title: "About" },
|
||||
{ url: "/#contact", title: "Contact" },
|
||||
// { url: "/resume", title: "Resume" },
|
||||
];
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
border-radius: 50%;
|
||||
border: 1px solid #f3ac20;
|
||||
color: #f3ac20;
|
||||
transition: 0.7s;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.contact-icon:hover {
|
||||
|
|
|
@ -37,14 +37,9 @@ export default function About() {
|
|||
padding: "0 2rem",
|
||||
textAlign: "left",
|
||||
}}
|
||||
style={{ scrollMarginTop: "4rem" }}
|
||||
style={{ scrollMarginTop: "6rem" }}
|
||||
id="about"
|
||||
>
|
||||
<div style={{ display: "flex" }}>
|
||||
<Typography variant="h2" sx={{ margin: "2rem auto", fontSize: 30 }}>
|
||||
About
|
||||
</Typography>
|
||||
</div>
|
||||
<Box sx={{ display: "flex", flexWrap: "wrap" }}>
|
||||
{!fullSizePhoto && (
|
||||
<img
|
||||
|
@ -82,7 +77,7 @@ export default function About() {
|
|||
}}
|
||||
>
|
||||
<Typography variant="h6" component="div" sx={{ fontWeight: 600 }}>
|
||||
React Fullstack Software Engineer
|
||||
About
|
||||
</Typography>
|
||||
<Typography variant="body1">
|
||||
Hello! I'm Elijah Parker, a fullstack software engineer from Utah.
|
||||
|
@ -111,7 +106,7 @@ export default function About() {
|
|||
href="mailto:elijahglennparker@outlook.com"
|
||||
style={{ textDecoration: "none", fontSize: "14px" }}
|
||||
>
|
||||
elijahglennparker@outlook.com
|
||||
elijah@dunemask.net
|
||||
</a>
|
||||
}
|
||||
/>
|
||||
|
|
|
@ -1,29 +1,29 @@
|
|||
import React, { Suspense } from "react";
|
||||
import Box from "@mui/material/Box";
|
||||
import Header from "./Header.jsx";
|
||||
import Projects from "./Projects.jsx";
|
||||
import About from "./About.jsx";
|
||||
import Education from "./Education.jsx";
|
||||
import Experience from "./Experience.jsx";
|
||||
import Contact from "./Contact.jsx";
|
||||
//import Environments from "./Environments.jsx";
|
||||
import ContentWrapper from "@components/ContentWrapper.jsx";
|
||||
|
||||
const Skills = React.lazy(() => import("./Skills.jsx"));
|
||||
const Social = React.lazy(() => import("./Social.jsx"));
|
||||
const Education = React.lazy(() => import("./Education.jsx"));
|
||||
const Experience = React.lazy(() => import("./Experience.jsx"));
|
||||
const About = React.lazy(() => import("./About.jsx"));
|
||||
|
||||
const Projects = React.lazy(() => import("./Projects.jsx"));
|
||||
export default function Delta() {
|
||||
return (
|
||||
<ContentWrapper id="delta">
|
||||
<Header />
|
||||
<Projects />
|
||||
<Suspense>
|
||||
<About />
|
||||
<Box style={{ display: "flex", flexWrap: "wrap" }}>
|
||||
<Education />
|
||||
|
||||
<Experience />
|
||||
</Box>
|
||||
<About />
|
||||
<Box style={{ display: "flex", flexWrap: "wrap" }}>
|
||||
<Education />
|
||||
|
||||
<Experience />
|
||||
</Box>
|
||||
<Suspense>
|
||||
<Projects />
|
||||
<Skills />
|
||||
<Social />
|
||||
</Suspense>
|
||||
|
|
|
@ -1,10 +1,38 @@
|
|||
import { useState } from "react";
|
||||
import Box from "@mui/material/Box";
|
||||
import Chip from "@mui/material/Chip";
|
||||
import useMediaQuery from "@mui/material/useMediaQuery";
|
||||
import { useTheme } from "@mui/material/styles";
|
||||
import Typography from "@mui/material/Typography";
|
||||
import { SiGitea } from "react-icons/si";
|
||||
|
||||
function ProjectLanguages(props) {
|
||||
const { languages, smallMode } = props;
|
||||
if (!languages || languages.length === 0) return;
|
||||
return (
|
||||
<Box
|
||||
sx={{
|
||||
display: "flex",
|
||||
flexWrap: "wrap",
|
||||
justifyContent: smallMode ? "center" : "",
|
||||
gap: smallMode ? ".25rem" : ".5rem",
|
||||
marginTop: smallMode ? "5rem" : ".5rem",
|
||||
width: "80%",
|
||||
maxWidth: 512,
|
||||
margin: smallMode ? "auto" : "",
|
||||
}}
|
||||
>
|
||||
{languages.map((l, i) => (
|
||||
<Chip
|
||||
key={i}
|
||||
label={l}
|
||||
sx={{ borderRadius: "5px", margin: smallMode ? ".25rem" : "" }}
|
||||
/>
|
||||
))}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default function ProjectTile({
|
||||
image,
|
||||
title,
|
||||
|
@ -13,6 +41,7 @@ export default function ProjectTile({
|
|||
disableGutter,
|
||||
openPhoto,
|
||||
link,
|
||||
languages,
|
||||
}) {
|
||||
const theme = useTheme();
|
||||
const smallMode = useMediaQuery(theme.breakpoints.down("md"));
|
||||
|
@ -113,6 +142,7 @@ export default function ProjectTile({
|
|||
{description}
|
||||
</Typography>
|
||||
</div>
|
||||
<ProjectLanguages languages={languages} smallMode={smallMode} />
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
|
|
|
@ -32,6 +32,7 @@ export default function Projects() {
|
|||
year="2023"
|
||||
link="https://gitea.dunemask.dev/elysium/minecluster"
|
||||
openPhoto={openPhoto}
|
||||
languages={["React", "Express", "Kubernetes"]}
|
||||
>
|
||||
Deploy and monitor MInecraft servers in your kubernetes cluster. Easily
|
||||
scales and provides a stateful experience to make managing multiple
|
||||
|
@ -43,6 +44,7 @@ export default function Projects() {
|
|||
year="2022"
|
||||
link="https://gitea.dunemask.dev/elysium/qualiteer"
|
||||
openPhoto={openPhoto}
|
||||
languages={["React", "Express", "Kubernetes", "PostgreSQL", "RabbitMQ"]}
|
||||
>
|
||||
Manage failing tests and silence unecessary alerts. Check the state of
|
||||
your services worldwide and improve developer confidence with a simple
|
||||
|
@ -54,6 +56,7 @@ export default function Projects() {
|
|||
year="2021"
|
||||
link="https://gitea.dunemask.dev/elysium/khufu"
|
||||
openPhoto={openPhoto}
|
||||
languages={["React", "Express"]}
|
||||
>
|
||||
Basic cloud file management built on React class components. Simple
|
||||
interface allows users to upload, delete, and multiple files.
|
||||
|
@ -64,6 +67,7 @@ export default function Projects() {
|
|||
year="2020"
|
||||
link="https://gitea.dunemask.dev/dunemask/codepen"
|
||||
openPhoto={openPhoto}
|
||||
languages={["HTML5", "CSS"]}
|
||||
>
|
||||
Visual replication of the website{" "}
|
||||
<a
|
||||
|
@ -80,6 +84,7 @@ export default function Projects() {
|
|||
year="2018"
|
||||
link="https://legacy-21.dunemask.net/files/java/MoviePlayer.jar"
|
||||
openPhoto={openPhoto}
|
||||
languages={["Java", "JavaFX"]}
|
||||
>
|
||||
Simple media player built on javafx. Player supports media seeking,
|
||||
playback controls, and speed distortion.
|
||||
|
@ -90,6 +95,7 @@ export default function Projects() {
|
|||
year="2018"
|
||||
link="https://gitea.dunemask.dev/dunemask/voxelcraft"
|
||||
openPhoto={openPhoto}
|
||||
languages={["JavaFX"]}
|
||||
>
|
||||
Voxel game built on a simple rendering engine written with JavaFX.
|
||||
Generate your terrain and form your ideal world by exploring and
|
||||
|
|
|
@ -160,12 +160,7 @@ export default function Skills() {
|
|||
flexWrap: "wrap",
|
||||
}}
|
||||
>
|
||||
<Box style={{ flex: 1, textAlign: "left", width: "100%" }}>
|
||||
<div style={{ display: "flex", paddingTop: 30 }}>
|
||||
<Typography variant="h2" sx={{ margin: "2rem auto", fontSize: 30 }}>
|
||||
Pluralsight IQ
|
||||
</Typography>
|
||||
</div>
|
||||
<Box sx={{ flex: 1, textAlign: "left", width: "100%", pt: "2.5rem" }}>
|
||||
<Box
|
||||
sx={{
|
||||
width: "100%",
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue