firthday/index.html at master · maxxturing/firthday · 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
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
<!DOCTYPE html>
<html >
<head>
  <meta charset="UTF-8">
  <title>FIRTHDAY</title>
  <link rel="stylesheet" href="css/style.css">
  <link rel="icon" type="image/png" href="favicon.ico">
</head>

<body>

  <section id="nav">
    <div id="nav-div">
      <p>Saturday 7th October 2017, 8:00 PM</p>
      <p>London, E2 7RD</p>
      <p>Submit email to RSVP &amp;<br>receive calendar invite with address</p>
      <p>Plus ones are welcome</p>

      <form id="form" method="POST" action="https://script.google.com/macros/s/AKfycbxTkkCh5nORzSgjOQvoPM5V9eKhObyX5aMr5B-YNODfWiLoGYri/exec">

        <div>
          <label for="firstname"></label>
          <input id="firstname" name="firstname" placeholder="Your First Name" />
        </div>

        <div>
          <label for="lastname"></label>
          <input id="lastname" name="lastname" placeholder="Your Last Name" />
        </div>

        <div>
          <label for="email"></label>
          <input id="email" name="email" type="email" required placeholder="Your Email Address" />
        </div>

        <div>
          <button id="beam">
            Beam me up, Marky!
          </button>
        </div>
      </form>

      <div style="display:none" id="thankyou_message">
        <p>Thank you for RSVP-ing!</h3>
        <p>More deets will be with you soon! 🚀</p>
      </div>

    </div>
  </section>

  <article class="starwars">
  <audio preload="auto">
    <source src="https://s.cdpn.io/1202/Star_Wars_original_opening_crawl_1977.ogg" type="audio/ogg" />
    <source src="https://s.cdpn.io/1202/Star_Wars_original_opening_crawl_1977.mp3" type="audio/mpeg" />
  </audio>

  <section class="start">
    <p>
      FIRTHDAY XXV
    </p>
    <p>
      Watch Invitation
    </p>
  </section>

  <div class="animation">

  <section class="intro">
    A long time ago, in a galaxy far,<br> far away....
  </section>

  <section class="titles">
    <div contenteditable="true" spellcheck="false">
      <p>
        Young padawan, you are duly invited to
        celebrate the 25th annual FIRTHDAY, which falls this year bang in
        the middle of WORLD SPACE WEEK.
      </p>
      <p>
        I know it's late notice - had orginally intended
        to organise this much earlier, but life got in the way and
        I didn’t have much time to planet.
      </p>
      <p>
        Put on your best space-inspired outfit and fly
        in to taste a cheeky cosmonaut cocktail from my flat roof (AKA the launchpad)
        in the local constellation of E2 7RD.
      </p>
      <p>
        Bring Uranus for an experience that will be out of this world and help me restore
        freedom to the galaxy....
      </p>
      </div>
  </section>

  <section>
    <object class="logo" data="firthday.svg" type="image/svg+xml">
    </object>

  </section>
  </div>

</article>

  <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
  <script  src="js/index.js"></script>
  <!-- <script data-cfasync="false" type="text/javascript" src="https://cdn.rawgit.com/dwyl/html-form-send-email-via-google-script-without-server/master/form-submission-handler.js"></script> -->
  <script src="google_form_handler.js"></script>
</body>
</html>