-
Notifications
You must be signed in to change notification settings - Fork 5
/
index.html
52 lines (44 loc) · 2.37 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
<!DOCTYPE html>
<html>
<head>
<title>The Marco Offset</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.min.css">
</head>
<body>
<main class="container">
<h1>The Marco Offset</h1>
<p>The Marco Offset is a way of calculating your minimum donation to <a href="https://donate.tiltify.com/@relay-fm/relay-fm">Relay FM for St. Jude 2023 fundraiser</a>.</p>
<p>The way it is calculated is you take the base model price of an iPhone 15 or iPhone 15 Pro that you are purchasing during the month of September and subtract that from your total purchase price. Whatever that difference is what your minimum donation should be. This includes but is not limited to the following:</p>
<ul>
<li>Phone upgrades (size, storage, etc)</li>
<li>Accessories</li>
<li>AppleCare (Monthly multiply by 12)</li>
<li>Taxes</li>
<li>Shipping costs</li>
</ul>
<p>To help with this process a calculator has provided below. The first line is the total on your receipt. If you make monthly payments for AppleCare on the second line add what that monthly payment is.</p>
<!-- Add the dropdown box here -->
<label for="selectedModel">Select iPhone Model:</label>
<select id="selectedModel">
<option value="iphone15">iPhone 15</option>
<option value="iphone15pro">iPhone 15 Pro</option>
</select><br>
<label for="num1">iPhone Purchase Total:</label>
<input type="number" id="num1"><br>
<label for="num2">Monthly AppleCare:</label>
<input type="number" id="num2"><br>
<button onclick="calculateTotal()">Calculate Total</button>
<p>Minimum Donation: $<span id="total">0</span></p>
<p>I have established a <a href="https://donate.tiltify.com/@bbech/the-marco-offset">sub-campaign</a> designed to make tracking the funds raised for 'The Marco Offset' donation more enjoyable.</p>
<footer>
<small>
<p>Made by <a href="https://mastodon.social/@bbech">bbech</a>.<br />
<a href="https://github.com/bjbech/TheMarcoOffset">Github Repo</a>
</p>
</small>
</footer>
</main>
<script src="script.js"></script>
</body>
</html>