nhcarrigan/docs
2
0
Fork 0
generated from nhcarrigan/template
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add overlay video (#39)

Browse Source 
Reviewed-on: https://codeberg.org/nhcarrigan/docs/pulls/39
Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com>
Co-committed-by: Naomi Carrigan <commits@nhcarrigan.com>
This commit is contained in:
Naomi Carrigan 2024-11-28 22:22:50 +00:00 committed by Naomi the Technomancer
parent 326720da21
commit fa915b5961
1 changed files with 36 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
src/components/Footer.astro
View File

@ -3,33 +3,47 @@ import LastUpdated from "@astrojs/starlight/components/LastUpdated.astro";
import EditLink from "@astrojs/starlight/components/EditLink.astro"; import EditLink from "@astrojs/starlight/components/EditLink.astro";
import Pagination from "@astrojs/starlight/components/Pagination.astro"; import Pagination from "@astrojs/starlight/components/Pagination.astro";
--- ---
<footer class="sl-flex"> <footer class="sl-flex">
<div class="meta sl-flex"> <div class="meta sl-flex">
<EditLink {...Astro.props} /> <EditLink {...Astro.props} />
<LastUpdated {...Astro.props} /> <LastUpdated {...Astro.props} />
</div> </div>
<Pagination {...Astro.props} /> <Pagination {...Astro.props} />
<div id="tree-nation-offset-website"></div> <div id="tree-nation-offset-website"></div>
<script>TreeNationOffsetWebsite({code: 'a17464e0cd351220', lang: 'en', theme: 'dark'}).render('#tree-nation-offset-website');</script> <script>
TreeNationOffsetWebsite({
code: "a17464e0cd351220",
lang: "en",
theme: "dark",
}).render("#tree-nation-offset-website");
</script>
<video
autoplay={true}
loop={true}
muted={true}
playsinline={true}
src="https://cdn.nhcarrigan.com/overlay.webm"
style={{ pointerEvents: "none", position: "fixed", top: 0, left: 0, opacity: 0.25, zIndex:100, width: "100vw", height: "100vh"}}></video>
</footer> </footer>
<style> <style>
footer { footer {
flex-direction: column; flex-direction: column;
gap: 1.5rem; gap: 1.5rem;
} }
.meta { .meta {
gap: 0.75rem 3rem; gap: 0.75rem 3rem;
justify-content: space-between; justify-content: space-between;
flex-wrap: wrap; flex-wrap: wrap;
margin-top: 3rem; margin-top: 3rem;
font-size: var(--sl-text-sm); font-size: var(--sl-text-sm);
color: var(--sl-color-gray-3); color: var(--sl-color-gray-3);
} }
.meta > :global(p:only-child) { .meta > :global(p:only-child) {
margin-inline-start: auto; margin-inline-start: auto;
} }
#tree-nation-offset-website { #tree-nation-offset-website {
margin: auto; margin: auto;
} }
</style> </style>