93 lines
6 KiB
HTML
93 lines
6 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
<title>Marley Rae</title>
|
|
|
|
<link rel="preconnect" href="https://fonts.bunny.net">
|
|
<link href="https://fonts.bunny.net/css?family=delius-swash-caps:400" rel="stylesheet">
|
|
|
|
<link rel="stylesheet" href="/style.css">
|
|
<script src="/main.js" type="module"></script>
|
|
|
|
<script src="/fontawesome/fontawesome.min.js" defer=""></script>
|
|
<script src="/fontawesome/regular.min.js" defer=""></script>
|
|
<script src="/fontawesome/solid.min.js" defer=""></script>
|
|
<script src="/fontawesome/brands.min.js" defer=""></script>
|
|
</head>
|
|
<body class="Body">
|
|
|
|
<div class="Site">
|
|
|
|
<header class="Header">
|
|
<h1 class="Header-title" id="headerTitle">Marley Rae</h1>
|
|
<div class="Header-email">marleyrae@protonmail.com</div>
|
|
</header>
|
|
|
|
<main class="Main">
|
|
<div class="Carousel" id="carousel"><div class="Carousel-item"><img src="/portfolio/punkfairie.net.png" alt="Screenshot of punkfairie.net" class="Carousel-img"><div class="Carousel-title">
|
|
<a href="https://github.com/punkfairie/punkfairie-site" target="_blank" rel="noreferrer"><i class="fa-brands fa-github" title="Github"></i></a> /
|
|
|
|
punkfairie.net/ <a href="https://punkfairie.net/" target="_blank" rel="noreferrer"><i class="fa-solid fa-link" title="Visit project"></i></a></div>
|
|
|
|
<p class="Carousel-text">A personal site; includes blinkie collections and a diary (blog).</p><p class="Carousel-text">Made with Eleventy, SCSS, and PostCSS.</p></div><div class="Carousel-item"><img src="/portfolio/saudade.png" alt="Screenshot of punkfairie.net" class="Carousel-img"><div class="Carousel-title">
|
|
<a href="https://github.com/punkfairie/saudade" target="_blank" rel="noreferrer"><i class="fa-brands fa-github" title="Github"></i></a> /
|
|
|
|
saudade/ <a href="https://saudade.punkfairie.net/" target="_blank" rel="noreferrer"><i class="fa-solid fa-link" title="Visit project"></i></a></div>
|
|
|
|
<p class="Carousel-text">An archive of petz/babyz/oddballz sites.</p><p class="Carousel-text">Made with Gulp, PostCSS, and PostHTML.</p></div><div class="Carousel-item"><div class="Carousel-title">
|
|
<a href="https://github.com/punkfairie/ed-safari" target="_blank" rel="noreferrer"><i class="fa-brands fa-github" title="Github"></i></a> /
|
|
|
|
ED Safari</div>
|
|
|
|
<p class="Carousel-text">Inspired by ED Scout; an exploration tool for the game Elite Dangerous</p><p class="Carousel-text">Made with Electron, Typescript, and Jest.</p></div><div class="Carousel-item"><div class="Carousel-title">
|
|
<a href="https://github.com/punkfairie/codecademy" target="_blank" rel="noreferrer"><i class="fa-brands fa-github" title="Github"></i></a> /
|
|
|
|
Codecademy Exercises</div>
|
|
|
|
<p class="Carousel-text">Various Codecademy exercises.</p></div><div class="Carousel-item"><div class="Carousel-title">
|
|
<a href="https://github.com/punkfairie/odin-rock-paper-scissors" target="_blank" rel="noreferrer"><i class="fa-brands fa-github" title="Github"></i></a> /
|
|
|
|
Odin: Rock, Paper, Scissors</div>
|
|
|
|
<p class="Carousel-text">The Odin Project exercise.</p></div><div class="Carousel-item"><img src="/portfolio/results-summary-component.png" alt="Screenshot of punkfairie.net" class="Carousel-img"><div class="Carousel-title">
|
|
<a href="https://github.com/punkfairie/frontend-mentor/tree/main/results-summary-component" target="_blank" rel="noreferrer"><i class="fa-brands fa-github" title="Github"></i></a> /
|
|
|
|
Frontend Mentor: Results Summary/ <a href="https://frontend-mentor-gold-five.vercel.app/" target="_blank" rel="noreferrer"><i class="fa-solid fa-link" title="Visit project"></i></a></div>
|
|
|
|
<p class="Carousel-text">Exercise for Frontend Mentor.</p><p class="Carousel-text">Made with Vite and PostCSS.</p></div><div class="Carousel-item"><div class="Carousel-title">
|
|
<a href="https://github.com/punkfairie/frontend-mentor/tree/main/interactive-rating-component" target="_blank" rel="noreferrer"><i class="fa-brands fa-github" title="Github"></i></a> /
|
|
|
|
Frontend Mentor: Interactive Rating Component</div>
|
|
|
|
<p class="Carousel-text">Exercise for Frontend Mentor.</p><p class="Carousel-text">Made with Vite, Typescript, and Vue.js.</p></div><div class="Carousel-item"><img src="/portfolio/product-preview-card-component.png" alt="Screenshot of punkfairie.net" class="Carousel-img"><div class="Carousel-title">
|
|
<a href="https://github.com/punkfairie/frontend-mentor/tree/main/product-preview-card-component" target="_blank" rel="noreferrer"><i class="fa-brands fa-github" title="Github"></i></a> /
|
|
|
|
Frontend Mentor: Product Preview Card/ <a href="https://product-preview-card-component-zeta-teal.vercel.app/" target="_blank" rel="noreferrer"><i class="fa-solid fa-link" title="Visit project"></i></a></div>
|
|
|
|
<p class="Carousel-text">Exercise for Frontend Mentor.</p><p class="Carousel-text">Made with Vite.</p></div><div class="Carousel-item"><div class="Carousel-title">
|
|
<a href="https://github.com/punkfairie/elite-matrix" target="_blank" rel="noreferrer"><i class="fa-brands fa-github" title="Github"></i></a> /
|
|
|
|
Elite Matrix</div>
|
|
|
|
<p class="Carousel-text">A small JS/TS library for working with the Elite Dangerous color matrix.</p><p class="Carousel-text">Made with Typescript.</p></div></div>
|
|
|
|
<button class="Carousel-controls Carousel-controls--left" id="carousel-prev">
|
|
<i class="fa-solid fa-chevron-left" title="Previous item"></i>
|
|
</button>
|
|
|
|
<button class="Carousel-controls Carousel-controls--right" id="carousel-next">
|
|
<i class="fa-solid fa-chevron-right" title="Next item"></i>
|
|
</button>
|
|
</main>
|
|
|
|
<footer class="Footer" id="footer">
|
|
© 2023
|
|
</footer>
|
|
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|