Add donation page

This commit is contained in:
John Doe 2021-05-20 20:23:34 -04:00
parent 9fafa8f380
commit cd1d6fcfc0
2 changed files with 113 additions and 0 deletions

View file

@ -16,6 +16,8 @@
humanName="about & contact"
/>
<NavItem {segment} href="./donate" matchingSegment="donate" humanName="donate" />
<div class="dropdown">
<div
class="dropdown-name"

111
src/routes/donate.svelte Normal file
View file

@ -0,0 +1,111 @@
<script>
import TalkingPointContainer from "../components/TalkingPointContainer.svelte";
import TalkingPointContent from "../components/TalkingPointContent.svelte";
import TalkingPointName from "../components/TalkingPointName.svelte";
</script>
<svelte:head>
<title>FemtoStar - Donate</title>
</svelte:head>
<div class="site">
<TalkingPointContainer>
<TalkingPointName text="Donations" />
<TalkingPointContent>
<p>
The FemtoStar Project is a community of volunteers funded by a grant from our partner NLnet,
out-of-pocket by some of our members, and from donations by our community. Nobody is required
to donate, and we currently don't have much in terms of perks for donors, but if you'd like to see
this project succeed and are able to, consider throwing a few dollars our way or setting up
a recurring donation through Liberapay.
</p>
<p>
Donations go directly into buying hardware for the project. All of our members are volunteers, and our
operating costs apart from hardware are low enough to cover out of pocket. Everything donated here will
be spent on hardware to make this project possible.
</p>
</TalkingPointContent>
</TalkingPointContainer>
<TalkingPointContainer>
<TalkingPointName text="Donate via PayPal" />
<TalkingPointContent>
<p>
Via PayPal, we accept both one-time donations directly via PayPal, and recurring donations via Liberapay
(processed using PayPal).
</p>
<p>
<b>PayPal (one-time donation):</b> <a href="https://www.paypal.com/donate/?hosted_button_id=M2N5N2B624CNQ&source=url">Click Here</a>
</p>
<p>
<b>Liberapay (recurring donation):</b> <a href="https://liberapay.com/FemtoStar/donate">Click Here</a>
</p>
</TalkingPointContent>
</TalkingPointContainer>
<TalkingPointContainer>
<TalkingPointName text="Donate Cryptocurrency" />
<TalkingPointContent>
<p>
If you would like to make a donation in cryptocurrency, please send any amount of Bitcoin or Monero to
one of the following addresses.
</p>
<p>
<b>Bitcoin:</b> <span class="crypto-address">bc1qnytm8arpuz247622yef070nvxx56qp6dqwl80s</span>
</p>
<p>
<b>Monero:</b> <span class="crypto-address">83YcY9dsxARYkS4AaKVNkEJTLMQnuvuzSSij9vC7SqU7eriCpHHBsrs2ijKE6MQjobUShY4D2kjQTZ3XXp7WMtR7PdjKrx9</span>
</p>
</TalkingPointContent>
</TalkingPointContainer>
<TalkingPointContainer>
<TalkingPointName text="Want to donate another way?" />
<TalkingPointContent>
<p>
If you would like to donate via a method not listed above (such as via
a different payment processor or in a different cryptocurrency), please
<a href="about-contact/">contact us</a> and we'd be glad to help set something up.
</p>
</TalkingPointContent>
</TalkingPointContainer>
</div>
<style>
.site {
margin-left: auto;
margin-right: auto;
padding-top: 0;
padding-bottom: 3em;
max-width: 1024px;
padding-left: 2em;
padding-right: 2em;
}
.c{
overflow: hidden;
height: 0px;
width: 0px;
position: absolute;
}
.j{
overflow: hidden;
height: 0px;
width: 0px;
position: absolute;
}
.crypto-address{
overflow-wrap: break-word;
word-break: break-all;
}
talkingPointContainer{
overflow-wrap: normal;
}
:global(.site a) {
color: #72bbd9;
}
</style>