index.html

<!doctype html>

<html lang="en">
<meta charset="utf-8">

<title>Jacqueline Quintanilla's Portfolio</title>
<meta name="description" content="A straightforward, strategic frontend engineer based in Minneapolis, MN.">

<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="HandheldFriendly" content="True" />

<link rel="canonical" href="https://qjac.net/">

<!-- favicons and site tiles -->
<!-- Place favicon.ico in the root directory -->
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
<link rel="apple-touch-icon" href="img/social/apple-touch-icon.png">
<link rel="icon" type="image/png" href="img/social/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="img/social/favicon-16x16.png" sizes="16x16">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="img/social/safari-pinned-tab.svg" color="#e2088b">
<meta name="apple-mobile-web-app-title" content="JQ">
<meta name="application-name" content="JQ">
<meta name="theme-color" content="#e2088b">

<!--	open graph for preview image-->
<meta property="og:locale" content="en_US">
<meta property="og:type" content="website">
<meta property="og:title" content="Jacqueline Quintanilla's Portfolio">
<meta property="og:description" content="A straightforward, strategic frontend engineer based in Minneapolis, MN."">
<meta property="og:url" content="qjac.net">
<meta property="og:site_name" content="Jacqueline Quintanilla's Portfolio">
<meta property="og:image" content="https://qjac.net/img/social/jq-preview-fb.png">

<!--	twitter card-->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Jacqueline Quintanilla's Portfolio">
<meta name="twitter:description" content="A straightforward, strategic frontend engineer based in Minneapolis, MN.">
<meta name="twitter:url" content="qjac.net">
<meta name="twitter:image" content="https://qjac.net/img/social/jq-preview-630.png">

<link rel="stylesheet" href="css/main.css">
</head>

<body class="background-decor">
    <main class="main-content-container">
        <svg class="logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 468" aria-hidden="true">
            <!-- <title id="logoTitle" class="visuallyhidden">Head to homepage</title> -->
            <path fill="var(--color-logo)"
                d="M553.4 403.8c-52.5 0-78.7-30.6-138.5-36 4.9-2.9 9.7-5.8 19.9-10.2 92.8-8.7 162.8-78.7 162.8-174.9 0-103-80.2-175.9-182.2-175.9S233.2 79.8 233.2 182.7c0 90.4 61.2 156.9 144.8 172.5 -30.1 17-49.1 33.5-63.6 53l22.4 20.9c17-11.2 38.4-18 62.7-18 46.2 0 86.5 50 155.5 50 48.1 0 81.1-16 104.9-54.9l-53.9-37.4C596.1 392.6 580.6 403.8 553.4 403.8zM304.2 182.7c0-68.5 49.6-115.6 111.3-115.6 61.7 0 111.3 47.1 111.3 115.6 0 68.5-49.6 115.6-111.3 115.6C353.7 298.4 304.2 251.2 304.2 182.7z"
                class="logo-q" />
            <path fill="var(--color-logo)"
                d="M70.5 71.8H135v191.1c0 27-13.3 38.1-33.8 38.1 -20.5 0-33.8-12.4-33.8-35.9H5.8c0 57.3 39.4 89 95.4 89 56.1 0 95.4-32.5 95.4-89V71.8 49.4 18.1H70.5V71.8z"
                class="logo-j" />
            <path fill="var(--color-logo)"
                d="M675.3 279.9c-26.2 0-38.9 12.6-38.9 39.4 0 26.7 12.6 39.4 38.9 39.4 26.2 0 38.9-12.6 38.9-39.4C714.2 292.5 701.6 279.9 675.3 279.9z"
                class="logo-dot" />
        </svg>

        <h1 class="name">Jacqueline Quintanilla</h1>
        <h2 class="focus">frontend developer</h2>
        <p class="link-container">
            <a href="files/quintanilla-resume.pdf" target="_blank" class="link-item">resume</a>
            <a href="https://www.linkedin.com/in/jacquintanilla/" class="link-item">linkedin</a>
            <a href="https://github.com/qjac" class="link-item">github</a>
            <a href="mailto:hello@qjac.net" target="_blank" class="link-item">email</a>
        </p>
    </main>
</body>
</html>