moonlit-landing-page/index.html at master · matyikriszta/moonlit-landing-page · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <title>Moonlit Skincare</title>
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
    <meta name="author" content="">
    <meta name="description" content="Moonlit Skincare - Emphasizing Beauty Sleep 🌙 Targets issues while you sleep, when your skin regenerates fastest 🌱 Vegan ingredients responsibly sourced from Bali.">
    <meta name="keywords" content="moonlit, skincare, night time, overnight, moisturizer, slumber serum, sleep, sleep lifestyle, sleep dedicated skincare, overnight cream, moon, sleeping eye mask, constellations, night, wake up radiant, restorative skincare, wellness, bali, ubud, beauty sleep, non-toxic, cruelty-free, science of sleep, small, handmade batches, sulfate-free, vegan, sync, sleep cycle">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="https://fonts.googleapis.com/css?family=Raleway:400,500,600,700" rel="stylesheet">
    <link rel="stylesheet" href="/css/tachyons.css">
  </head>
  <body>
    <div class="container dt w-100 vh-100">
      <div class="dtc v-mid tc">
        <img src="images/moonlit-logo.svg" alt="Moonlit Skincare logo" class="mw6 mb4">
        <form action="https://formspree.io/stephy@shopmoonlit.com" method="POST" class="mw6 center f4">
          <fieldset class="cf bn ma0 pa0">
            <legend class="f4-l pa0 mb4 white lh-copy raleway-medium">Sign up and we'll let you know when we're ready for lift off!</legend>
            <div class="cf ba br2 b--white-10 shadow-1">
              <label class="clip" for="email">Email Address</label>
              <input type="hidden" name="_next" value="thanks.html" />
              <input type="hidden" name="_subject" value="New email submission from shopmoonlit.com" />
              <input type="hidden" name="_cc" value="kriszta@shopmoonlit.com" />
              <input class="f5 input-reset fl pa3 bn o-40 bg-dark-blue white lh-solid w-100 w-80-ns br2-ns br--left-ns raleway" placeholder="NOTIFY ME |" type="email" name="email">
              <button class="f5 button-reset fl pv2 tc bn bg-dark-blue white pointer w-100 w-20-ns br2-ns br--right-ns" type="submit" value="Submit">
                <img src="images/moon-icon.svg" alt="Moon icon">
              </button>
            </div>
          </fieldset>
        </form>
      </div>
      <ul class="list absolute left-2 bottom-2">
        <li class="dib ph1 v-mid">
          <a href="https://www.instagram.com/moonlitskincare/" class="link db white hover-washed-yellow" target="_blank" rel="noopener noreferrer">
            <svg class="h1 w1" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414">
              <path d="M8 0C5.827 0 5.555.01 4.702.048 3.85.088 3.27.222 2.76.42c-.526.204-.973.478-1.417.923-.445.444-.72.89-.923 1.417-.198.51-.333 1.09-.372 1.942C.008 5.555 0 5.827 0 8s.01 2.445.048 3.298c.04.852.174 1.433.372 1.942.204.526.478.973.923 1.417.444.445.89.72 1.417.923.51.198 1.09.333 1.942.372.853.04 1.125.048 3.298.048s2.445-.01 3.298-.048c.852-.04 1.433-.174 1.942-.372.526-.204.973-.478 1.417-.923.445-.444.72-.89.923-1.417.198-.51.333-1.09.372-1.942.04-.853.048-1.125.048-3.298s-.01-2.445-.048-3.298c-.04-.852-.174-1.433-.372-1.942-.204-.526-.478-.973-.923-1.417-.444-.445-.89-.72-1.417-.923-.51-.198-1.09-.333-1.942-.372C10.445.008 10.173 0 8 0zm0 1.44c2.136 0 2.39.01 3.233.048.78.036 1.203.166 1.485.276.374.145.64.318.92.598.28.28.453.546.598.92.11.282.24.705.276 1.485.038.844.047 1.097.047 3.233s-.01 2.39-.05 3.233c-.04.78-.17 1.203-.28 1.485-.15.374-.32.64-.6.92-.28.28-.55.453-.92.598-.28.11-.71.24-1.49.276-.85.038-1.1.047-3.24.047s-2.39-.01-3.24-.05c-.78-.04-1.21-.17-1.49-.28-.38-.15-.64-.32-.92-.6-.28-.28-.46-.55-.6-.92-.11-.28-.24-.71-.28-1.49-.03-.84-.04-1.1-.04-3.23s.01-2.39.04-3.24c.04-.78.17-1.21.28-1.49.14-.38.32-.64.6-.92.28-.28.54-.46.92-.6.28-.11.7-.24 1.48-.28.85-.03 1.1-.04 3.24-.04zm0 2.452c-2.27 0-4.108 1.84-4.108 4.108 0 2.27 1.84 4.108 4.108 4.108 2.27 0 4.108-1.84 4.108-4.108 0-2.27-1.84-4.108-4.108-4.108zm0 6.775c-1.473 0-2.667-1.194-2.667-2.667 0-1.473 1.194-2.667 2.667-2.667 1.473 0 2.667 1.194 2.667 2.667 0 1.473-1.194 2.667-2.667 2.667zm5.23-6.937c0 .53-.43.96-.96.96s-.96-.43-.96-.96.43-.96.96-.96.96.43.96.96z"/></svg>
          </a>
        </li>
        <li class="dib ph1 v-mid">
          <a href="https://www.pinterest.com/moonlitskincare/" class="link db white hover-washed-yellow" target="_blank" rel="noopener noreferrer">
            <svg class="h1 w1" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414">
              <path d="M8 0C3.582 0 0 3.582 0 8c0 3.39 2.108 6.285 5.084 7.45-.07-.633-.133-1.604.028-2.295.146-.625.938-3.977.938-3.977s-.24-.48-.24-1.188c0-1.11.646-1.943 1.448-1.943.683 0 1.012.513 1.012 1.127 0 .687-.436 1.713-.662 2.664-.19.797.4 1.445 1.185 1.445 1.42 0 2.514-1.498 2.514-3.662 0-1.91-1.376-3.25-3.342-3.25-2.276 0-3.61 1.71-3.61 3.47 0 .69.263 1.43.593 1.83.066.08.075.15.057.23-.06.25-.196.8-.223.91-.035.15-.115.18-.268.11C3.516 10.46 2.89 9 2.89 7.82c0-2.52 1.834-4.84 5.287-4.84 2.774 0 4.932 1.98 4.932 4.62 0 2.76-1.74 4.98-4.16 4.98-.81 0-1.57-.42-1.84-.92l-.5 1.9c-.18.698-.67 1.57-1 2.1.75.23 1.54.357 2.37.357 4.41 0 8-3.58 8-8s-3.59-8-8-8z" fill-rule="nonzero"/>
            </svg>
          </a>
        </li>
        <li class="dib ph1 v-mid"><a href="about.html" class="link db white hover-washed-yellow underline-hover ttu tracked fw1">About</a></li>
      </ul>
    </div>
  </body>
</html>