waitlist/index.html at main · siggraph-bnmit/waitlist · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <title>Siggraph BNMIT Waitlist</title>
        <link rel="icon" type="image/png" href="assets/siggraphlogofav.png">
        <link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Montserrat:wght@500;600;700;800&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="css/styles.css">
        <link href="https://fonts.googleapis.com/css2?family=Rock+Salt&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-icons/1.8.1/font/bootstrap-icons.min.css">

        <!-- Firebase CDN scripts -->
        <script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-app-compat.js" defer></script>
        <script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-database-compat.js" defer></script>
        <script src="https://cdn.jsdelivr.net/npm/canvas-confetti@1.5.1/dist/confetti.browser.min.js" defer></script>
        <script src="js/main.js" defer></script>


    </head>

</head>
<body>
    <div class="loader">
        <img src="assets/siggraphlogofav.png" alt="Loading Logo" class="loader-logo">
    </div>

    <div class="container">
        <div class="logo-container">
            <a href="#"><img src="assets/siggraphbnmitlogo.png" alt="Siggraph Logo"></a>

        </div>
        <div class="content" id="content">
            <div>
                <span style="color: white;">Join the WAITLIST for </span>
                <span style="color: #FFAD0F;">Siggraph BNMIT</span>
                <span style="color: white;"> Today!</span>
            </div>
            <div class="description">Be the first to get notified when the registrations open for Siggraph BNMIT</div>
        </div>

        <div class="prompt" id="initialPrompt">
            <button class="yesbutton" id="yesButton">LET'S BEGIN!</button>
        </div>

        <div class="input-box" id="inputFields" style="display: none;">
            <input type="text" id="nameField" class="input-field" placeholder="Name" required>
            <input type="email" id="emailField" class="input-field" placeholder="Email" required>
            <input type="tel" id="phoneField" class="input-field" placeholder="Phone" required>
            <button class="button" id="submitButton">JOIN NOW</button>
        </div>
    </div>

    <div id="popupMessage">
        <div class="content" id="content">
            <div>
                <span style="color: white;">CHECK YOUR</span>
                <span style="color: #FFAD0F;">EMAIL</span>
                <span style="color: white;">!</span>
            </div>
            <div class="description">You have been added to the Waitlist! Hope to see you soon!</div>
        </div>
        <div class="icon-row">
            <a href="https://bento.me/siggraphbnmit" target="_blank" class="icon"><i class="bi bi-globe"></i></a>
            <a href="https://www.instagram.com/siggraph.bnmit/" target="_blank" class="icon"><i class="bi bi-instagram"></i></a>
            <a href="https://www.linkedin.com/company/siggraph-bnmit/" target="_blank" class="icon"><i class="bi bi-linkedin"></i></a>
            <a href="https://discord.gg/2zHdqYEHtw" target="_blank" class="icon"><i class="bi bi-discord"></i></a>


        </div>
    </div>

    <div id="loadingScreen">
        <div class="loading-content">
            <div class="loading-text" id="loadingText">Adding you to the waitlist...</div>
            <div class="progress-bar">
                <div class="progress" id="progressBar"></div>
            </div>
        </div>
    </div>

</body>

</html>