MichaelBradley/website
MichaelBradley/website
1
0
Fork 0
Code Issues Pull requests Activity Actions

Start work towards using tabs

Browse source
This commit is contained in:
Michael Bradley 2024-07-07 20:39:38 -04:00
parent 63d114ca5e
commit d987b7c514
3 changed files with 191 additions and 173 deletions
Download patch file Download diff file Expand all files Collapse all files

5
README.md
View file

@ -2,3 +2,8 @@
A basic static personal website hosted on GitHub Pages.
Contains some basic information about me along with some of my interests.
## TODO
* TODOs in files
* Automate minifying and push to site?

37
index.html
View file

@ -3,7 +3,8 @@
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="style.css" />
<link href="https://fonts.cdnfonts.com/css/jetbrains-mono" rel="stylesheet" />
<!--TODO: Optimize loading?-->
<!--<link href="https://fonts.cdnfonts.com/css/jetbrains-mono" rel="stylesheet" />-->
<title>Michael Bradley</title>
<meta lang="EN" />
@ -16,7 +17,7 @@
<meta name="description" content="Michael Bradley's personal website" />
<meta name="subject" content="Self-advertisement" />
<meta name="robots" content="index,follow" />
<meta name="summary" content="Michael Bradley is a skilled developer looking for a co-op job this summer" />
<meta name="summary" content="Michael Bradley is a CS student looking for a full-time job starting in February" />
<meta name="url" content="https://MichaelMBradley.github.io" />
<meta property="og:type" content="website" />
@ -27,11 +28,11 @@
<meta property="og:url" content="https://MichaelMBradley.github.io" />
<meta property="og:site" content="Michael Bradley" />
<meta property="og:title" content="Michael's Personal website" />
<meta property="og:title" content="Michael's personal website" />
<meta property="og:description" content="A summary of my education, skills, and some projects I've worked on." />
<meta property="og:image" content="https://MichaelMBradley.github.io/assets/thumb.png" />
<meta property="og:image:secure_url" content="https://MichaelMBradley.github.io/assets/thumb.png" />
<meta property="og:image:alt" content="Michael Bradley is a skilled developer looking for a co-op job this summer." />
<meta property="og:image:alt" content="Michael Bradley is a CS student looking for a full-time job starting in February" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image:width" content="4203" />
<meta property="og:image:height" content="2253" />
@ -103,6 +104,7 @@
</svg>
</label>
<div id="fetch">
<!--TODO: Automate screenshot of this div as preview photo?-->
<div id="michael-photo-container">
<img src="assets/MichaelBradley.jpg" alt="A picture of me in a suit smiling" id="michael-photo">
</div>
@ -147,8 +149,10 @@
</svg>
</a>
</div>
<div class="tab-container">
<a id="projects"></a>
<a href="#projects">Projects</a>
<div class="info-section">
<h1>Projects</h1>
<div class="info-group">
<h2>dotfiles</h2>
<p>
@ -202,15 +206,9 @@
</a>
</div>
</div>
<a id="work"></a>
<a href="#work">Work Experience</a>
<div class="info-section">
<h1>Accomplishments</h1>
<ul>
<li>2023 - Nominated for Carleton University's Co-op of the Year award</li>
<li>2021 - Awarded the Dean's Summer Research Internship</li>
</ul>
</div>
<div class="info-section">
<h1>Work Experience</h1>
<div class="info-group">
<h2>Emids</h2>
<p>
@ -263,8 +261,17 @@
<p>May-Aug 2021</p>
</div>
</div>
<a id="accomplishments"></a>
<a href="#accomplishments">Accomplishments</a>
<div class="info-section">
<ul>
<li>2023 - Nominated for Carleton University's Co-op of the Year award</li>
<li>2021 - Awarded the Dean's Summer Research Internship</li>
</ul>
</div>
<a id="courses"></a>
<a href="#courses">Courses</a>
<div class="info-section">
<h1>Notable Courses</h1>
<div class="info-group">
<h2>Introduction to Machine Learning</h2>
<p>
@ -316,5 +323,7 @@
</ul>
</div>
</div>
</div>
</body>
</html>

6
style.css
View file

@ -321,12 +321,16 @@ h1, h2 {
margin-left: 5rem;
margin-right: 5rem;
display: flex;
display: none;
flex-direction: column;
align-items: center;
row-gap: 2rem;
}
a:target + a + .info-section {
display: flex;
}
.info-group {
display: flex;
flex-direction: column;