andrew/asimonson1125.github.io
1
0
Fork 0
mirror of https://github.com/asimonson1125/asimonson1125.github.io.git synced 2026-02-25 05:09:49 -06:00
Code Issues Packages Projects Releases Wiki Activity

implement checkbox filtering + timeline animations

Browse Source
This commit is contained in:
Andrew Simonson
2023-01-08 15:20:21 -06:00
parent 894a2e4053
commit c07ea50491
7 changed files with 108 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/pages/AboutMe.js
View File

@@ -5,6 +5,7 @@ import ChessBed from "../componets/ChessBed.js";
import Skills from "../componets/Skills";
import Timeline from '../componets/Timeline';
import TimeItem from "../componets/TimeItem.js";
import { toggle } from "../scripts/checkbox";
// import img1 from '../assets/photos/itsa_me.JPG'
// import img2 from '../assets/photos/me_robot.jpeg'
// import img3 from "../assets/photos/AcademicTeam.jpg";
@@ -134,9 +135,32 @@ export default function AboutMe() {
</div> */}
</div>
<div className="col">
<Timeline>
<TimeItem date='01/2023' title="Co-op @ Dow Chemical">Bottomtext</TimeItem>
<TimeItem date='08/2021' title='Started Computer Science BS at RIT'></TimeItem>
<div className="checkbox-wrapper">
<div className="flex start">
<label className="switch" htmlFor="pinned">
<input type="checkbox" id="pinned" onClick={() => toggle('up')} defaultChecked/>
<div className="slider round"></div>
<strong>Pinned</strong>
</label>
</div>
<div className="flex start">
<label className="switch" htmlFor="education">
<input type="checkbox" id="education" onClick={() => toggle('up')} />
<div className="slider round"></div>
<strong>Education</strong>
</label>
</div>
<div className="flex start">
<label className="switch" htmlFor="experience" onClick={() => toggle('up')}>
<input type="checkbox" id="experience" />
<div className="slider round"></div>
<strong>Experience</strong>
</label>
</div>
</div>
<Timeline classes="checkbox-client">
<TimeItem date='01/2023' title="Co-op @ Dow Chemical" classes="pinned experience">Bottomtext</TimeItem>
<TimeItem date='08/2021' title='Started Computer Science BS at RIT' classes="pinned education"></TimeItem>
</Timeline>
</div>
</div>