/
index.html
219 lines (191 loc) · 9.4 KB
/
index.html
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
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link href="style.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>The Student Community Model</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
</head>
<body>
<!--header-->
<section class="header">
<div class="container" style="color: white">
<header class="d-flex justify-content-center py-3">
</header>
</div>
</section>
<!--title-->
<a id="home"></a>
<div class="px-9 py-5 my-5 text-center">
<h1 class="fs-4 fw-bold">The</h1>
<h1 class="display-4 fw-bold">Student Community Model</h1>
<br>
<p class="fs-4 mb-4 fw-semibold">The easiest way to set up a student Discord server for your school.</p>
<div class="col-lg-6 mx-auto">
<p class="fs-5 mb-3">For high school and college students.</p>
<div class="container d-grid gap-2 d-sm-flex justify-content-sm-center">
<a href="#getstarted" class="btn btn-outline-primary btn-lg px-4 gap-4 fw-semibold" role="button">Get
started</a>
</div>
</div>
</div>
<!--features-->
<div class="container px-4 py-5" id="icon-grid">
<h2 class="pb-2 fs-4 fw-semibold text-center" id="features">Don't worry about writing rules, verifying emails, or
spending
countless hours creating channels and roles. Student Community Bot handles almost <i>everything you need</i> for
your server:</h2>
<div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-4 g-4 py-5">
<div class="col d-flex align-items-start">
<i class="bi bi-list-columns-reverse"
style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>Automatically creating a channel and corresponding role for every class</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi bi-menu-button"
style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>Interactive setup procedure for new members to select their classes</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi bi-envelope-check"
style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>Email verification, so only students from your school can access your community</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi bi-rulers" style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>Rules, keeping your community safe and fun for everyone</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi bi-info-circle"
style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>Information for users</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi bi-info-square"
style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>Information for Admins</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi bi-cone-striped"
style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>Administration and Moderation team organizational structure</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi bi-share" style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>Completely automated referral role allocation to encourage students to invite others</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi bi-chat-left-quote"
style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>Nickname management</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi bi-translate"
style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>Language translation between 100+ languages</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi bi-cpu" style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>Computational knowledge engine (WolframAlpha) queries</p>
</div>
</div>
<div class="col d-flex align-items-start">
<i class="bi bi-balloon"
style="color: #277bff; font-size: 2rem; padding-right: 20px"></i>
<div>
<p>And more!</p>
</div>
</div>
</div>
<h2 class="pb-2 fs-4 fw-medium text-center">All you need is a list of your school's classes and the ability to push
a button.</h2>
</div>
<!--get started-->
<a id="getstarted"></a>
<section class="input">
<form name="contact" method="POST" data-netlify="true" class="row align-items-center row-cols-lg-5 g-3">
<div class="col-sm-auto">
<b>Get started by entering your information here.</b> Due to server constraints, we can't just have a link
for you to add the bot, but we'd love to work with you! Fill out the form, and we'll get a Student Community
Bot instance set up for you.
</div>
<div class="col-sm-auto">
<label for="contactInput" class="form-label">Email address</label>
<input type="email" class="form-control" id="contactInput" placeholder="email@example.com" name="contact" required>
</div>
<div class="col-sm-auto">
<label for="schoolInput" class="form-label">Your school</label>
<input type="text" class="form-control" id="schoolInput" placeholder="school" name="school">
</div>
<div class="col-sm-auto">
<label for="schoolInput" class="form-label">You'll be ready in no time!</label><br>
<button type="submit" class="btn btn-light col-12">Submit</button>
</div>
<div class="col-sm-auto col-xs-12 text-center">
Questions? Email us at <a style="color: white"
href="mailto:contact@kaveergera.com">contact@kaveergera.com</a>.
</div>
</form>
</section>
<!--more-->
<a id="more"></a>
<div class="container px-4 py-5">
<h2 class="pb-2 fs-4 fw-normal text-end">The Student Community Model gives you access (if you wish) to resources to
manage and grow your server. Admins and Mods of other successful deployments are also available for your
support. The model can be implemented in existing servers.</h2>
<br><br>
<h2 class="pb-2 fs-4 fw-normal text-start">Why create a Discord server for your high school or college? It's a fun
project, a great way to meet new people, and an invaluable study aid, so anyone can contact members of their
class easily when they forget the date the teacher rescheduled the test to.</h2>
<br><br>
<h2 class="pb-2 fs-4 fw-normal text-center">We work hard on this project; we hope you enjoy it!</h2>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js"
integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa"
crossorigin="anonymous"></script>
</body>
<!--footer-->
<div class="container">
<footer class="d-flex flex-wrap justify-content-between align-items-center py-3 my-4 border-top">
<p class="col-md-4 mb-0 text-muted">Created by <a href="https://kaveergera.com"
style="text-decoration: none; color: inherit">Kaveer Gera</a>.
Developed by <a href="https://kaveergera.com" style="text-decoration: none; color: inherit">Kaveer Gera</a>,
<a href="https://www.github.com/MetalTurtle18"
style="text-decoration: none; color: inherit">MetalTurtle18</a>, and <a href="https://cameronshaw.me"
style="text-decoration: none; color: inherit">Cameron
Shaw</a>.</p>
<a href="mailto:contact@kaveergera.com"><i class="bi bi-envelope-open-heart"
style="color: #277bff; font-size: 2rem; padding-right: 20px"></i></a>
<ul class="nav col-md-4 justify-content-end">
<li class="nav-item"><a href="#home" class="nav-link px-2 text-muted">Home</a></li>
<li class="nav-item"><a href="#features" class="nav-link px-2 text-muted">Features</a></li>
<li class="nav-item"><a href="#getstarted" class="nav-link px-2 text-muted">Get Started</a></li>
<li class="nav-item"><a href="#more" class="nav-link px-2 text-muted">More</a></li>
</ul>
</footer>
</div>
</html>