diff --git a/src/Resume.jsx b/src/Resume.jsx
index b38424bc..93cf1284 100644
--- a/src/Resume.jsx
+++ b/src/Resume.jsx
@@ -1,5 +1,4 @@
import React from "react";
-import PdfViewer from "./components/PdfViewer";
/*
* Page to display my Resume.
@@ -8,12 +7,84 @@ import PdfViewer from "./components/PdfViewer";
* TODO: Convert resume to a React component, with a link to save as PDF
*/
export default function Resume() {
+ /*
+ *
+ {
+ company: "",
+ title: "",
+ start: "",
+ end: "",
+ location: "",
+ responsibilities: [
+ "",
+ ],
+ },
+
+ */
+ const jobData = [
+ {
+ company: "SLC Public Library",
+ title: "Technology & Digital Equity Assistant",
+ start: "Aug. 2023",
+ end: "Present",
+ location: "Salt Lake City, UT",
+ responsibilities: [
+ "Assist library patrons with using technology, on devices such as publicly available PCs, laptops, mobile devices, and more.",
+ "Teach fundamental computer usage skills.",
+ "Expose patrons to the importance of digital security, password management, and two-factor authentication.",
+ "Developing workshop curriculum for Raspberry Pi’s."
+ ],
+ },
+ {
+ company: "Trust Lands Administration",
+ title: "IT Intern",
+ start: "Aug. 2023",
+ end: "Aug. 2024",
+ location: "Salt Lake City, UT",
+ responsibilities: [
+ "Orchestrated Microsoft Intune setup and deployment to multiple platforms.",
+ "Streamlined IT equipment inventory process",
+ "Provided training to optimize the usage of hardware and software.",
+ "Troubleshoot and repair hardware and software on a variety of devices.",
+ "Developed automation scripts for use in various parts of the business.",
+ ],
+ },
+ ];
return (
<>
-
Resume
-
+
Josh Ashton
+
Junior Full-Stack Developer
+
Work Experience
+ {jobData.map((job, index) => (
+
+ ))}
+
Coding Experience
>
);
}
+
+function Job({ company, title, start, end, location, responsibilities }) {
+ return (
+ <>
+
+
+
+
+
{company}
+ - {location}
+
+
{start} - {end}
+
+
{title}
+
+
+ {responsibilities.map((r, index) => (
+ - {r}
+ ))}
+
+
+ >
+ )
+}
diff --git a/src/main.css b/src/main.css
index b774b62e..8ba1e3ef 100644
--- a/src/main.css
+++ b/src/main.css
@@ -41,39 +41,64 @@ body {
background-attachment: fixed;
}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+li {
+ color: var(--text);
+}
+
h1 {
font-size: clamp(4.25rem, 5.5vw, 10rem);
font-weight: 600;
letter-spacing: 2px;
width: max-content;
- color: var(--text);
}
-h3,
-h4 {
- color: var(--text);
- font-weight: 300;
- line-height: 1.5;
+h2,
+h3 {
+ font-weight: 600;
+ letter-spacing: 2px;
+ width: max-content;
}
h2 {
font-size: clamp(2rem, 3vw, 4rem);
- font-weight: 600;
- letter-spacing: 2px;
- width: max-content;
- color: var(--text);
}
h3 {
- font-size: clamp(1.5rem, 2vw, 3rem);
+ font-size: clamp(1.5rem, 2rem, 3rem);
}
h4 {
- font-size: clamp(1rem, 1.5vw, 1.25rem);
+ font-weight: 400;
+ line-height: 1.5;
+}
+
+h5,
+h6 {
+ font-weight: 300;
+}
+
+h4 {
+ font-size: clamp(1rem, 1.5vw, 2rem);
+}
+
+h5 {
+ font-size: clamp(1rem, 1.25vw, 1.5rem);
+}
+
+h6 {
+ font-size: clamp(1rem, 1.125vw, 1.25rem);
}
p {
- font-size: clamp(1rem, 1.5rem, 2rem);
+ font-weight: 200;
+ font-size: clamp(1rem, 1.5vw, 2rem);
color: var(--text);
}
@@ -530,6 +555,8 @@ p {
#resume-section {
margin: 2vw;
display: flex;
+ flex-direction: column;
+ align-items: center;
}
/**PDF Viewer**/
@@ -692,6 +719,40 @@ p {
width: 50%;
}
+.job {
+ width: 100%;
+ border: 1px solid white;
+}
+
+.job-header-row {
+ display: grid;
+ grid-template-columns: 70% 30%;
+ align-items: center;
+}
+
+.job-time {
+ justify-self: right;
+ justify-content: right;
+}
+
+.company-and-location {
+ display: flex;
+ align-items: center;
+}
+
+.company-and-location h6 {
+ margin-left: .25vw;
+}
+
+.job-list {
+ margin: 0 auto;
+ width: 90%;
+}
+
+.job-list-item {
+ font-weight: 300;
+}
+
/**Animations**/
@keyframes background-fade {
from {