design-system-tuesdays/signup.html at main · swisspost/design-system-tuesdays · 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
111
112
113
114
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Mad System Monkeys Gathering</title>
    <meta
      name="description"
      content="Event page for the Design System Tuesdays meet up for Design System Engineers, Frontend Engineers, Design System Designers, User Experience Designers, Figma Designers or people interested in Design Tokens, Web Components, Design Systems or related topics happening in Bern, Switzerland."
    />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Lemon&display=swap"
      rel="stylesheet"
    />
    <link
      href="https://fonts.googleapis.com/css2?family=Montserrat:wght@500;700&display=swap"
      rel="stylesheet"
    />
    <link rel="stylesheet" href="madness.css" />
  </head>
  <body>
    <aside>
      <img
        class="monkey-img"
        src="/assets/monkey.png"
        alt="A funky monkey with sunglasses drawn in vibrant colors surrounded by the headline 'Mad System Monkeys'"
      />
    </aside>

    <main>
      <header class="cloud page-header">
        <h1>Design System Meet Up</h1>
        <p class="subtitle">
          13th of January 2026 - 17:00, Swiss Post,
          <a href="https://maps.app.goo.gl/UG2p2fzJLqvzoCJa7"
            ><span class="nowrap">Wankdorfallee 4,</span> Bern</a
          >
        </p>
      </header>

      <div class="cloud">
        <form
          data-netlify="true"
          class="section"
          action="/success.html"
          method="POST"
          name="registrations-january-2026"
        >
          <fieldset>
            <legend class="bordered-text">Sign up for the event</legend>
            <div class="field">
              <label class="bordered-text" for="name">Name</label>
              <input
                type="text"
                id="name"
                name="name"
                required
                autocomplete="name nickname username"
              />
            </div>
            <div class="field">
              <label class="bordered-text" for="email">Email address</label>
              <input
                type="email"
                id="email"
                name="email"
                required
                autocomplete="email"
              />
            </div>
            <div class="align-right buttons">
              <button type="submit">
                I'm in<span class="visually-hidden"
                  >, register for the event</span
                ></button
              ><button type="reset">Reset</button>
            </div>
          </fieldset>
        </form>

        <p>
          <small>
            Please contact
            <a href="mailto:philipp.gfeller@post.ch">philipp.gfeller@post.ch</a>
            for more information and organisation.
          </small>
        </p>
      </div>
    </main>

    <footer class="footer">
      <p class="author cloud small bold">
        monkey patched by Philipp
        <a
          aria-label="see source code of this page on GitHub"
          href="https://github.com/swisspost/design-system-tuesdays"
          >GitHub</a
        >
        <a
          href="mailto:philipp.gfeller@post.ch"
          aria-label="Write an e-mail to Philipp (philipp.gfeller@post.ch)"
          >Mail</a
        >
        <a
          aria-label="Go to the LinkedIn profile of Philipp Gfeller"
          href="https://www.linkedin.com/in/philipp-gfeller-59a681138/"
          >LinkedIn</a
        >
      </p>
    </footer>
  </body>
</html>