mirror of
https://git.solarpunk.moe/Fries/fries-website.git
synced 2024-11-22 22:12:22 +00:00
add a webring component to the site
this is for the solarpunk.moe webring.
This commit is contained in:
parent
8cde083875
commit
cfa234d723
11 changed files with 1157 additions and 620 deletions
|
@ -1,4 +1,8 @@
|
||||||
import { defineConfig } from 'astro/config';
|
import { defineConfig } from 'astro/config';
|
||||||
|
|
||||||
|
import svelte from "@astrojs/svelte";
|
||||||
|
|
||||||
// https://astro.build/config
|
// https://astro.build/config
|
||||||
export default defineConfig({});
|
export default defineConfig({
|
||||||
|
integrations: [svelte()]
|
||||||
|
});
|
|
@ -10,7 +10,9 @@
|
||||||
"astro": "astro"
|
"astro": "astro"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@astrojs/svelte": "^3.1.0",
|
||||||
"@fontsource/atkinson-hyperlegible": "^4.5.11",
|
"@fontsource/atkinson-hyperlegible": "^4.5.11",
|
||||||
"astro": "^2.1.0"
|
"astro": "^2.7.3",
|
||||||
|
"svelte": "^4.0.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
1696
pnpm-lock.yaml
1696
pnpm-lock.yaml
File diff suppressed because it is too large
Load diff
|
@ -1,3 +1,7 @@
|
||||||
|
---
|
||||||
|
import Webring from "./Webring.svelte";
|
||||||
|
---
|
||||||
|
|
||||||
<footer aria-label="my websites footer">
|
<footer aria-label="my websites footer">
|
||||||
<a href="https://git.solarpunk.moe/fries/fries-website">Source Code</a>
|
<a href="https://git.solarpunk.moe/fries/fries-website">Source Code</a>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
|
@ -9,7 +9,6 @@
|
||||||
#nav-container {
|
#nav-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
font-size: 20px;
|
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
gap: 20px;
|
gap: 20px;
|
||||||
|
|
33
src/components/Webring.svelte
Normal file
33
src/components/Webring.svelte
Normal file
|
@ -0,0 +1,33 @@
|
||||||
|
<section class="webring-box" aria-label="the solarpunk.moe webring">
|
||||||
|
<a id="previous" href={`${api_url}/previous?source_url=${site_url}`}>
|
||||||
|
<p class="no-margin">←</p>
|
||||||
|
<p class="no-margin" id="previous-text">Previous</p>
|
||||||
|
</a>
|
||||||
|
<h2 class="no-margin">solarpunk.moe</h2>
|
||||||
|
<h2 class="no-margin">webring</h2>
|
||||||
|
<a id="next" href={`${api_url}/next?source_url=${site_url}`}>
|
||||||
|
<p class="no-margin" id="next-text">Next</p>
|
||||||
|
<p class="no-margin">→</p>
|
||||||
|
</a>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.webring-box {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
|
||||||
|
.no-margin {
|
||||||
|
margin: 0px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import {main} from '../scripts/Webring';
|
||||||
|
let api_url = import.meta.env.PUBLIC_API_URL;
|
||||||
|
let site_url = import.meta.env.PUBLIC_SITE_URL;
|
||||||
|
main();
|
||||||
|
</script>
|
|
@ -8,6 +8,7 @@ import '@fontsource/atkinson-hyperlegible';
|
||||||
import Footer from "../components/Footer.astro";
|
import Footer from "../components/Footer.astro";
|
||||||
import Navigation from "../components/Navigation.astro";
|
import Navigation from "../components/Navigation.astro";
|
||||||
import "../styles/global.css";
|
import "../styles/global.css";
|
||||||
|
import Webring from '../components/Webring.svelte';
|
||||||
---
|
---
|
||||||
|
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
|
@ -23,6 +24,8 @@ import "../styles/global.css";
|
||||||
<hr>
|
<hr>
|
||||||
<slot />
|
<slot />
|
||||||
<hr>
|
<hr>
|
||||||
|
<Webring client:load />
|
||||||
|
<hr>
|
||||||
<Footer />
|
<Footer />
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -3,6 +3,7 @@ import Layout from "../layouts/Layout.astro";
|
||||||
import Header from "../components/Header.astro";
|
import Header from "../components/Header.astro";
|
||||||
import Introduction from "../components/Introduction.astro";
|
import Introduction from "../components/Introduction.astro";
|
||||||
import Links from "../components/Links.astro";
|
import Links from "../components/Links.astro";
|
||||||
|
import Webring from "../components/Webring.svelte";
|
||||||
---
|
---
|
||||||
|
|
||||||
<Layout title="fries gay place">
|
<Layout title="fries gay place">
|
||||||
|
|
19
src/scripts/Webring.ts
Normal file
19
src/scripts/Webring.ts
Normal file
|
@ -0,0 +1,19 @@
|
||||||
|
type Names = {
|
||||||
|
previous_site_name: string
|
||||||
|
next_site_name: string
|
||||||
|
};
|
||||||
|
|
||||||
|
export async function main() {
|
||||||
|
if (import.meta.env.SSR) return;
|
||||||
|
|
||||||
|
let api_url = import.meta.env.PUBLIC_API_URL;
|
||||||
|
let site_url = import.meta.env.PUBLIC_SITE_URL;
|
||||||
|
let previous_text = document.getElementById("previous-text") as HTMLParagraphElement;
|
||||||
|
let next_text = document.getElementById("next-text") as HTMLParagraphElement;
|
||||||
|
|
||||||
|
const request = await fetch(`${api_url}/name?source_url=${site_url}`);
|
||||||
|
const names: Names = await request.json();
|
||||||
|
|
||||||
|
previous_text.textContent = names.previous_site_name;
|
||||||
|
next_text.textContent = names.next_site_name;
|
||||||
|
}
|
5
svelte.config.js
Normal file
5
svelte.config.js
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
import { vitePreprocess } from '@astrojs/svelte';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
preprocess: vitePreprocess(),
|
||||||
|
};
|
|
@ -1,3 +1,6 @@
|
||||||
{
|
{
|
||||||
"extends": "astro/tsconfigs/strict"
|
"extends": "astro/tsconfigs/strict",
|
||||||
|
"compilerOptions": {
|
||||||
|
"lib": ["DOM", "DOM.Iterable"]
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue