darkicewolf50/personal_site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

changed to be my resume website and added my photo to github to try to fix it

Browse Source
This commit is contained in:
darkicewolf50 2023-05-12 16:02:13 -06:00
parent 64bb7e5008
commit 2b3b153322
17 changed files with 693 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
Brock_Unicard.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 814 KiB

10
ENSF 381 Assignment Backup/PAGE-ADDRESS.md Normal file
View File

@ -0,0 +1,10 @@
Put the address to your website here. Use this markdown format:
```bash
[display-name](link)
```
example:
```bash
[my website](https://rick-astley.github.io)
```

51
ENSF 381 Assignment Backup/README.md Normal file
View File

@ -0,0 +1,51 @@
# CSS
In this assignment, you will add styling to the webpages you created in the HTML assignment, and will **publish** the website using GitHub pages.
---
## :foot: Steps
1. Add the HTML you wrote for the About page to the `index.html` file
1. Add the HTML you wrote for the Skills page to the `skills.html` file
1. Add the HTML you wrote for the Experience page to the `experience.html` file
1. Add the HTML you wrote for the Education page to the `education.html` file
1. Add the HTML you wrote for the Interests page to the `interests.html` file
1. Use Flexbox and other CSS properties to the `style.css` file so that your pages look like these:
`index.html`
![index-page](https://res.cloudinary.com/mkf/image/upload/v1674680283/ENSF-381/labs/flexbox/about_paafuq.png)
`skills.html`
![skills-page](https://res.cloudinary.com/mkf/image/upload/v1674680283/ENSF-381/labs/flexbox/skills_kudlfj.png)
`education.html`
![education-page](https://res.cloudinary.com/mkf/image/upload/v1674680283/ENSF-381/labs/flexbox/education_d9hixu.png)
`experience.html`
![experience-page](https://res.cloudinary.com/mkf/image/upload/v1674680283/ENSF-381/labs/flexbox/experience_zjyrux.png)
`interests.html`
![interests-page](https://res.cloudinary.com/mkf/image/upload/v1674680283/ENSF-381/labs/flexbox/interests_oa1rhh.png)
1. Change the content so they represent you (your picture, your education, your experince, etc.)
1. Make sure all the links are working if applicable (for instance, you don't have to add a Pinterest page if you don't have one, but the link to your resume should work)
1. Make sure the website is responsive at least on Desktop and Tablet devices (use `@media` queries for this). Here's an example of how it should react to screen size changes:
![responsive](https://res.cloudinary.com/mkf/image/upload/v1674681793/ENSF-381/labs/flexbox/responsive-small_nakjwj.gif)
1. It doesn't matter what threshold you're using for the `@media` query (`800px`, `600px`, etc.)
1. Commit all the changes to the `main` branch and push to the remote repo (here)
1. Create a **public** repo under your **personal** GitHub account with this name: `<your-github-username>.github.io`
1. Clone the repo to your local system; add all the files you have here to the project; commit to the `main` branch and push to the remote repo (your repo under your GitHub username)
1. Open up a browser and go to `https://<your-github-username>.github.io`. You should be able to see the website (it may take a few minutes)
1. Add the address to your webpage to the [`PAGE-ADDRESS.md`](./PAGE-ADDRESS.md) file
1. Commit to the `main` branch and push to the remote repo (here)
---
### :page_with_curl: Notes
- Make sure you save what you had for the About page in the `index.html` page. That's the default page that the browser shows when someone visits your website
- Make sure you alter the data on the examples so that the website represents you, not Rick
- Don't use any CSS frameworks for this assignment. You need to write all the CSS yourself
- Use Flexbox for the layout
- Feel free to make minor changes, such as changing colors and font-sizes
- Feel free to add new elements, data, etc.
- You may need to change some of the HTML elements you used in the HTML assignment. One example is the navigation menu. You probably choose a paragraph to do that. For this assignment, it makes more sense to use `<nav>`, `<ul>`, and `<li>` for the navigation (hint: I created a similar one in the class). So, feel free to use new HTML elements if they make more sense now

33
ENSF 381 Assignment Backup/contact.html Normal file
View File

@ -0,0 +1,33 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="description" content="Student grades and complain form">
<title>Rick Astley</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav>
<p><a href="index.html"> About</a></p>
<p><a href="skills.html">Skills</a></p>
<p><a href="education.html">Education</a></p>
<p><a href="experience.html"">Experience</a></p>
<p><a href="interests.html">Inertests</a></p>
<p><a id="CurrentPage">Contact</a></p>
</nav>
<div>
<figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley">
<figcaption><h1>Rick Astley</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption>
</figure>
</div>
<footer>
<p>© Rick Astley</p>
</footer>
</body>
</html>

54
ENSF 381 Assignment Backup/education.html Normal file
View File

@ -0,0 +1,54 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="description" content="Student grades and complain form">
<title>Rick Astley</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav>
<p><a href="index.html"> About</a></p>
<p><a href="skills.html">Skills</a></p>
<p><a id="CurrentPage">Education</a></p>
<p><a href="experience.html">Experience</a></p>
<p><a href="interests.html">Inertests</a></p>
<p><a href="contact.html">Contact</a></p>
</nav>
<div>
<figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley">
<figcaption><h1>Rick Astley</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption>
</figure>
<article>
<h1>Education</h1>
<table>
<tr>
<td><strong>PhD in Computer Engineering </strong></td>
<td class="Align-Right">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;2014-2018</td>
</tr>
<tr>
<td>University of Calgary</td>
<td class="Align-Right">Calgary, Canada</td>
</tr>
<tr>
<td style="padding-top: 5%;"><strong>MSc in Computer Engineering </strong></td>
<td class="Align-Right" style="padding-top: 5%;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;2012-2014</td>
</tr>
<tr>
<td>University of Calgary</td>
<td class="Align-Right">Calgary, Canada</td>
</tr>
</table>
<p class="MorePadding" style="color: grey;">Credentials are available upon request.</p>
</article>
</div>
<footer>
<p>© Rick Astley</p>
</footer>
</body>
</html>

55
ENSF 381 Assignment Backup/experience.html Normal file
View File

@ -0,0 +1,55 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="description" content="Student grades and complain form">
<title>Rick Astley</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav>
<p><a href="index.html"> About</a></p>
<p><a href="skills.html">Skills</a></p>
<p><a href="education.html">Education</a></p>
<p><a id="CurrentPage">Experience</a></p>
<p><a href="interests.html">Inertests</a></p>
<p><a href="contact.html">Contact</a></p>
</nav>
<div>
<figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley">
<figcaption><h1>Rick Astley</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption>
</figure>
<article>
<h1>Experience</h1>
<table>
<tr>
<td><strong>Software Developer</strong></td>
<td class="Align-Right">&nbsp; &nbsp; 2018-Present</td>
</tr>
<tr>
<td>Facebook</td>
<td class="Align-Right">Menlo Park, CA</td>
</tr>
<tr>
<td style="padding-top: 5%;"><strong>Web Developer</strong></td>
<td class="Align-Right" style="padding-top: 5%;">&nbsp; &nbsp; &nbsp; &nbsp;2016-2018</td>
</tr>
<tr>
<td>Amazon</td>
<td class="Align-Right">Vancouver, BC</td>
</tr>
</table>
<p class="MorePadding">Download my full resume <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">here.</a></p>
</article>
</div>
<footer>
<p>© Rick Astley</p>
</footer>
</body>
</html>

55
ENSF 381 Assignment Backup/index.html Normal file
View File

@ -0,0 +1,55 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="description" content="Student grades and complain form">
<title>Rick Astley</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav>
<p><a id="CurrentPage">About</a></p>
<p><a href="skills.html">Skills</a></p>
<p><a href="education.html">Education</a></p>
<p><a href="experience.html">Experience</a></p>
<p><a href="interests.html">Inertests</a></p>
<p><a href="contact.html">Contact</a></p>
</nav>
<div>
<figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley">
<figcaption><h1>Rick Astley</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption>
</figure>
<article>
<h1>About</h1>
<p>I'm an English singer, songwriter and radio personality, who has been active in music for several decades. You've probably already seen my video by clicking on random links on the Internet!</p>
<p>A few points about me: I will never</p>
<table>
<tr>
<td><input type="checkbox" checked>Give You Up</td>
<td><input type="checkbox" checked>Make You Cry</td>
</tr>
<tr>
<td><input type="checkbox" checked>Let You Down</td>
<td><input type="checkbox" checked>Say Goodbye</td>
</tr>
<tr>
<td><input type="checkbox" checked>Tell A Lie</td>
<td><input type="checkbox" checked>Run Around</td>
</tr>
<tr>
<td><input type="checkbox" checked>Desert You</td>
<td><input type="checkbox" checked>Hurt You</td>
</tr>
</table>
</article>
</div>
<footer>
<p>© Rick Astley</p>
</footer>
</body>
</html>

42
ENSF 381 Assignment Backup/interests.html Normal file
View File

@ -0,0 +1,42 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="description" content="Student grades and complain form">
<title>Rick Astley</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav>
<p><a href="index.html"> About</a></p>
<p><a href="skills.html">Skills</a></p>
<p><a href="education.html">Education</a></p>
<p><a href="experience.html">Experience</a></p>
<p><a id="CurrentPage">Inertests</a></p>
<p><a href="contact.html">Contact</a></p>
</nav>
<div>
<figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley">
<figcaption><h1>Rick Astley</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption>
</figure>
<article>
<h1>Interests</h1>
<ul>
<li>Reading</li>
<li>Programming</li>
<li>Playing the violin</li>
<li>Running</li>
<li>Photography (see my work on <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">Pinterest</a>)</li>
</ul>
</article>
</div>
<footer>
<p>© Rick Astley</p>
</footer>
</body>
</html>

58
ENSF 381 Assignment Backup/skills.html Normal file
View File

@ -0,0 +1,58 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="description" content="Student grades and complain form">
<title>Rick Astley</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav>
<p><a href="index.html"> About</a></p>
<p><a id="CurrentPage">Skills</a></p>
<p><a href="education.html">Education</a></p>
<p><a href="experience.html">Experience</a></p>
<p><a href="interests.html">Inertests</a></p>
<p><a href="contact.html">Contact</a></p>
</nav>
<div>
<figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley">
<figcaption><h1>Rick Astley</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption>
</figure>
<article>
<h1>Skills</h1>
<p>
<strong>Golang</strong>
<progress value="100" max="100"></progress>
</p>
<p>
<strong>HTML</strong>
<progress value="100" max="100"></progress>
</p>
<p>
<strong>Terraform</strong>
<progress value="90" max="100"></progress>
</p>
<p>
<strong>CSS</strong>
<progress value="70" max="100"></progress>
</p>
<p>
<strong>JavaScript</strong>
<progress value="65" max="100"></progress>
</p>
<p>
<strong>AWS</strong>
<progress value="60" max="100"></progress>
</p>
</article>
</div>
<footer>
<p>© Rick Astley</p>
</footer>
</body>
</html>

201
ENSF 381 Assignment Backup/style.css Normal file
View File

@ -0,0 +1,201 @@
body {
margin: 0px;
display: flex;
flex-direction: column;
color: gray;
}
nav{
background-color: #fcfcfc;
justify-content: center;
display: flex;
padding-top: 5px;
border-top: solid purple;
margin-top: 5px;
padding-bottom: 5px;
border-bottom: thin solid rgb(231, 231, 231);
font-weight: lighter;
font-size: larger;
}
nav p a{
text-decoration: none;
text-align: center;
color: rgb(110, 121, 130);
margin: 10px;
padding: 15px;
flex: 1;
}
div {
display: flex;
justify-content: center;
margin-top: 10px;
flex-direction: row;
}
figure {
margin: 10px;
justify-content: center;
text-align: center;
width: 20%;
}
article {
padding-left: 15px;
border-left: thin solid rgb(244, 244, 244);;
width: 45%;
}
a {
text-decoration: none;
color: purple;
}
img {
margin-top: 0px;
border-radius: 60%;
height: 40%;
border: solid grey;
}
footer p {
display: flex;
justify-content: center;
padding-top: 15px;
border-top: thin solid rgb(244, 244, 244);
font-size: small;
}
article h1 {
font-size: xx-large;
}
progress {
width: 100%;
border-radius: 8px;
border-color: whitesmoke;
}
table {
padding-top: 5%;
width: 90%;
}
article strong {
font-weight: bolder;
font-size: larger;
display: block;
}
article {
color: black;
}
h1 {
font-weight: lighter;
color: gray;
margin-bottom: 0px;
padding-bottom: 15px;
}
h3 {
font-weight: lighter;
margin: 5px;
}
h5 {
font-weight: lighter;
margin: 0px;
}
ul {
list-style-type: '-';
padding-top: 2%;
}
ul li {
font-size: large;
padding-top: 2%;
}
#CurrentPage {
color: purple ;
}
.MorePadding {
padding-top: 5%;
}
.Align-Right {
justify-content: flex-end;
}
@media only screen and (max-width: 800px) {
body {
justify-content: center;
}
div {
display: flex;
margin-top: 10px;
flex-direction: column;
}
nav{
background-color: #fcfcfc;
justify-content: center;
display: flex;
padding-top: 5px;
border-top: solid purple;
margin-top: 5px;
padding-bottom: 5px;
border-bottom: thin solid rgb(231, 231, 231);
font-weight: lighter;
font-size: large;
}
nav p a{
text-decoration: none;
text-align: center;
color: rgb(110, 121, 130);
margin: 5px;
padding: 5px;
}
figure {
margin: 5px;
margin-bottom: 0px;
border-bottom: 0px;
padding-bottom: 0px;
justify-content: center;
text-align: center;
width: inherit;
}
article {
justify-content: center;
padding-left: 0px;
border-left: none;
width: inherit;
}
article h1 {
justify-content: center;
text-align: center;
flex: 1;
}
article table {
width: 100%;
padding-right: 0px;
margin-right: 0px;
border-right: 0px;
padding-left: 15%;
}
.MorePadding {
padding-top: 5%;
text-align: center;
}
}

14
contact.html
View File

@ -4,7 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<meta name="description" content="Student grades and complain form"> <meta name="description" content="Student grades and complain form">
<title>Rick Astley</title> <title>Brock - Contact</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
</head> </head>
@ -19,15 +19,17 @@
</nav> </nav>
<div> <div>
<figure> <figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley"> <img src="Brock_Unicard.png" alt="Photo of Brock Tomlinson as of (Aug 29, 2021)">
<figcaption><h1>Rick Astley</h1></figcaption> <figcaption><h1>Brock Tomlinson</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption> <figcaption><h3>Student Software Engineer</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption> <figcaption><h4>Email I check: </h5><h4><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">darkicewolf50@gmail.com</a></h4></figcaption>
<figcaption><h4>Professional Email: </h5><h4><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">brock@eatsleepski.com</a></h4></figcaption>
<figcaption<h5>Phone Number: 1-250-946-6196</h5></figcaption>
</figure> </figure>
</div> </div>
<footer> <footer>
<p>© Rick Astley</p> <p>© Brock Tomlinson</p>
</footer> </footer>
</body> </body>
</html> </html>

39
education.html
View File

@ -4,7 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<meta name="description" content="Student grades and complain form"> <meta name="description" content="Student grades and complain form">
<title>Rick Astley</title> <title>Brock - Education</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
</head> </head>
@ -18,37 +18,46 @@
<p><a href="contact.html">Contact</a></p> <p><a href="contact.html">Contact</a></p>
</nav> </nav>
<div> <div>
<figure> <figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley"> <img src="Brock_Unicard.png" alt="Photo of Brock Tomlinson as of (Aug 29, 2021)">
<figcaption><h1>Rick Astley</h1></figcaption> <figcaption><h1>Brock Tomlinson</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption> <figcaption><h3>Student Software Engineer</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption> <figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">darkicewolf50@gmail.com</a></h5></figcaption>
</figure> <figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">brock@eatsleepski.com</a></h5></figcaption>
</figure>
<article> <article>
<h1>Education</h1> <h1>Education</h1>
<table> <table>
<tr> <tr>
<td><strong>PhD in Computer Engineering </strong></td> <td><strong>Bachelor of Science (Software Engineering) </strong></td>
<td class="Align-Right">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;2014-2018</td> <td class="Align-Right">&nbsp; 2021-Present</td>
</tr> </tr>
<tr> <tr>
<td>University of Calgary</td> <td>University of Calgary</td>
<td class="Align-Right">Calgary, Canada</td> <td class="Align-Right">&nbsp; Calgary, Canada</td>
</tr> </tr>
<tr> <tr>
<td style="padding-top: 5%;"><strong>MSc in Computer Engineering </strong></td> <td>Current GPA</td>
<td class="Align-Right" style="padding-top: 5%;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;2012-2014</td> <td>&nbsp; 3.767</td>
</tr> </tr>
<tr> <tr>
<td>University of Calgary</td> <td style="padding-top: 5%;"><strong>Highschool Diploma </strong></td>
<td class="Align-Right">Calgary, Canada</td> <td style="padding-top: 5%;" class="Align-Right">&nbsp; 2017-2021</td>
</tr>
<tr>
<td>The Fernie Academy</td>
<td class="Align-Right">&nbsp; Fernie, Canada</td>
</tr>
<tr>
<td>Graduated GPA</td>
<td>&nbsp; 3.28</td>
</tr> </tr>
</table> </table>
<p class="MorePadding" style="color: grey;">Credentials are available upon request.</p> <p class="MorePadding" style="color: grey;">Credentials are available upon request.</p>
</article> </article>
</div> </div>
<footer> <footer>
<p>© Rick Astley</p> <p>© Brock Tomlinson</p>
</footer> </footer>
</body> </body>
</html> </html>

33
experience.html
View File

@ -4,7 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<meta name="description" content="Student grades and complain form"> <meta name="description" content="Student grades and complain form">
<title>Rick Astley</title> <title>Brock - Experience</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
</head> </head>
@ -18,30 +18,31 @@
<p><a href="contact.html">Contact</a></p> <p><a href="contact.html">Contact</a></p>
</nav> </nav>
<div> <div>
<figure> <figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley"> <img src="Brock_Unicard.png" alt="Photo of Brock Tomlinson as of (Aug 29, 2021)">
<figcaption><h1>Rick Astley</h1></figcaption> <figcaption><h1>Brock Tomlinson</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption> <figcaption><h3>Student Software Engineer</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption> <figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">darkicewolf50@gmail.com</a></h5></figcaption>
</figure> <figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">brock@eatsleepski.com</a></h5></figcaption>
</figure>
<article> <article>
<h1>Experience</h1> <h1>Experience</h1>
<table> <table>
<tr> <tr>
<td><strong>Software Developer</strong></td> <td><strong>Junior, Chassis Sub-team</strong></td>
<td class="Align-Right">&nbsp; &nbsp; 2018-Present</td> <td class="Align-Right">&nbsp; &nbsp; 2022-Present</td>
</tr> </tr>
<tr> <tr>
<td>Facebook</td> <td>Schulich Off-Road (Baja SAE)</td>
<td class="Align-Right">Menlo Park, CA</td> <td class="Align-Right">Calgary, Ab</td>
</tr> </tr>
<tr> <tr>
<td style="padding-top: 5%;"><strong>Web Developer</strong></td> <td style="padding-top: 5%;"><strong>Labourer, Marketing</strong></td>
<td class="Align-Right" style="padding-top: 5%;">&nbsp; &nbsp; &nbsp; &nbsp;2016-2018</td> <td class="Align-Right" style="padding-top: 5%;">&nbsp; &nbsp; &nbsp; &nbsp;2018-Present</td>
</tr> </tr>
<tr> <tr>
<td>Amazon</td> <td>Ghostrider Storage</td>
<td class="Align-Right">Vancouver, BC</td> <td class="Align-Right">Fernie, BC</td>
</tr> </tr>
</table> </table>
<p class="MorePadding">Download my full resume <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">here.</a></p> <p class="MorePadding">Download my full resume <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">here.</a></p>
@ -49,7 +50,7 @@
</article> </article>
</div> </div>
<footer> <footer>
<p>© Rick Astley</p> <p>© Brock Tomlinson</p>
</footer> </footer>
</body> </body>
</html> </html>

36
index.html
View File

@ -4,7 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<meta name="description" content="Student grades and complain form"> <meta name="description" content="Student grades and complain form">
<title>Rick Astley</title> <title>Brock</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
</head> </head>
@ -19,37 +19,21 @@
</nav> </nav>
<div> <div>
<figure> <figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley"> <img src="Brock_Unicard.png" alt="Photo of Brock Tomlinson as of (Aug 29, 2021)">
<figcaption><h1>Rick Astley</h1></figcaption> <figcaption><h1>Brock Tomlinson</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption> <figcaption><h3>Student Software Engineer</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption> <figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">darkicewolf50@gmail.com</a></h5></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">brock@eatsleepski.com</a></h5></figcaption>
</figure> </figure>
<article> <article>
<h1>About</h1> <h1>About</h1>
<p>I'm an English singer, songwriter and radio personality, who has been active in music for several decades. You've probably already seen my video by clicking on random links on the Internet!</p> <p>I'm an learning Software Engineer Student, who is trying to learn the language of how to desgin, develop, and create programs that are to industry sandard and reasonably efficent. I hope to bring the lessions learned from each project I have completed, learning from the mistakes I have made and bringing thm forard into the net project.</p>
<p>A few points about me: I will never</p> <p>As of writing this I hope to bring the knowldge learned from my time at school in Software Engineering onto a Baja SAE car, where we can collect data remotely and graph live data as it come in while we are driving it, as well as salving it for later for future analysis.</p>
<table> <p>I grew up in a small ski town where, I started learning about programming, from of course Minecraft, where I thought the application of this was so futuristic and downright cool that I knew I anted to persure it further. While living there I spend a majority of my time out of school swimming, where I got so good that I was considered top 10 in BC, along with swimming I spend a lot of time volunteering with fundraising events and coaching the disabled.</p>
<tr>
<td><input type="checkbox" checked>Give You Up</td>
<td><input type="checkbox" checked>Make You Cry</td>
</tr>
<tr>
<td><input type="checkbox" checked>Let You Down</td>
<td><input type="checkbox" checked>Say Goodbye</td>
</tr>
<tr>
<td><input type="checkbox" checked>Tell A Lie</td>
<td><input type="checkbox" checked>Run Around</td>
</tr>
<tr>
<td><input type="checkbox" checked>Desert You</td>
<td><input type="checkbox" checked>Hurt You</td>
</tr>
</table>
</article> </article>
</div> </div>
<footer> <footer>
<p>© Rick Astley</p> <p>© Brock Tomlinson</p>
</footer> </footer>
</body> </body>
</html> </html>

25
interests.html
View File

@ -18,25 +18,28 @@
<p><a href="contact.html">Contact</a></p> <p><a href="contact.html">Contact</a></p>
</nav> </nav>
<div> <div>
<figure> <figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley"> <img src="Brock_Unicard.png" alt="Photo of Brock Tomlinson as of (Aug 29, 2021)">
<figcaption><h1>Rick Astley</h1></figcaption> <figcaption><h1>Brock Tomlinson</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption> <figcaption><h3>Student Software Engineer</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption> <figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">darkicewolf50@gmail.com</a></h5></figcaption>
</figure> <figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">brock@eatsleepski.com</a></h5></figcaption>
</figure>
<article> <article>
<h1>Interests</h1> <h1>Interests</h1>
<ul> <ul>
<li>Reading</li> <li>Designing parts in CAD</li>
<li>Programming</li> <li>Programming</li>
<li>Playing the violin</li> <li>Playing the Drums</li>
<li>Running</li> <li>Swimming</li>
<li>Photography (see my work on <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">Pinterest</a>)</li> <li>Streaming (see my former work on <a href="https://www.youtube.com/@darkicewolf50/streams" target="_blank">Youtube</a>)</li>
<li>Playing video games</li>
<li>Cooking</li>
</ul> </ul>
</article> </article>
</div> </div>
<footer> <footer>
<p>© Rick Astley</p> <p>© Brock Tomlinson</p>
</footer> </footer>
</body> </body>
</html> </html>

65
skills.html
View File

@ -4,7 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<meta name="description" content="Student grades and complain form"> <meta name="description" content="Student grades and complain form">
<title>Rick Astley</title> <title>Brock - Skills</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
</head> </head>
<body> <body>
@ -18,41 +18,66 @@
</nav> </nav>
<div> <div>
<figure> <figure>
<img src="https://static.wikia.nocookie.net/agk/images/1/18/21499dba0eec71730fdaa0534a82e163.jpg/revision/latest?cb=20210511185219" alt="Rick Asley"> <img src="Brock_Unicard.png" alt="Photo of Brock Tomlinson as of (Aug 29, 2021)">
<figcaption><h1>Rick Astley</h1></figcaption> <figcaption><h1>Brock Tomlinson</h1></figcaption>
<figcaption><h3>Singer, Songwriter</h3></figcaption> <figcaption><h3>Student Software Engineer</h3></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">rick.astley@meme.com</a></h5></figcaption> <figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">darkicewolf50@gmail.com</a></h5></figcaption>
<figcaption><h5><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">brock@eatsleepski.com</a></h5></figcaption>
</figure> </figure>
<article> <article>
<h1>Skills</h1> <h1>Skills</h1>
<p> <p>
<strong>Golang</strong> <strong>Python</strong>
<progress value="100" max="100"></progress>
</p>
<p>
<strong>HTML</strong>
<progress value="100" max="100"></progress>
</p>
<p>
<strong>Terraform</strong>
<progress value="90" max="100"></progress>
</p>
<p>
<strong>CSS</strong>
<progress value="70" max="100"></progress> <progress value="70" max="100"></progress>
</p> </p>
<p> <p>
<strong>JavaScript</strong> <strong>HTML</strong>
<progress value="85" max="100"></progress>
</p>
<p>
<strong>Terraform</strong>
<progress value="65" max="100"></progress> <progress value="65" max="100"></progress>
</p> </p>
<p>
<strong>CSS</strong>
<progress value="55" max="100"></progress>
</p>
<p>
<strong>JavaScript</strong>
<progress value="70" max="100"></progress>
</p>
<p> <p>
<strong>AWS</strong> <strong>AWS</strong>
<progress value="60" max="100"></progress> <progress value="60" max="100"></progress>
</p> </p>
<p>
<strong>YAML</strong>
<progress value="30" max="100"></progress>
</p>
<p>
<strong>C</strong>
<progress value="85" max="100"></progress>
</p>
<p>
<strong>C++</strong>
<progress value="80" max="100"></progress>
</p>
<p>
<strong>LUA</strong>
<progress value="5" max="100"></progress>
</p>
<p>
<strong>Java</strong>
<progress value="30" max="100"></progress>
</p>
<p>
<strong>Manufacturing With Steel</strong>
<progress value="60" max="100"></progress>
</p>
</article> </article>
</div> </div>
<footer> <footer>
<p>© Rick Astley</p> <p>© Brock Tomlinson</p>
</footer> </footer>
</body> </body>
</html> </html>

17
style.css
View File

@ -55,7 +55,7 @@ a {
img { img {
margin-top: 0px; margin-top: 0px;
border-radius: 60%; border-radius: 60%;
height: 40%; height: 20%;
border: solid grey; border: solid grey;
} }
@ -108,6 +108,11 @@ h5 {
margin: 0px; margin: 0px;
} }
h4 {
font-weight: lighter;
margin: 0px;
}
ul { ul {
list-style-type: '-'; list-style-type: '-';
padding-top: 2%; padding-top: 2%;
@ -144,6 +149,7 @@ ul li {
background-color: #fcfcfc; background-color: #fcfcfc;
justify-content: center; justify-content: center;
display: flex; display: flex;
flex-direction: column;
padding-top: 5px; padding-top: 5px;
border-top: solid purple; border-top: solid purple;
margin-top: 5px; margin-top: 5px;
@ -151,6 +157,7 @@ ul li {
border-bottom: thin solid rgb(231, 231, 231); border-bottom: thin solid rgb(231, 231, 231);
font-weight: lighter; font-weight: lighter;
font-size: large; font-size: large;
text-align: center;
} }
nav p a{ nav p a{
@ -169,6 +176,14 @@ ul li {
justify-content: center; justify-content: center;
text-align: center; text-align: center;
width: inherit; width: inherit;
height: 500px;
}
img {
margin-top: 0px;
border-radius: 60%;
height: 50%;
border: solid grey;
} }
article { article {