Skip to content

Commit 0319cda

Browse files
VitalikLVitalikL
committed
Add donation page
1 parent 28b7d35 commit 0319cda

File tree

9 files changed

+951
-640
lines changed

9 files changed

+951
-640
lines changed

‎about/index.html

+4-1
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,10 @@
4949
</li>
5050
</ul>
5151
<div class="text-center my-2">
52-
<a href="https://github.com/Adventech" class="btn btn-outline-primary" role="button" target="_blank"> ♥ Contribute</a>
52+
<a href="https://github.com/Adventech" class="btn btn-outline-secondary mr-2" role="button" target="_blank">🐙 GitHub</a>
53+
</div>
54+
<div class="text-center my-2">
55+
<a href="/donate/" class="btn btn-outline-primary" role="button"> ♥ Contribute</a>
5356
</div>
5457
</div>
5558
</nav>

‎donate/index.html

+238
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,238 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
6+
7+
<title>Adventech - Donate & Support</title>
8+
9+
<meta name="description" content="Adventech ministry. Our mission is to share the Gospel of Jesus Christ through technology.">
10+
11+
<meta itemprop="name" content="Adventech">
12+
<meta itemprop="description" content="Adventech ministry. Our mission is to share the Gospel of Jesus Christ through technology.">
13+
14+
<meta name="og:title" content="Adventech">
15+
<meta name="og:description" content="Adventech ministry. Our mission is to share the Gospel of Jesus Christ through technology.">
16+
<meta name="og:image" content="https://adventech.io/images/adventech-graph-image.png">
17+
<meta name="og:url" content="https://adventech.io">
18+
<meta name="og:site_name" content="Adventech - Technology to spread the Gospel">
19+
<meta name="og:type" content="website">
20+
21+
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
22+
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
23+
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
24+
<link rel="manifest" href="/manifest.json">
25+
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
26+
27+
<meta name="theme-color" content="#000">
28+
29+
<link href="https://fonts.googleapis.com/css?family=Lato:400,700,900" rel="stylesheet">
30+
<link rel="stylesheet" href="/style/base.css">
31+
<link rel="stylesheet" href="/style/main.css">
32+
<script src="https://js.stripe.com/v3"></script>
33+
</head>
34+
<body>
35+
36+
<header class="header">
37+
<div class="container">
38+
<nav class="navbar navbar-sm navbar-expand-md navbar-expand-lg navbar-light">
39+
<a class="navbar-brand m-auto" href="/">
40+
<img src="/images/adventech-menu-logo.png" />
41+
</a>
42+
43+
<div class="navbar-collapse ml-4 center">
44+
<ul class="navbar-nav mr-auto">
45+
<li class="nav-item active mx-auto my-1">
46+
<a class="nav-link" href="/about/"><strong>About</strong></a>
47+
</li>
48+
<li class="nav-item active mx-auto my-1">
49+
<a class="nav-link" href="/sabbath-school/"><strong>Sabbath School</strong></a>
50+
</li>
51+
</ul>
52+
<div class="text-center my-2">
53+
<a href="https://github.com/Adventech" class="btn btn-outline-secondary mr-2" role="button" target="_blank">🐙 GitHub</a>
54+
</div>
55+
<div class="text-center my-2">
56+
<a href="/donate/" class="btn btn-outline-primary" role="button"> ♥ Contribute</a>
57+
</div>
58+
</div>
59+
</nav>
60+
</div>
61+
</header>
62+
63+
<main role="main">
64+
65+
<div class="my-lg-5 py-5 p-4 p-md-3">
66+
<div class="container">
67+
<div class="row">
68+
<div class="col-7">
69+
<h1>Donate to support our development</h1>
70+
71+
<p class="adventech-paragraph my-3">Our mission is to unite Seventh-day Adventist Church, proclaim Good News to this world by means of technology and witness Jesus’ second coming!</p>
72+
73+
<p class="adventech-paragraph my-3">We have many ideas and many projects that we want to embark on, as well as supporting existing projects like Sabbath School app. To date, we have seen an incredible <span class="text-primary">growth</span> of the application with a lot of usage, feedback, value and most importantly service that it provides to our users. We want to continue adding new features and functionality to make it even a
74+
<span class="text-primary">better</span> application. For example this year we plan to add <span class="text-primary">audio / video</span> support for Sabbath School app.</p>
75+
76+
<p class="adventech-paragraph my-3">
77+
We are humbled that many of you have <span class="text-primary">offered</span> to donate to our ministry and it is truly motivating to be working with all of you.
78+
</p>
79+
80+
<p class="adventech-paragraph my-3">
81+
We would like to be as transparent as possible with what we are going to do with donations. Below you can see our current expenses (estimated) and how we are thinking to use donations to cover them
82+
</p>
83+
84+
<table class="table table-bordered mt-5">
85+
<tr>
86+
<th>Type</th>
87+
<th>Cost</th>
88+
</tr>
89+
<tr>
90+
<td>Firebase</td>
91+
<td>~$200 USD / month</td>
92+
</tr>
93+
<tr>
94+
<td>Amazon Web Services</td>
95+
<td>~$250 USD / month</td>
96+
</tr>
97+
<tr>
98+
<td>Estimated Audio / video feature for the Sabbath School app</td>
99+
<td>~$400 USD / month</td>
100+
</tr>
101+
<tr>
102+
<td>Other expenses</td>
103+
<td>~$100 USD / month</td>
104+
</tr>
105+
</table>
106+
</div>
107+
<div class="col-5">
108+
<div id="error-message"></div>
109+
<div id="thank-you" class="thank-you">
110+
<h3 class="text-primary">Thank you</h3>
111+
<p class="adventech-paragraph my-3">
112+
For being so awesome!
113+
</p>
114+
</div>
115+
116+
<script>
117+
(function(){
118+
if (window.location.href.indexOf("?thank-you") > 0){
119+
document.getElementById('thank-you').classList.add('thank-you-visible');
120+
}
121+
})();
122+
</script>
123+
124+
<div class="row">
125+
<div class="col-5">
126+
<div class="py-3 adventech-donate-button"
127+
id="sku_HDCxnnJ6UafLgj">
128+
<p class="amount">$10</p>
129+
<p class="small text-secondary">One-time donation</p>
130+
</div>
131+
</div>
132+
<div class="col-5">
133+
<div class="py-3 adventech-donate-button"
134+
id="sku_HDD1QqLPhevtqE">
135+
<p class="amount">$25</p>
136+
<p class="small text-secondary">One-time donation</p>
137+
</div>
138+
</div>
139+
<div class="col-5 mt-4">
140+
<div class="py-3 adventech-donate-button"
141+
id="sku_HDD1RZzsh403uM">
142+
<p class="amount">$50</p>
143+
<p class="small text-secondary">One-time donation</p>
144+
</div>
145+
</div>
146+
<div class="col-5 mt-4">
147+
<div class="py-3 adventech-donate-button"
148+
id="sku_HDD2PYMCgf5lTI">
149+
<p class="amount">$100</p>
150+
<p class="small text-secondary">One-time donation</p>
151+
</div>
152+
</div>
153+
<div class="col-5 mt-4">
154+
<div class="py-3 adventech-donate-button"
155+
id="plan_HDD3ukXRzJUB46">
156+
<p class="amount">$10</p>
157+
<p class="small text-secondary"><strong class="text-primary">Monthly</strong> donation</p>
158+
</div>
159+
</div>
160+
<div class="col-5 mt-4">
161+
<div class="py-3 adventech-donate-button"
162+
id="plan_HDE8TKrHo5jzpn">
163+
<p class="amount">$25</p>
164+
<p class="small text-secondary"><strong class="text-primary">Monthly</strong> donation</p>
165+
</div>
166+
</div>
167+
</div>
168+
169+
<script>
170+
(function() {
171+
var stripe = Stripe('pk_live_DLK9BZOJyv60jyy5ZaRfbuIf00oVk0q1nT');
172+
var checkoutButtons = document.getElementsByClassName('adventech-donate-button');
173+
174+
for (var i = 0; i < checkoutButtons.length; i++) {
175+
var checkoutButton = checkoutButtons[i];
176+
checkoutButton.addEventListener('click', function () {
177+
var sku = this.getAttribute("id");
178+
// When the customer clicks on the button, redirect
179+
// them to Checkout.
180+
181+
var item = {quantity: 1};
182+
183+
if (sku.indexOf("sku") === 0) {
184+
item.sku = sku
185+
} else {
186+
item.plan = sku
187+
}
188+
189+
stripe.redirectToCheckout({
190+
items: [item],
191+
successUrl: 'https://adventech.io/donate/?thank-you',
192+
cancelUrl: 'https://adventech.io/donate/',
193+
})
194+
.then(function (result) {
195+
if (result.error) {
196+
var displayError = document.getElementById('error-message');
197+
displayError.textContent = result.error.message;
198+
}
199+
});
200+
});
201+
}
202+
})();
203+
</script>
204+
</div>
205+
</div>
206+
</div>
207+
</div>
208+
</main>
209+
210+
<footer class="footer bg-dark text-light p-4 p-md-3">
211+
<div class="container">
212+
<div class="row align-items-center">
213+
<div class="col-md-9 py-4 p-md-3">
214+
<p>Made with ♥ by Adventech</p>
215+
216+
<p class="my-0 text-secondary">All contributors are members of the Seventh-day Adventist Church. We are supported by various Conferences, Unions, and Divisions of the Church, but we not affiliated with the General Conference.</p>
217+
</div>
218+
<div class="col-md-3 mt-5 mt-md-0">
219+
<div class="container">
220+
<div class="row justify-content-center justify-content-md-end">
221+
<div class="col-2 col-md-3 text-center">
222+
<a href="https://instagram.com/adventech" target="_blank"><img src="/images/adventech-social-instagram.png" /></a>
223+
</div>
224+
<div class="col-2 col-md-3 text-center">
225+
<a href="https://facebook.com/shabbatschool" target="_blank"><img src="/images/adventech-social-facebook.png" /></a>
226+
</div>
227+
<div class="col-2 col-md-3 text-center">
228+
<a href="https://github.com/Adventech" target="_blank"><img src="/images/adventech-social-github.png" /></a>
229+
</div>
230+
</div>
231+
</div>
232+
</div>
233+
</div>
234+
</div>
235+
</footer>
236+
237+
</body>
238+
</html>

