Files
docs/src/components/Footer.astro
T
naomi 49dd426ed9
Code Analysis / SonarQube (push) Failing after 1m23s
Node.js CI / Lint and Test (push) Successful in 1m26s
feat: add donate badge
2025-05-31 18:15:26 -07:00

48 lines
1.2 KiB
Plaintext

---
import LastUpdated from "@astrojs/starlight/components/LastUpdated.astro";
import EditLink from "@astrojs/starlight/components/EditLink.astro";
import Pagination from "@astrojs/starlight/components/Pagination.astro";
---
<footer class="sl-flex">
<div class="meta sl-flex">
<EditLink {...Astro.props} />
<LastUpdated {...Astro.props} />
</div>
<Pagination {...Astro.props} />
<div id="extra-footer-content">
<div id="tree-nation-offset-website"></div>
<a href="https://buy.stripe.com/cN24iTfqu1j6b3afZ2" target="_blank" rel="noreferrer">
<img src="https://cdn.nhcarrigan.com/donate.png" alt="Donate" style="width: 70px; height: 70px;">
</a>
</div>
<script>
TreeNationOffsetWebsite({
code: "a17464e0cd351220",
lang: "en",
theme: "dark",
}).render("#tree-nation-offset-website");
</script>
</footer>
<style>
footer {
flex-direction: column;
gap: 1.5rem;
}
.meta {
gap: 0.75rem 3rem;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 3rem;
font-size: var(--sl-text-sm);
color: var(--sl-color-gray-3);
}
.meta > :global(p:only-child) {
margin-inline-start: auto;
}
#tree-nation-offset-website {
margin: auto;
}
</style>