ethanglide/portfolio-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Reorder projects

Browse Source 
Change css class cosmotica-wrapper to youtube-wrapper since projects other than cosmotica use the class

Change order of projects to be from most to least impressive
This commit is contained in:
ethanglide 2024-01-29 14:08:38 -05:00
parent 0a76bad6cf
commit 65538cdbd1
2 changed files with 28 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
index.html
View File

@ -110,7 +110,7 @@ communication and product knowledge to drive customer engagement and satisfactio
<div class="section"> <div class="section">
<h2>Projects</h2> <h2>Projects</h2>
<div class="experience"> <div class="experience">
<div class="cosmotica-wrapper"> <div class="youtube-wrapper">
<div> <div>
<iframe <iframe
src="https://www.youtube.com/embed/HS9tsFQpMUA?si=8mIM_T5hKvkPNSYb&controls=0&autoplay=1&mute=1&loop=1&playlist=HS9tsFQpMUA" src="https://www.youtube.com/embed/HS9tsFQpMUA?si=8mIM_T5hKvkPNSYb&controls=0&autoplay=1&mute=1&loop=1&playlist=HS9tsFQpMUA"
@ -140,6 +140,28 @@ and systems design for future additions and bug fixes
</ul> </ul>
</div> </div>
</div> </div>
<div class="experience">
<div class="youtube-wrapper">
<div>
<iframe
src="https://www.youtube.com/embed/rsZMfWVyc90?si=jERn5iKCQvnH3Y_g&controls=0&autoplay=1&mute=1&loop=1&playlist=rsZMfWVyc90"
title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"></iframe>
</div>
</div>
<div class="experience-text">
<div class="experience-header">
<h2><a href="https://ethanglide.itch.io/solitude-echoes" target="_blank">Solitude Echoes</a> | Unity 2D Game Development</h2>
<p>12/2023</p>
</div>
<ul>
<li>Developed in 9 days for the Unity Developer Community Game Jam #28, with the theme "Silence"</li>
<li>Puzzle/Horror game where you wake up in a decrepid dungeon and have to find your way out, while being stalked by the monsters within</li>
<li>Led an international team of 5 people, with programmers, artists, musicians, and level designers</li>
<li>Game is playable completely within the browser</li>
</ul>
</div>
</div>
<div class="experience"> <div class="experience">
<div class="course-planner-wrapper"> <div class="course-planner-wrapper">
<div> <div>
@ -168,7 +190,7 @@ and systems design for future additions and bug fixes
</div> </div>
</div> </div>
<div class="experience"> <div class="experience">
<div class="cosmotica-wrapper"> <div class="youtube-wrapper">
<div> <div>
<img src="./Pictures/telepuzzle.png" alt="telepuzzle demo"> <img src="./Pictures/telepuzzle.png" alt="telepuzzle demo">
</div> </div>
@ -191,25 +213,6 @@ and systems design for future additions and bug fixes
</ul> </ul>
</div> </div>
</div> </div>
<div class="experience">
<div class="solitude-wrapper">
<div>
<img src="./Pictures/solitudeechoes.png" alt="solitude echoes demo">
</div>
</div>
<div class="experience-text">
<div class="experience-header">
<h2><a href="https://ethanglide.itch.io/solitude-echoes" target="_blank">Solitude Echoes</a> | Unity 2D Game Development</h2>
<p>12/2023</p>
</div>
<ul>
<li>Developed in 9 days for the Unity Developer Community Game Jam #28, with the theme "Silence"</li>
<li>Puzzle/Horror game where you wake up in a decrepid dungeon and have to find your way out, while being stalked by the monsters within</li>
<li>Led an international team of 5 people, with programmers, artists, musicians, and level designers</li>
<li>Game is playable completely within the browser</li>
</ul>
</div>
</div>
</div> </div>
<div class="section"> <div class="section">
<h2>Programming Languages, Tools, and Frameworks</h2> <h2>Programming Languages, Tools, and Frameworks</h2>

30
style.css
View File

@ -207,18 +207,18 @@ div.jump-wrapper > div > img {
border-radius: 1rem; border-radius: 1rem;
} }
div.cosmotica-wrapper { div.youtube-wrapper {
width: 50%; width: 50%;
max-width: 20rem; max-width: 20rem;
} }
div.cosmotica-wrapper > div { div.youtube-wrapper > div {
position: relative; position: relative;
width: 100%; width: 100%;
padding-bottom: 56.25%; padding-bottom: 56.25%;
} }
div.cosmotica-wrapper > div > iframe, div.cosmotica-wrapper > div > img { div.youtube-wrapper > div > iframe, div.youtube-wrapper > div > img {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
@ -251,28 +251,6 @@ div.course-planner-wrapper > div > img {
border-radius: 0.5rem; border-radius: 0.5rem;
} }
div.solitude-wrapper {
width: 10%;
min-width: 12rem;
}
div.solitude-wrapper > div {
position: relative;
width: 100%;
padding-bottom: 100%;
}
div.solitude-wrapper > div > img {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
height: 100%;
width: 100%;
border-radius: 0.5rem;
}
div.experience { div.experience {
display: flex; display: flex;
gap: 2rem; gap: 2rem;
@ -337,7 +315,7 @@ div.experience-header {
grid-template-columns: repeat(3, min(33%)); grid-template-columns: repeat(3, min(33%));
} }
div.cosmotica-wrapper { div.youtube-wrapper {
width: 100%; width: 100%;
min-width: 0; min-width: 0;
} }