-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
75 lines (74 loc) · 5.05 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
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Convert your Star Citizen Referral Links to QR Codes">
<meta name="author" content="SC-Open.dev">
<meta name="keywords" content="Star Citizen, Referral, QR Code, Generator, SC-Open.dev">
<title>ReferralQRGenerator by SC-Open.dev</title>
<link rel="icon" type="image/png" sizes="16x16" href="./img/16.png">
<link rel="icon" type="image/png" sizes="32x32" href="./img/32.png">
<link rel="icon" type="image/png" sizes="48x48" href="./img/48.png">
<link rel="icon" type="image/png" sizes="64x64" href="./img/64.png">
<link rel="icon" type="image/png" sizes="128x128" href="./img/128.png">
<link rel="icon" type="image/png" sizes="192x192" href="./img/192.png">
<link rel="icon" type="image/png" sizes="256x256" href="./img/256.png">
<link rel="icon" type="image/png" sizes="512x512" href="./img/512.png">
<link rel="apple-touch-icon" sizes="512x512" href="./img/512.png">
<link rel="stylesheet" type="text/css" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="manifest" href="manifest.webmanifest">
<body class="w3-dark-grey w3-center">
<div class="w3-display-container w3-content w3-margin-top">
<div class="w3-container w3-padding-16 w3-center w3-card-4 w3-blue-grey w3-round-large" id="appArea">
<object class="w3-center w3-margin w3-hover-shadow" title="GitHub Repo Badge" data="https://img.shields.io/badge/Referral_QR_Generator-by_SC--Open-gold?style=for-the-badge&link=https%3A%2F%2Fgithub.com%2FSC-Open%2FRSI-ReferralQRGenerator" type="image/svg+xml"></object>
<div class="w3-col" id="inputData">
<div class="w3-center w3-margin">
<label class="w3-auto" for="logoInput">Logo:</label>
<input type="file" id="logoInput" accept="image/*">
</div>
<div class="w3-center w3-margin">
<label class="w3-auto" for="backgroundInput">Background:</label>
<input type="file" id="backgroundInput" accept="image/*">
</div>
<div class="w3-center">
<label class="w3-auto" for="referralCode">Referral Code:</label>
<input class="w3-input" type="text" id="referralCode" placeholder="STAR-XXXX-XXXX" maxlength="64">
<script>
let referralCodeInput = document.getElementById('referralCode');
referralCodeInput.addEventListener('input', function() {
// Only allow alphanumeric characters and hyphens
this.value = this.value.replace(/[^a-zA-Z0-9-]/g, '');
});
</script>
</div>
<div class="w3-padding w3-margin">
<button class="w3-btn w3-blue-grey" type="button" id="actionButton">Generate QR Code</button>
</div>
</div>
<di class="w3-auto" id="outputData">
<div id="qrcode" class="w3-padding-16"></div>
</div>
</div>
</div>
<modal id="myModal" class="w3-modal w3-round-large">
<div class="w3-modal-content w3-padding-16 w3-auto w3-card-4 w3-center w3-dark-grey w3-animate-bottom" id="modal-content">
<h2 class="w3-margin-top">Like what we're doing?</h2>
<p>Here are some ways you can show your appreciation</p>
<div class="w3-row">
<object title="GitHub Sponsors Badge" data="https://img.shields.io/github/sponsors/mistermatt1337?style=for-the-badge&logo=githubsponsors&link=https%3A%2F%2Fbit.ly%2F3TP4yKD" type="image/svg+xml"></object>
<object title="Patreon Sponsors Badge" data="https://img.shields.io/badge/Patreon-Support_us!-orange?style=for-the-badge&logo=patreon&link=https%3A%2F%2Fbit.ly%2FSCOpenDevPatreon" type="image/svg+xml"></object>
<object title="RSI Referral Badge" data="https://img.shields.io/badge/RSI-Enlist_now!-blue?style=for-the-badge&logo=spaceship&link=https%3A%2F%2Fbit.ly%2FSCBonus5K" type="image/svg+xml"></object>
<object title="Discord Badge" data="https://img.shields.io/discord/1113924866580684911?style=for-the-badge&logo=discord&logoColor=white&label=SC%20Open&color=gold&link=https%3A%2F%2Fbit.ly%2FSCOpen-Discord" type="image/svg+xml"></object>
<object title="GitHub License Badge" data="https://img.shields.io/github/license/sc-open/RSI-Waves2Epochs?style=for-the-badge" type="image/svg+xml"></object>
</div>
<p class="w3-small w3-margin" id="disclaimer">This is an unofficial Star Citizen fansite, not affiliated with the Cloud Imperium group of companies. All content on this site not authored by its host or users are property of their respective owners.</p>
<button class="w3-btn w3-grey w3-margin-bottom" id="closeModal" type="button">Close</button>
</div>
</modal>
<footer class="w3-block w3-bottom w3-center w3-blue-grey w3-margin-top">
<button class="w3-btn w3-blue-grey w3-margin-bottom" id="aboutButton" type="button">About</button>
</footer>
<script src="js/content.js"></script>
<script src="register-sw.js"></script>
</body>
</html>