supleed2/ICAS
1
0
Fork 0
mirror of https://github.com/supleed2/ICAS.git synced 2024-12-22 22:05:49 +00:00
Code Issues Packages Projects Releases Wiki Activity
ICAS/html/verify.html

267 lines
7 KiB
HTML
Raw Normal View History

Add verify.html, missing form
2023-09-07 12:07:40 +00:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta https-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--Setup Bootstrap CSS-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!--Setup Override CSS-->
Fix URLs to be canonical Replace `index.html` link with `/` and remove `.html` extensions from links
2023-09-07 19:48:09 +00:00
<link rel="stylesheet" href="/style.css">
Add verify.html, missing form
2023-09-07 12:07:40 +00:00
<!--Site icon and title-->
Fix URLs to be canonical Replace `index.html` link with `/` and remove `.html` extensions from links
2023-09-07 19:48:09 +00:00
<link rel="icon" type="image/png" href="/favicon.ico">
Add verify.html, missing form
2023-09-07 12:07:40 +00:00
<title>IC Anime Society</title>
Add JS to get Discord Username/Avatar on page load
2023-09-07 23:33:00 +00:00
<!--Script to set [[discordID]]-->
<script>
async function setDiscordID() {
const id = new URLSearchParams(window.location.search).get("id");
if (id == null) {
window.location.replace("/");
} else {
const { username, avatar_url } = await fetch(`/discord?id=${id}`).then((r) => r.json()).catch(console.error);
// const { username, avatar_url } = { username: `User #${id}`, avatar_url: "https://cdn.discordapp.com/embed/avatars/0.png" };
document.getElementById("discordID").value = id;
document.getElementById("discord-username").innerText = username;
document.getElementById("discord-avatar").src = avatar_url;
}
}
</script>
Update styling of verify form, make site dark mode
2023-09-24 00:33:17 +00:00
<style>
::-webkit-input-placeholder {
Fix verify form sizing
2023-11-11 22:55:58 +00:00
color: #dfdfdf;
Update styling of verify form, make site dark mode
2023-09-24 00:33:17 +00:00
}
:-ms-input-placeholder {
Fix verify form sizing
2023-11-11 22:55:58 +00:00
color: #dfdfdf;
Update styling of verify form, make site dark mode
2023-09-24 00:33:17 +00:00
}
::-ms-input-placeholder {
Fix verify form sizing
2023-11-11 22:55:58 +00:00
color: #dfdfdf;
Update styling of verify form, make site dark mode
2023-09-24 00:33:17 +00:00
}
:-moz-placeholder {
Fix verify form sizing
2023-11-11 22:55:58 +00:00
color: #dfdfdf;
Update styling of verify form, make site dark mode
2023-09-24 00:33:17 +00:00
opacity: 1;
}
::-moz-placeholder {
Fix verify form sizing
2023-11-11 22:55:58 +00:00
color: #dfdfdf;
Update styling of verify form, make site dark mode
2023-09-24 00:33:17 +00:00
opacity: 1;
}
.verify-body {
width: 100%;
margin: 0;
Fix verify form sizing
2023-11-11 22:55:58 +00:00
padding: 10px 20%;
Update styling of verify form, make site dark mode
2023-09-24 00:33:17 +00:00
background: #222;
color: #dddddd;
}
#discord-text {
margin-right: 10px;
}
.discord-user {
align-self: center;
display: flex;
align-items: center;
width: 100%;
text-align: center;
justify-content: center;
}
#discord-username {
margin-left: 10px;
}
.verify-form {
align-self: center;
display: flex;
flex-direction: column;
height: 100px;
Fix verify form sizing
2023-11-11 22:55:58 +00:00
margin-bottom: 40px;
Update styling of verify form, make site dark mode
2023-09-24 00:33:17 +00:00
}
.verify-input {
width: 40%;
margin: 3px 30%;
padding: 5px;
border: none;
border-radius: 6px;
background-color: #337ab7;
text-align: center;
}
.verify-submit {
width: 20%;
margin: 3px 40%;
padding: 10px;
border: none;
border-radius: 6px;
background-color: #337ab7;
color: #fff;
font-size: 1.5em;
cursor: pointer;
}
.verify-submit:hover,
.verify-submit:active {
background-color: #3d90d9;
}
Fix verify form sizing
2023-11-11 22:55:58 +00:00
@media (500px < width <=1000px) {
.verify-form {
margin-bottom: 80px;
}
.verify-body {
padding: 10px 10%;
}
.verify-input {
width: 60%;
margin: 3px 20%;
}
.verify-submit {
width: 40%;
margin: 3px 30%;
}
}
@media (width <=500px) {
.verify-form {
margin-bottom: 80px;
}
.verify-body {
padding: 10px 5%;
}
.verify-input {
width: 80%;
margin: 3px 10%;
}
.verify-submit {
width: 60%;
margin: 3px 20%;
}
}
Update styling of verify form, make site dark mode
2023-09-24 00:33:17 +00:00
</style>
Add verify.html, missing form
2023-09-07 12:07:40 +00:00
</head>
Add JS to get Discord Username/Avatar on page load
2023-09-07 23:33:00 +00:00
<body onload="setDiscordID()">
Add verify.html, missing form
2023-09-07 12:07:40 +00:00
<!-- Navbar -->
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"
aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle Navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
Fix URLs to be canonical Replace `index.html` link with `/` and remove `.html` extensions from links
2023-09-07 19:48:09 +00:00
<a href="/">
<img src="/images/logo.png" id="logo">
Add verify.html, missing form
2023-09-07 12:07:40 +00:00
</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li>
Fix URLs to be canonical Replace `index.html` link with `/` and remove `.html` extensions from links
2023-09-07 19:48:09 +00:00
<a href="/">Home</a>
Add verify.html, missing form
2023-09-07 12:07:40 +00:00
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">About Us<span class="caret"></span></a>
<ul class="dropdown-menu">
Fix URLs to be canonical Replace `index.html` link with `/` and remove `.html` extensions from links
2023-09-07 19:48:09 +00:00
<li><a href="/about">Who we are</a></li>
<li><a href="/committee">Committee</a></li>
Add verify.html, missing form
2023-09-07 12:07:40 +00:00
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">What we Do<span class="caret"></span></a>
<ul class="dropdown-menu">
Fix URLs to be canonical Replace `index.html` link with `/` and remove `.html` extensions from links
2023-09-07 19:48:09 +00:00
<li><a href="/manga">Manga club</a></li>
<li><a href="/library">Manga Library</a></li>
Add verify.html, missing form
2023-09-07 12:07:40 +00:00
</ul>
</li>
<li>
<a
href="https://www.imperialcollegeunion.org/shop/club-society-project-products/animesoc-products">Join
Now!</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Title bar -->
<div class="jumbotron top-item">
<div class="container">
<h1>Automatic Verification</h1>
<p>This page allows you to easily prove Imperial student status</p>
</div>
</div>
<!-- Page Contents -->
Add form to verify page and styling
2023-09-07 23:35:12 +00:00
<div class="verify-body">
Add verify.html, missing form
2023-09-07 12:07:40 +00:00
<h1>Verification Form</h1>
<p>When you submit the form below, your Imperial login details are checked using the Union login page and then
discarded, the only data saved is whether the login succeeded and your Imperial shortcode, to be connected
Add form to verify page and styling
2023-09-07 23:35:12 +00:00
to your Discord account by Nano. <b>Details input here will not be sent/visible to anyone nor will they be
stored at any point, and will only be used to verify the account is a valid Imperial login using the
Imperial eActivities API directly.</b></p>
Add verify.html, missing form
2023-09-07 12:07:40 +00:00
<p>We don't want to ever know your login details as that's a whole GDPR and security nightmare. The code for
this website and the verification system is available on <a
href="https://github.com/supleed2/ICAS">GitHub</a>.</p>
Add form to verify page and styling
2023-09-07 23:35:12 +00:00
<p><b>If you would prefer, you can continue to use verification via membership (if you have bought membership
this year) or manual verification, such as when verifying using College ID or an acceptance letter.</b>
</p>
<br>
<div class="discord-user">
Update styling of verify form, make site dark mode
2023-09-24 00:33:17 +00:00
<p id="discord-text"><b>Verification for:</b></p>
Add form to verify page and styling
2023-09-07 23:35:12 +00:00
<img id="discord-avatar" height="50px" width="50px" src="https://cdn.discordapp.com/embed/avatars/0.png">
<p id="discord-username">Loading...</p>
</div>
<br>
<form class="verify-form" method="post" action="submit">
<input class="verify-input" type="text" name="username" id="username" autocomplete="username"
Update styling of verify form, make site dark mode
2023-09-24 00:33:17 +00:00
placeholder="Imperial Shortcode (ab1234)" required />
Add form to verify page and styling
2023-09-07 23:35:12 +00:00
<input class="verify-input" type="password" name="password" id="password" autocomplete="current-password"
placeholder="Password" required />
<input type="hidden" name="discordID" id="discordID" autocomplete="off" value="[[discordID]]" />
<input class="verify-submit" type="submit" value="Let's go!" />
</form>
Add verify.html, missing form
2023-09-07 12:07:40 +00:00
</div>
<!-- Footer -->
<footer class="footer">
<div class="container">
<span class="footer-text">
Join our <a href="http://discord.gg/BgwDD69">Discord</a> server.
Sign up to our <a href="https://mailman.ic.ac.uk/mailman/listinfo/animesoc-list">mailing list</a>.
</span>
</div>
</footer>
<!--Bootstrap Javascript-->
<!--=======================================================================-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</body>
</html>
Reference in a new issue Copy permalink