-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
1 lines (1 loc) · 4.47 KB
/
index.html
1
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta content="width=device-width,initial-scale=1" name="viewport"><meta content="ie=edge" http-equiv="X-UA-Compatible"><title>Kelly Lawrence | Front-end Developer And Designer</title><link rel="icon" href="favicon.ico" sizes="any"><link rel="icon" href="icon.svg" type="image/svg+xml"><link rel="apple-touch-icon" href="apple-touch-icon.png"><link href="site.webmanifest" rel="manifest"><meta content="Kelly Lawrence is a Front-End Develper and Designer based out of Bedford, Nova Scotia, Canada." name="description"><meta content="Kelly Lawrence | Front-end Developer And Designer" name="apple-mobile-web-app-title"><meta content="Kelly Lawrence | Front-end Developer And Designer" name="application-name"><meta content="#ffffff" name="theme-color"><meta content="Kelly Lawrence | Front-end Developer And Designer" property="og:title"><meta content="Kelly Lawrence | Front-end Developer And Designer" property="og:site_name"><meta content="https://www.kellylawrence.ca" property="og:url"><meta content="" property="og:description"><meta content="website" property="og:type"><meta content="https://www.kellylawrence.ca/images/opengraph.jpg" property="og:image"><meta content="image/jpeg" property="og:image:type"><meta content="1200" property="og:image:width"><meta content="630" property="og:image:height"><meta content="Paragraphs of text on the left hand side, and a scenic photo of the Bedford Basin on the right." property="og:image:alt"><link href="style.css" rel="stylesheet"><style>@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:300;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v22/BngMUXZYTXPIvIBgJJSb6ufN5qU.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v22/BngMUXZYTXPIvIBgJJSb6ufN5qU.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/robotoslab/v22/BngMUXZYTXPIvIBgJJSb6ufN5qU.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}</style></head><body><div class="content"><div class="gradient-animation"></div><div class="container"><h1><strong>Kelly Lawrence</strong> / Front-end Developer And Designer</h1><p class="intro">I currently work at <a class="employer bt" href="https://www.beyondtrust.com/">BeyondTrust</a> as a Front-End Software Engineer. Previously, I worked at <a class="employer resulta" href="https://www.resulta.com/">resulta</a> and <a class="employer redspace" href="https://www.redspace.com/">REDspace</a> in <a href="https://en.wikipedia.org/wiki/Bedford,_Nova_Scotia">Bedford, NS</a>, as a Front-end Developer, and at <a class="employer leech" href="http://leechprint.com/">Leech Printing Ltd.</a> in <a href="https://en.wikipedia.org/wiki/Brandon,_Manitoba">Brandon, MB</a>, as a Front-end Developer and Designer.</p><p>In my spare time, I pretend to be a <a href="https://www.instagram.com/probably.batman/">professional photographer</a>, <a href="https://www.youtube.com/c/KellyLawrence-Master-of-the-Universe">record videos</a> of myself playing video games poorly, create <a href="https://vimeo.com/kellylawrence">digital animations</a> in After Effects, and record <a href="https://soundcloud.com/kellylawrence">short musical pieces</a> on guitar.</p><p class="web-presence"><a href="https://github.com/kellylawrence">GitHub</a> | <a href="https://gist.github.com/kellylawrence">Gists</a> | <a href="https://codepen.io/kellylawrence">CodePen</a></p></div></div><div class="hero"><span class="title"></span></div><script>const heroContainer = document.getElementsByClassName("hero")[0];const heroTitle = document.getElementsByClassName('title')[0];fetch('images/heroes/heroes.json').then(res => res.json()).then(data => {const baseURL = data.baseURL;const heroes = Object.keys(data.heroes[0]).length;const randomNum = Math.floor(Math.random() * heroes) + 1;const heroItem = data.heroes[0][randomNum];heroContainer.style.backgroundImage=`url(${baseURL}/${randomNum}.jpg)`;});</script></body></html>