mira/website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add fediring

Browse source
This commit is contained in:
ArgentumCation 2024-07-11 12:38:27 -04:00
parent 3c83c626ea
commit c7c8b0c8cc
1 changed files with 60 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
src/components/Footer.astro
View file

@ -1,19 +1,19 @@
--- ---
import buttons from '../buttons/buttons.json'; import buttons from "../buttons/buttons.json";
import { Image } from 'astro:assets'; import { Image } from "astro:assets";
const today = new Date(); const today = new Date();
let themeObj = await import("../../public/themes.json"); let themeObj = await import("../../public/themes.json");
let themes = new Map( let themes = new Map(
Object.entries(themeObj).sort((a, b) => Object.entries(themeObj).sort((a, b) =>
a[0].localeCompare(b[0], "en", { sensitivity: "base" }) a[0].localeCompare(b[0], "en", { sensitivity: "base" }),
) ),
); );
themes.delete("default"); themes.delete("default");
--- ---
<footer> <footer style="display: flex;flex-direction: column;">
<div class="h-card" style="display:inline"> <div class="h-card" style="display:inline;margin:auto;">
This work &copy; {today.getFullYear()} by This work &copy; {today.getFullYear()} by
<!-- Author Info --> <!-- Author Info -->
<a href="https://argentumcation.com/links" rel="author"> <a href="https://argentumcation.com/links" rel="author">
@ -22,7 +22,7 @@ themes.delete("default");
</a> </a>
<!-- Author Metadata --> <!-- Author Metadata -->
<div hidden=""> <div hidden="">
<span class="p-honorific-suffix">Kendo 3-Kyu</span> <span class="p-honorific-suffix">Kendo 3-Kyu Emeritus</span>
<img <img
style="float:left; margin-right:4px" style="float:left; margin-right:4px"
src="https://argentumcation.com/links/images/mira.jpg" src="https://argentumcation.com/links/images/mira.jpg"
@ -39,17 +39,18 @@ themes.delete("default");
><!-- Yes I know the spec says sound file but fuck you -->miɹʌ</span ><!-- Yes I know the spec says sound file but fuck you -->miɹʌ</span
> >
</div> </div>
<wbr> <wbr />
is licensed under is licensed under
<!-- License --> <!-- License -->
<a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" rel="license" <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" rel="license"
>CC BY-NC-SA 4.0</a >CC BY-NC-SA 4.0</a
> >
</div> </div>
&ensp;
<!-- Theme Switcher box --> <!-- Theme Switcher box -->
<form style="display:inline-flex"> <div style="margin:auto">
<div class="form-group" style="display:inline-flex"> Theme:
<form style="display:inline-flex;margin:auto">
<div class="form-group" style="display:inline-flex;margin-bottom:0">
<select <select
style="width:8em" style="width:8em"
id="theme" id="theme"
@ -64,16 +65,22 @@ themes.delete("default");
</select> </select>
</div> </div>
</form> </form>
</div>
<p style="margin:auto">
<a href="https://fediring.net/previous?host=argentumcation.com">←</a>
<a href="https://fediring.net/">Fediring</a>
<a href="https://fediring.net/next?host=argentumcation.com">→</a>
</p>
<!-- Theme Switcher Script --> <!-- Theme Switcher Script -->
<script is:inline> <script is:inline>
function switchTheme(theme) { function switchTheme(theme) {
window.localStorage.setItem("theme", theme); window.localStorage.setItem("theme", theme);
let htmlNode = document.getElementsByTagName("html")[0]; let htmlNode = document.getElementsByTagName("html")[0];
let currentTheme = Array.from(htmlNode.classList).find((el) => let currentTheme = Array.from(htmlNode.classList).find((el) =>
el.startsWith("theme_") el.startsWith("theme_"),
); );
console.log( console.log(
`CurrentTheme: ${currentTheme}, Theme:${JSON.stringify(theme)}` `CurrentTheme: ${currentTheme}, Theme:${JSON.stringify(theme)}`,
); );
htmlNode.classList.replace(currentTheme, theme); htmlNode.classList.replace(currentTheme, theme);
document.getElementById(theme).setAttribute("selected", true); document.getElementById(theme).setAttribute("selected", true);
@ -81,22 +88,35 @@ themes.delete("default");
</script> </script>
<script is:inline> <script is:inline>
document.addEventListener("DOMContentLoaded", () => document.addEventListener("DOMContentLoaded", () =>
document.getElementById(theme)?.setAttribute("selected", "true") document.getElementById(theme)?.setAttribute("selected", "true"),
); );
</script> </script>
<marquee> <marquee>
{ {
buttons.map((button) => { buttons.map((button) => {
const image = <Image class="marquee-button" src={`/buttons/${button.image}`} alt={button.name} width={88} height={31} />; const image = (
<Image
class="marquee-button"
src={`/buttons/${button.image}`}
alt={button.name}
width={88}
height={31}
/>
);
return !button.link?.startsWith('javascript:') ? ( return !button.link?.startsWith("javascript:") ? (
<a href={button.link ?? undefined} title={button.name} target="_blank"> <a
href={button.link ?? undefined}
title={button.name}
target="_blank"
>
{image} {image}
</a> </a>
) : ( ) : (
<button title={button.name} onclick={button.link}> <button title={button.name} onclick={button.link}>
{image} {image}
</button>); </button>
);
}) })
} }
</marquee> </marquee>