diff options
Diffstat (limited to 'showcase/projects/index.html')
| -rw-r--r-- | showcase/projects/index.html | 63 |
1 files changed, 63 insertions, 0 deletions
diff --git a/showcase/projects/index.html b/showcase/projects/index.html new file mode 100644 index 0000000..bf7945c --- /dev/null +++ b/showcase/projects/index.html @@ -0,0 +1,63 @@ +<!doctype html> +<html lang="en"><head><meta charset="utf-8"> +<meta name="viewport" content="width=device-width,initial-scale=1"> +<link rel="stylesheet" href="../css/main.css"> +<link rel="shortcut icon" href="../i/me.png"> +<title>Name's Website: Projects</title></head><body> + +<header> + <h1><a id="nav-btn">☰</a> + <a href="..">My Projects</a> + <i>Name's Website</i></h1> +</header> + +<nav id="menu"> + <a href=".." class="btn">Home</a> + <a href="" class="btn">Projects</a> + <a href="../classes" class="btn">Classes</a> + <a href="../contact" class="btn">Contact</a> + <a href="../template" class="btn">Template</a> + <a href="http://github.com/4stc/porter" class="btn">Source</a> + <i>Name / Projects</i> +</nav> + +<main class="grid"><div> + <h2>Projects & What I Learned</h2><br> + <h3>Unit 1 Project <a href="../portfolio" target="_blank">(View)</a></h3><hr> + <p>I learned how to create and style websites using HTML and CSS. This website had a header, navigation area, main content section, and a footer.</p><br> + <video controls> + <source src="../v/portfolio.webm" type="video/webm"> + <source src="../v/portfolio.mp4" type="video/mp4"> + <p>video on request</p> + <p>The video isn't loading. Try using a different browser</p> + </video> + <img src="../i/portfolio.png" alt="screenshot of unit 1 project"><hr><br><br> + <h3>Unit 2 Project <a href="../tech" target="_blank">(View)</a></h3><hr> + <p>I learned how to make websites that can adapt well to different types of devices. This website made heavy use of grids, especially for image galleries.</p><br> + <video controls> + <source src="../v/tech.webm" type="video/webm"> + <source src="../v/tech.mp4" type="video/mp4"> + <p>video on request</p> + <p>The video isn't loading. Try using a different browser</p> + </video> + <img src="../i/tech.png" alt="screenshot of unit 2 project"><hr><br><br> + <h3>Unit 3 Project <a href="../bike" target="_blank">(View)</a></h3><hr> + <p>I learned how to add and adaptively style more complex HTML elements. This website used a table, a form, and embedded videos.</p><br> + <video controls> + <source src="../v/bike.webm" type="video/webm"> + <source src="../v/bike.mp4" type="video/mp4"> + <p>video on request</p> + <p>The video isn't loading. Try using a different browser</p> + </video> + <img src="../i/bike.png" alt="screenshot of unit 3 project"><hr><br><br> +</div></main> + +<footer> + <p>Made by Name Surname | + <a href="../i/projects_mobile.png" target="_blank">Mobile Wireframe</a> | + <a href="../i/projects_desktop.png" target="_blank">Desktop Wireframe</a> + </p> +</footer> + +<script src="../js/main.js"></script> +</body></html> |