nbthstech.github.io/index.html at master · nbthstech/nbthstech.github.io · 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
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="images/techlogo.png" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="fullpage.min.css">
    <title>Tech Club</title>
    <script type="text/javascript">var submitted=false;</script> <iframe name="hidden_iframe" id="hidden_iframe" style="display:none;" onload="if(submitted) {window.location='index.html';}"></iframe>

</head>
<body>
    <div id = "fullpage">
        <section class = "section s1">
            <div id = "img">
                <div id = "blackLayer"></div>
            </div>
            <h1>Tech Club</h1>
            <h3 id = "credits">Made by Shakib Rahman</h3>
        </section>
        <section class = "section s2">
            <h1>Meets</h1>
            <div id = "nextMeet" class="isAnimated">
                <ul id = "meetDates">
                    <li class = "met">Sept 17</li>
                    <li class = "met">Oct 1</li>
                    <li class = "met">Oct 15</li>
                    <li class = "met">Oct 29</li>
                    <li class = "met">Nov 12</li>
                    <li class = "met">Nov 26</li>
                    <li class = "met">Dec 17</li>
                    <li class = "met">Jan 7</li>
                    <li class = "met">Jan 21</li>
                    <li class = "met">Feb 4</li>
                    <li class = "met">Feb 18</li>
                    <li class = "active">Mar 3</li>
                    <li>Mar 17</li>
                    <li>Mar 31</li>
                    <li>Apr 21</li>
                    <li>May 5</li>
                    <li>May 19</li>
                    <li>Jun 9</li>
                </ul>
            </div>
        </section>
        <section class = "section s3">
            <h1>About</h1>
            <div class = "isAnimated" id ="description1">
                <img src="images/backend.png" alt="backend" class="logos l1">
                <h2 id = "dHead">Backend Team</h2>
                <h4>Leaders: Upsham/Shrey</h4>
                <p>Math-minded? Interested in databases? Familiar with coding? Backend is the place for you! Backends main focus is creating the behind-the-scenes of the projects we'll be making. Requires Python, Flask, and mySQL</p>
            </div>
            <div class = "isAnimated"id ="description2">
                <img src="images/frontend.png" alt="frontend" class="logos l2">
                <h2 id = "dHead">Frontend Team</h2>
                <h4>Leader: Shakib</h4>
                <p>Do you enjoy making things look beautiful? Are you awed by a creative design on a website? Are you familiar with web dev? Frontend focuses on the appearance of the projects we will be creating! Requires HTML, CSS, and JavaScript</p>
            </div>
            <div class = "isAnimated"id ="description3">
                    <img src="images/design.png" alt="design" class="logos l3">
                    <h2 id = "dHead">Design Team</h2>
                    <h4>Leader: Varun</h4>
                    <p>Are you an artist? Familiar with design software? Not too interested in doing the nitty gritty coding? Design is the place for you. The main focus of design is providing the front-end with a design to follow. Uses various software including AdobeXD (its free!)</p>
            </div>

        </section>
        <section class = "section s4">
            <h1>Board</h1>
            <div class = "board b1 isAnimated" >
                <h2>Co-President</h2>
                <img src="images/dakshal_bitmoji.jpg" alt="Dakshal">
                <h4>Dakshal Panicker</h3>
            </div>
            <div class = "board b2 isAnimated ">
                <h2>Co-President</h2>
                <img src="https://ca.slack-edge.com/TN1H1KD7U-UN2NZLWJW-52525bb5d2ff-512" alt="Varun">
                <h4>Varun Chari</h3>
            </div>
            <div class = "board b3 isAnimated">
                <h2>Secretary</h2>
                <img src="images/cavin_bitmoji.png" alt="Cavin">
                <h4>Cavin Saravanan</h4>
            </div>
            <div class = "board b4 isAnimated">
                <h2>Web Master</h2>
                <img src="https://ca.slack-edge.com/TN1H1KD7U-UNFFZFYRE-0fe6a0a9ed23-512" alt="Shakib">
                <h4>Shakib Rahman</h4>
            </div>
            <div class = "board b5 isAnimated">
                <h2>Treasurer</h2>
                <img src="https://ca.slack-edge.com/TN1H1KD7U-UNLNMHSTS-g4e795184be1-512" alt="Shrey">
                <h4>Shrey Jain</h4>
            </div>
        </section>
        <section class = "section s5">
            <h1>Contact</h1>
            <div id="cContainer">
                <div id="left">
                    <form target="hidden_iframe" onsubmit="submitted=true;" action="https://docs.google.com/forms/u/1/d/e/1FAIpQLSe3_B5ySYh_X9ihcciBA6JWo8e1WBMSBEhZQXyBy_LTcnapFw/formResponse" target="_self" method="POST">
                        <h2 class = "cSubT">Message Us!</h2>
                        <div class="row">
                            <input required placeholder = "Name"id="name" class="input" name="entry.1997664703" type="text" value="" size="30"/><br/>
                            <span id="name_validation" class="error_message"></span>
                        </div>
                        <div class="row">
                            <input required id="ID" placeholder = "ID" class="input" name="entry.262819144" type="text" value="" size="30"/><br/>
                            <span id="email_validation" class="error_message"></span>
                        </div>
                        <div class="row">
                            <textarea name ="entry.285383748" required class = "input" id="message" placeholder = "Message" class="message" name=" rows="7" cols="30"></textarea><br/>
                            <span id="message_validation" class="error_message"></span>
                        </div>
                        <input id="submit_button" type="submit" value="Submit"/>
                    </form>
                </div>
                <div id="right">
                    <div id="rBod">
                        <h2 class = "cSubT">Other Resources</h2>
                        <h3>Mrs. Dhrolia: idhrolia@nbtschools.org</h3>
                        <h3>Slack: <a href="https://join.slack.com/t/nbthstechclub/shared_invite/enQtODEyNDkxMjY4NjE1LWU2OGIxZTIzZTZmNDM2NzEyNjI1Y2JiYzA2MWVmNTZmNTNhNWE4OGQyOTk2MzEyNmY4MTY4NWQwM2E3MDgzYjM">Click Here</a></h3>
                        <h3>Remind: Text @technbths to 81010</h3>
                    </div>
                </div>
            </div>
        </section>

    </div>


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <script src = "fullpage.min.js"></script>
    <script src = "app.js"> </script>
</body>
</html>