‎index.html

+125-3
Original file line numberDiff line numberDiff line change
@@ -45,12 +45,15 @@
4545
<li class="nav-item active mx-auto my-1">
4646
<a class="nav-link" href="/about/"><strong>About</strong></a>
4747
</li>
48-
<li class="nav-item active mx-auto my-1">
48+
<li class="nav-item active mx-auto my-1">
4949
<a class="nav-link" href="/sabbath-school/"><strong>Sabbath School</strong></a>
5050
</li>
5151
</ul>
5252
<div class="text-center my-2">
53-
<a href="https://github.com/Adventech" class="btn btn-outline-primary" role="button" target="_blank"> ♥ Contribute</a>
53+
<a href="https://github.com/Adventech" class="btn btn-outline-secondary mr-2" role="button" target="_blank">🐙 GitHub</a>
54+
</div>
55+
<div class="text-center my-2">
56+
<a href="/donate/" class="btn btn-outline-primary" role="button"> ♥ Contribute</a>
5457
</div>
5558
</div>
5659
</nav>
@@ -90,7 +93,126 @@ <h1>Our Call is Clear</h1>
9093
</div>
9194
</div>
9295

93-
<div class="my-5 py-5 p-4 p-md-3">
96+
<div class="my-lg-5 py-5 p-4 p-md-3">
97+
<div class="container">
98+
<div class="row">
99+
<div class="col-7">
100+
<h1>Donate to support our development</h1>
101+
102+
<p class="adventech-paragraph my-3">We have many ideas and many projects that we want to embark on, as well as supporting existing projects like Sabbath School app. To date, we have seen an incredible <span class="text-primary">growth</span> of the application with a lot of usage, feedback, value and most importantly service that it provides to our users. We want to continue adding new features and functionality to make it even a
103+
<span class="text-primary">better</span> application. For example this year we plan to add <span class="text-primary">audio / video</span> support for Sabbath School app.</p>
104+
105+
<p class="adventech-paragraph my-3">
106+
We are humbled that many of you have <span class="text-primary">offered</span> to donate to our ministry and it is truly motivating to be working with all of you.
107+
</p>
108+
109+
<p class="adventech-paragraph my-3">
110+
Click <a href="/donate/">here</a> to learn more about our expenses
111+
</p>
112+
</div>
113+
<div class="col-5">
114+
<div id="error-message"></div>
115+
<div id="thank-you" class="thank-you">
116+
<h3 class="text-primary">Thank you</h3>
117+
<p class="adventech-paragraph my-3">
118+
For being so awesome!
119+
</p>
120+
</div>
121+
122+
<script>
123+
(function(){
124+
if (window.location.href.indexOf("?thank-you") > 0){
125+
document.getElementById('thank-you').classList.add('thank-you-visible');
126+
}
127+
})();
128+
</script>
129+
130+
<div class="row">
131+
<div class="col-5">
132+
<div class="py-3 adventech-donate-button"
133+
id="sku_HDCxnnJ6UafLgj">
134+
<p class="amount">$10</p>
135+
<p class="small text-secondary">One-time donation</p>
136+
</div>
137+
</div>
138+
<div class="col-5">
139+
<div class="py-3 adventech-donate-button"
140+
id="sku_HDD1QqLPhevtqE">
141+
<p class="amount">$25</p>
142+
<p class="small text-secondary">One-time donation</p>
143+
</div>
144+
</div>
145+
<div class="col-5 mt-4">
146+
<div class="py-3 adventech-donate-button"
147+
id="sku_HDD1RZzsh403uM">
148+
<p class="amount">$50</p>
149+
<p class="small text-secondary">One-time donation</p>
150+
</div>
151+
</div>
152+
<div class="col-5 mt-4">
153+
<div class="py-3 adventech-donate-button"
154+
id="sku_HDD2PYMCgf5lTI">
155+
<p class="amount">$100</p>
156+
<p class="small text-secondary">One-time donation</p>
157+
</div>
158+
</div>
159+
<div class="col-5 mt-4">
160+
<div class="py-3 adventech-donate-button"
161+
id="plan_HDD3ukXRzJUB46">
162+
<p class="amount">$10</p>
163+
<p class="small text-secondary"><strong class="text-primary">Monthly</strong> donation</p>
164+
</div>
165+
</div>
166+
<div class="col-5 mt-4">
167+
<div class="py-3 adventech-donate-button"
168+
id="plan_HDE8TKrHo5jzpn">
169+
<p class="amount">$25</p>
170+
<p class="small text-secondary"><strong class="text-primary">Monthly</strong> donation</p>
171+
</div>
172+
</div>
173+
</div>
174+
175+
<script>
176+
(function() {
177+
var stripe = Stripe('pk_live_DLK9BZOJyv60jyy5ZaRfbuIf00oVk0q1nT');
178+
var checkoutButtons = document.getElementsByClassName('adventech-donate-button');
179+
180+
for (var i = 0; i < checkoutButtons.length; i++) {
181+
var checkoutButton = checkoutButtons[i];
182+
checkoutButton.addEventListener('click', function () {
183+
var sku = this.getAttribute("id");
184+
// When the customer clicks on the button, redirect
185+
// them to Checkout.
186+
187+
var item = {quantity: 1};
188+
189+
if (sku.indexOf("sku") === 0) {
190+
item.sku = sku
191+
} else {
192+
item.plan = sku
193+
}
194+
195+
stripe.redirectToCheckout({
196+
items: [item],
197+
successUrl: 'https://adventech.io/donate/?thank-you',
198+
cancelUrl: 'https://adventech.io/donate/',
199+
})
200+
.then(function (result) {
201+
if (result.error) {
202+
var displayError = document.getElementById('error-message');
203+
displayError.textContent = result.error.message;
204+
}
205+
});
206+
});
207+
}
208+
})();
209+
</script>
210+
</div>
211+
</div>
212+
</div>
213+
</div>
214+
215+
<div class="bg-light my-5 py-5 p-4 p-md-3">
94216
<div class="container">
95217
<div class="row align-items-center">
96218
<div class="col-lg-5">

0 commit comments

Comments
 (0)