-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
7 lines (7 loc) · 10.6 KB
/
index.html
1
2
3
4
5
6
7
<!doctype html><html lang=en-us class=h-100><head><meta name=generator content="Hugo 0.119.0"><title>Chris W.</title><meta charset=utf-8><meta name=description content="Chris W.'s web developer portfolio."><meta name=dc.relation content="http://riokei.github.io"><meta name=viewport content="width=device-width,initial-scale=1,shrink-to-fit=no"><script src=https://kit.fontawesome.com/cda496ef33.js crossorigin=anonymous></script>
<link rel=stylesheet type=text/css href=/bootstrap/css/bootstrap.css><link rel=stylesheet type=text/css href=/css/style.css><link rel=stylesheet href=https://cdn.jsdelivr.net/gh/devicons/[email protected]/devicon.min.css><link rel=icon href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>⌨️</text></svg>"></head><body><div id=all><header><nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark"><div class=container-fluid><a class="navbar-brand fs-3" href=http://riokei.github.io>Chris W.</a>
<button class=navbar-toggler type=button data-bs-toggle=collapse data-bs-target=#navbarCollapse aria-controls=navbarCollapse aria-expanded=false aria-label="Toggle navigation">
<span class=navbar-toggler-icon></span></button><div class="collapse navbar-collapse" id=navbarCollapse><ul class="navbar-nav me-auto mb-2 mb-md-0 fs-4"><li class=nav-item><a class=nav-link href=#about>About Me</a></li><li class=nav-item><a class=nav-link href=#projects>Projects</a></li><li class=nav-item><a class=nav-link href=#contact_form>Contact me!</a></li><li class=nav-item><a class=nav-link aria-current=page href=/blog/ title="blog section">Blog</a></li></ul></ul></div></div></nav></header><main><div class="black-background g-0 container-fluid"><section id=welcome class="row py-5 mt-5 align-items-center g-0"><div class="col-xs-12 col-lg-6 col-md-12"></div><div class="col-xs-12 col-lg-4 p-0"><div class="row text-light pt-5 fade-in-text"><h1 class=custom-h1>Hi I'm Chris</h1><h1 class=custom-h1>I am a .NET Developer</h1><h4 class=custom-h4>I love learning and creating, and that "aha! 🤯" moment that comes when you solve a problem.</h4></div><div class="row text-end pe-4 me-4 opacity fade-in-text delay"><div class=col><a href=#contact_form target class="btn btn-outline-light"><i class="fa-solid fa-paper-plane"></i> Hire me!</a></div></div></div></section></div><div class="title bg-dark py-2 ps-4 d-inline-flex justify-content-between mb-5"><div class=align-self-start><h2 id=about class=text-light>About Me</h2></div><div class="text-light align-self-center pe-2"><i class="fa-solid fa-circle fs-3"></i></div></div><div class="container-fluid my-5 px-5"><div class="row pt-5"><div class="col col-lg-6 pt-5 pb-3 border-end border-dark"><h3>Skills</h3><div class="d-flex d-md-inline-flex flex-row justify-content-evenly flex-wrap fs-2 align-items-center"><div class="badge bg-dark p-2 m-2">ASP.NET</div><div class="badge bg-dark p-2 m-2">C#</div><div class="badge bg-dark p-2 m-2">PostgreSQL</div><div class="badge bg-dark p-2 m-2">Javascript</div><div class="badge bg-dark p-2 m-2">Figma</div><div class="w-100 pb-2"></div><div class="badge bg-dark p-2 m-2">Github</div><div class="badge bg-dark p-2 m-2">Visual Studio</div><div class="badge bg-dark p-2 m-2">Bootstrap</div><div class="badge bg-dark p-2 m-2">HTML5/CSS</div><div class="badge bg-dark p-2m-2">Hugo</div></div></div><div class="col col-lg-6 pt-5 pe-4"><h3>About Me</h3><p class="lead fs-4 text-center">Nice to meet you! I've been messing with managing and coding on websites since I was a teen, but it was recently that I buckled down on diving into development. I love tinkering with all sorts of things including but not limited to, 3D modeling, video editing, and photography.</p></div></div></div><div class="title bg-dark py-2 ps-4 d-inline-flex justify-content-between mb-5"><div class=align-self-start><h2 id=projects class=text-light>Projects</h2></div><div class="text-light align-self-center pe-2"><i class="fa-solid fa-circle fs-3"></i></div></div><section class="mx-auto my-5"><div class="container my-5 py-4 bg-off-white"><div class=pt-5><div class=row><div class="card mb-3 rounded-0 shadow-none"><div class="row row-cols-1 row-cols-lg-2 no-gutters"><div class="col p-0 order-lg-first my-auto"><img class=img-fluid src=img/projects/robochef.png alt="Card image cap"></div><div class="col order-lg-last"><div class=card-body><div class="d-flex justify-content-between"><div class=align-self-start><h3><u>Robo Chef 🤖</u></h3></div><div class="text-dark align-self-center pe-2"><i class="fa-solid fa-circle fs-3"></i></div></div><p>A program that calls the OpenAI Api and generates recipes with images to go along with it based on user inputted ingredients.</p><div class="d-flex justify-content-end"><p class="p-3 text-muted">.NET 7/Blazor/OpenAI/Bootstrap/JS</p><div class="p-2 align-content-center"><a href=https://github.com/Riokei/AIChef target=_blank class="btn btn-outline-dark"><i class="fab fa-github"></i> View Source</a></div><div class=p-2><a href=https://robochef.up.railway.app/ target=_blank class="btn btn-outline-dark">View Project</a></div></div></div></div></div></div></div><div class=row><div class="card mb-3 rounded-0 shadow-none"><div class="row row-cols-1 row-cols-lg-2 no-gutters"><div class="col p-0 order-lg-first my-auto"><img class=img-fluid src=img/projects/email-blaster.png alt="Card image cap"></div><div class="col order-lg-last"><div class=card-body><div class="d-flex justify-content-between"><div class=align-self-start><h3><u>EmailBlaster</u></h3></div><div class="text-dark align-self-center pe-2"><i class="fa-solid fa-circle fs-3"></i></div></div><p>Emailer application that can email contacts or group contacts.</p><div class="d-flex justify-content-end"><p class="p-3 text-muted">.NET 6/MVC/PostgreSQL/Bootstrap</p><div class="p-2 align-content-center"><a href=https://github.com/Riokei/ContactPro target=_blank class="btn btn-outline-dark"><i class="fab fa-github"></i> View Source</a></div><div class=p-2><a href=https://emailblaster.up.railway.app/ target=_blank class="btn btn-outline-dark">View Project</a></div></div></div></div></div></div></div></div></div></section><div class="title bg-dark py-2 ps-4 d-inline-flex justify-content-between mb-5"><div class=align-self-start><h2 id=projects class=text-light>Challenges</h2></div><div class="text-light align-self-center pe-2"><i class="fa-solid fa-circle fs-3"></i></div></div><section class="mx-auto my-5"><div class="container my-5 py-4"><div class=pt-5><div class="row row-cols-1 row-cols-lg-3 g-3"><div class="col d-flex justify-content-center"><a href=https://riokei.github.io/tacocat-CF/index.html class=text-decoration-none><div class="card hover" style=width:18rem><img class=card-img-top src=img/challenges/ufotofu.png alt="Ufo Tofu"><div class=card-body><h4 class="card-title text-center">Ufo Tofu</h4><h5 class=card-subtitle>HTML5/Bootstrap/Javascript</h5><p class=card-text>A palindrome checker written in Javascript. Input a string and it will reverse and check if its the same reversed as it is forward.</p></div></div></a></div><div class="col d-flex justify-content-center"><a href=https://riokei.github.io/Looper-v2/ class=text-decoration-none><div class="card hover" style=width:18rem><img class=card-img-top src=img/challenges/looper.png alt=Looper><div class=card-body><h4 class="card-title text-center">Looper</h4><h5 class=card-subtitle>HTML5/Bootstrap/Javascript</h5><p class=card-text>Generates table, displays numbers divisible by 3 as Fizz and 5 as Buzz, both as FizzBuzz.</p></div></div></a></div><div class="col d-flex justify-content-center"><a href=https://riokei.github.io/loan-calculator/index.html class=text-decoration-none><div class="card hover" style=width:18rem><img class=card-img-top src=img/projects/loan.png alt="Loan Shark"><div class=card-body><h4 class="card-title text-center">Loan Shark</h4><h5 class=card-subtitle>HTML5/Bootstrap/Javascript</h5><p class=card-text>A simple loan and amortization schedule calculator, generates a table to display payments.</p></div></div></a></div></div></div></div></section><div class="title bg-dark py-2 ps-4 d-inline-flex justify-content-between mb-5"><div class=align-self-start><h2 id=projects class=text-light>Contact</h2></div><div class="text-light align-self-center pe-2"><i class="fa-solid fa-circle fs-3"></i></div></div><section id=contact_form class="row row-cols-1 row-cols-lg-2 mt-5 pt-5 mx-0"><div class="col col-lg-6 mt-3 text-md-center"><h5 class=text-muted>If email is not your preferred contact method.</h5><h3>Find me elsewhere!</h3><i>More options coming soon..</i><div class="d-flex justify-content-center"><div class="p-2 align-content-center"><a href=https://github.com/Riokei target=_blank class="fab fa-github text-dark fs-2"></a>
<a href=https://mastodon.social/@riokei target=_blank class="fa-brands fa-mastodon text-dark fs-2"></a></div></div></div><div class="col col-lg-6 mt-3"><h3 class=ps-1>Contact Me</h3><form name=contact action=https://formspree.io/f/mqkozpdr method=post data-netlify=true class="d-flex justify-content-center mb-5"><div class=row><div class="form-group col-12"><input type=email class=email-controls id=exampleInputEmail1 aria-describedby=emailHelp placeholder="Enter email">
<small id=emailHelp class="form-text text-muted">I'll never share your email with anyone else.</small></div><div class="form-group col-12"><input name=Name type=text class=email-controls id=exampleInputName1 placeholder="Enter name"></div><div class=form-group><label for=exampleFormControlTextarea1>Message:</label>
<textarea name=message class=email-controls id=exampleFormControlTextarea1 rows=3></textarea></div><div class=col-12><button type=submit class="btn btn-outline-dark btn-lg mt-2">Submit</button></div></div></form></div></section></main><footer class="footer mt-auto py-3 bg-dark"><div class="container text-center"><div class="row gy-2"><div class="col text-white d-flex align-items-center justify-content-center"><div class=row><div class="col social"><a href=https://github.com/Riokei target=_blank alt="Link to Github Profile"><i class="fab fa-github text-white fa-2x"></i></a></div><div class="col social"><a href=https://mastodon.social/@riokei target=_blank alt="Link to Github Profile"><i class="fa-brands fa-mastodon text-white fa-2x"></i></a></div></div></div></div><div class=row><div class=col-12><p class=text-muted>© 2022, generated via Hugo, designed by <a href=https://github.com/Riokei>Chris W.</a><br>Image by <a href=https://unsplash.com/photos/nPhl2x4fk2s>@clark_fransa</a>.</p></div></div></footer></div><script src=https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js integrity=sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p crossorigin=anonymous></script></body></html>