54 lines
1.4 KiB
Plaintext
54 lines
1.4 KiB
Plaintext
---
|
|
import Button from "../ui/Button.astro";
|
|
import FeaturedGroup from "../ui/FeaturedGroup.astro";
|
|
---
|
|
|
|
<style>
|
|
.custom-bg {
|
|
position: absolute;
|
|
top: 0;
|
|
right: -12.5%;
|
|
bottom: 0;
|
|
left: -12.5%;
|
|
margin: 2% 0;
|
|
background: var(--color-charcoal);
|
|
transform: matrix(1, 0.04, -0.04, 1, 0, 0);
|
|
z-index: -1;
|
|
overflow: hidden;
|
|
height: 500px;
|
|
}
|
|
|
|
.custom-bg::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 3%;
|
|
bottom: -9%;
|
|
left: 10%;
|
|
right: 10%;
|
|
background-image: url("/src/assets/donate-gfx-right.png");
|
|
background-position: 100% 100%;
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
transform: rotate(-2.25deg);
|
|
}
|
|
</style>
|
|
|
|
<section id="how" class="relative overflow-hidden max-w-[100vw]">
|
|
<div class="custom-bg"></div>
|
|
<div
|
|
class="max-w-3xl bg-black/50 p-3 py-10 lg:bg-transparent lg:px-0 mx-10 md:mx-20 lg:mx-40"
|
|
>
|
|
<FeaturedGroup
|
|
subtitle="Donate via Gitcoin during funding rounds"
|
|
title="How should I donate?"
|
|
text={[
|
|
"When Gitcoin is doing funding rounds, donating through their website will give a matching bonus of up to 150%. This means that your donation will have a bigger impact on the project during this time period.",
|
|
]}
|
|
/>
|
|
<Button
|
|
href="https://explorer.gitcoin.co/#/round/10/0x8de918f0163b2021839a8d84954dd7e8e151326d/0x8de918f0163b2021839a8d84954dd7e8e151326d-130"
|
|
label="Gitcoin"
|
|
/>
|
|
</div>
|
|
</section>
|