Link overhaul, services page, site-info page

This commit is contained in:
nelle 2024-07-04 16:04:41 -06:00
parent d06eb0156c
commit deb462de21
12 changed files with 153 additions and 256 deletions

View file

@ -1,61 +0,0 @@
---
interface Props {
title: string;
body: string;
href: string;
}
const { href, title, body } = Astro.props;
---
<li class="link-card">
<a href={href} class="informational">
<h2>
{title}
<span>&rarr;</span>
</h2>
<p>
{body}
</p>
</a>
</li>
<style>
.link-card {
list-style: none;
display: flex;
padding: 1px;
background-color: #23262d;
background-image: none;
background-size: 400%;
border-radius: 7px;
background-position: 100%;
transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}
.link-card > a {
width: 100%;
text-decoration: none;
line-height: 1.4;
padding: calc(1.5rem - 1px);
border-radius: 8px;
color: white;
background-color: #23262d;
opacity: 0.8;
}
h2 {
margin: 0;
font-size: 1.25rem;
transition: color 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
p {
margin-top: 0.5rem;
margin-bottom: 0;
}
.link-card:is(:hover, :focus-within) {
background-position: 0;
background-image: var(--accent-gradient);
}
.link-card:is(:hover, :focus-within) h2 {
color: rgb(var(--accent-light));
}
</style>

View file

@ -1,66 +0,0 @@
---
interface Props {
title: string;
body: string;
href: string;
source: string;
alt: string;
}
const { href, title, body, source, alt } = Astro.props;
---
<li class="link-card">
<a href={href} class="informational">
<h2>
<img src={source} width="24" height="24" alt={alt} />
{title}
<span>&rarr;</span>
</h2>
<p>
{body}
</p>
</a>
</li>
<style>
.link-card {
align-items: center;
list-style: none;
display: flex;
padding: 1px;
background-color: #23262d;
background-image: none;
background-size: 400%;
border-radius: 7px;
background-position: 100%;
transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}
.link-card > a {
align-items: center;
width: 100%;
text-decoration: none;
line-height: 1.4;
padding: calc(1.5rem - 1px);
border-radius: 8px;
color: white;
background-color: #23262d;
opacity: 0.8;
}
h2 {
margin: 0;
font-size: 1.25rem;
transition: color 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
p {
margin-top: 0.5rem;
margin-bottom: 0;
}
.link-card:is(:hover, :focus-within) {
background-position: 0;
background-image: var(--accent-gradient);
}
.link-card:is(:hover, :focus-within) h2 {
color: rgb(var(--accent-light));
}
</style>

View file

@ -71,5 +71,6 @@ const today = new Date();
</div> </div>
<div class="content"> <div class="content">
<p class="small-quote">El. Psy. Kongroo.</p> <p class="small-quote">El. Psy. Kongroo.</p>
<a class="small-quote" href="/site-info">Site Info</a>
</div> </div>
</footer> </footer>

View file

@ -18,11 +18,18 @@ import { SITE_TITLE } from "../consts";
<span>Projects</span> <span>Projects</span>
</button> </button>
<button
class="custom-btn btn-1"
type="button"
onclick="location.href='/services'">
<span>Services</span>
</button>
<button <button
class="custom-btn btn-1" class="custom-btn btn-1"
type="button" type="button"
onclick="location.href='/blog'"> onclick="location.href='/blog'">
<span>Blog</span> <span>Blog</span>
</button> </button>
</nav> </nav>
<br> <br>

View file

@ -1,6 +1,4 @@
--- ---
import BlogCard from "../../components/Card-Blog.astro";
import Card from "../../components/Card.astro"
import Layout from "../../layouts/Layout.astro"; import Layout from "../../layouts/Layout.astro";
import { getCollection } from "astro:content"; import { getCollection } from "astro:content";
@ -9,36 +7,32 @@ const posts = (await getCollection("blog")).sort(
); );
--- ---
<Layout title="LimePot - Blog"> <Layout title="LimePot - Blog">
<div class="content"> <div class="content">
<main> <main>
<center> <h1 class="title" style="text-align: center;">The Blog Posts</h1>
<h1 class="title">The Blog Posts</h1> <h2 class="subtitle" style="text-align: center;">
<h2 class="subtitle">This is where I post things and stuff, eventually...</h2> This is where I post things and stuff, eventually...
<h3>This list is in chronological order oldest first, newest last</h3> </h2>
<h4>I think I may add a button that shows latest post at the top under rss, we'll see.</h4> <h3 style="text-align: center;">This list is in chronological order oldest first, newest last</h3>
</center> <h4 style="text-align: center;">
<hr> I think I may add a button that shows latest post at the top under
<ul role="list" class="link-card-grid"> rss, we'll see.
<Card </h4>
href="/rss.xml" <hr />
title="RSS Feed" <a href="/rss.xml"><h3 style="text-align: center;">RSS Feed</h3></a>
source="/assets/rss.png" <hr />
/> {
</ul> posts.map((post) => (
<hr> <>
{ <ul role="list">
posts.map((post) => ( <li>
<> <a href={`/blog/${post.slug}/`}>{post.data.title}</a>
<ul role="list" class="link-card-grid"> </li>
<BlogCard </ul>
href={`/blog/${post.slug}/`} </>
title={post.data.title} /> ))
</ul> }
</> </main>
)) </div>
} </Layout>
</main>
</div>
</Layout>

View file

@ -1,6 +1,5 @@
--- ---
import Layout from "../layouts/Layout.astro"; import Layout from "../layouts/Layout.astro";
import Card from "../components/Card.astro";
--- ---
<Layout> <Layout>

View file

@ -1,6 +1,5 @@
--- ---
import Layout from "../layouts/Layout-nochrome.astro"; import Layout from "../layouts/Layout-nochrome.astro";
import Card from "../components/Card-noimg.astro";
--- ---
<Layout title="LimePot"> <Layout title="LimePot">

View file

@ -1,6 +1,5 @@
--- ---
import Layout from "../layouts/Layout.astro"; import Layout from "../layouts/Layout.astro";
import Card from "../components/Card.astro";
--- ---
<Layout title="LimePot"> <Layout title="LimePot">
@ -9,12 +8,12 @@ import Card from "../components/Card.astro";
<marquee Behavior="Alternate"> <marquee Behavior="Alternate">
<h2 class="title">LimePotato</h2> <h2 class="title">LimePotato</h2>
</marquee> </marquee>
<h3 class="subtitle" style="text-align: center;">Welcome to my weird little spot of the universe :3</h3> <h3 class="subtitle" style="text-align: center;">Welcome to my weird little spot of the internet :3</h3>
</div> </div>
<br>
<div class="content"> <div class="content">
<figure> <figure>
<figcaption> <figcaption>
<h2 class="subtitle" style="text-align: center;">Some Ambience?</h2> <h2 class="subtitle" style="text-align: center;">Some Ambience?</h2>
<span style="font-size: small;"> <span style="font-size: small;">
<a href="/assets/sounds/ambience/383506__klankbeeld__pinewood-in-memoriam-febr-05-nl-giersbergen-33db-170215_1085.flac"> <a href="/assets/sounds/ambience/383506__klankbeeld__pinewood-in-memoriam-febr-05-nl-giersbergen-33db-170215_1085.flac">

View file

@ -1,41 +1,53 @@
--- ---
import Layout from "../layouts/Layout-nochrome.astro"; import Layout from "../layouts/Layout-nochrome.astro";
import Card from "../components/Card-noimg.astro";
--- ---
<Layout title="LimePot"> <Layout title="LimePot">
<main> <main>
<div class="content" style="text-align: center;"> <div class="content">
<h1 class="title">You Are Using a Chromium-based Browser.</h1> <h1 class="title" style="text-align: center;">You Are Using a Chromium-based Browser.</h1>
<h2 class="subtitle"> <h2 class="subtitle" style="text-align: center;">
There are many reasons not to use chrome (as well as base firefox), There are many reasons not to use chrome (as well as base firefox),
consider using an alternative browser. consider using an alternative browser.
</h2> </h2>
<hr /> <hr />
<ul role="list" class="link-card-grid"> <ul role="list">
<Card href="https://fuckoffgoogle.de/" title="Google is Evil" /> <li>
<Card href="https://privacytests.org/" title="Browser Privacy Tests" /> <a href="https://fuckoffgoogle.de/">Google is Evil</a>
</li>
<br>
<li>
<a href="https://privacytests.org/">Browser Privacy Tests</a>
</li>
</ul> </ul>
<hr /> <hr />
<h2 class="subtitle">Some Recommendations</h2> <h2 class="subtitle" style="text-align: center;">Some Recommendations</h2>
<ul role="list" class="link-card-grid"> <ul role="list">
<Card href="https://librewolf.net/" title="*Librewolf" /> <li>
<Card href="https://mullvad.net/en/browser" title="Mullvad Browser" /> <a href="https://librewolf.net/">Librewolf</a>
<Card href="https://www.waterfox.net/" title="Waterfox" /> </li>
<Card href="https://www.netsurf-browser.org/" title="Netsurf" /> <br>
<Card <li>
href="https://awesomekling.github.io/Ladybird-a-new-cross-platform-browser-project/" <a href="https://mullvad.net/en/browser">Mullvad Browser</a>
title="Ladybird" </li>
/> <br>
<Card <li>
href="https://www.microsoft.com/en-us/download/internet-explorer" <a href="https://www.waterfox.net/">Waterfox</a>
title="Internet Explorer" </li>
/> <br>
<li>
<a href="https://www.netsurf-browser.org/">Netsurf</a>
</li>
<br>
<li>
<a href="https://www.microsoft.com/en-us/download/internet-explorer">Internet Explorer</a>
</li>
<br>
</ul> </ul>
<hr /> <hr />
<a <a
href="https://chromewebstore.google.com/detail/user-agent-switcher-and-m/bhchdcejhohfmigjafbampogmaanbfkg" href="https://chromewebstore.google.com/detail/user-agent-switcher-and-m/bhchdcejhohfmigjafbampogmaanbfkg"
><h2> ><h2 style="text-align: center;">
If you are really dead-set on using chromium to browse this website, If you are really dead-set on using chromium to browse this website,
you can use a user-agent switcher you can use a user-agent switcher
</h2></a </h2></a

View file

@ -1,6 +1,5 @@
--- ---
import Layout from "../layouts/Layout.astro"; import Layout from "../layouts/Layout.astro";
import Card from "../components/Card.astro";
--- ---
<Layout title="LimePot - Projects "> <Layout title="LimePot - Projects ">
@ -16,19 +15,14 @@ import Card from "../components/Card.astro";
<strong>Profiles/Portfolios</strong> <strong>Profiles/Portfolios</strong>
</p> </p>
</center> </center>
<ul role="list" class="link-card-grid"> <ul role="list">
<Card <!--
source="/assets/icons/Forgejo_logo.svg" https://avatars.githubusercontent.com/u/67560307?s=200&v=4
href="https://git.nullafati.xyz/LimePotato/" /assets/icons/Forgejo_logo.svg
title="Git" -->
alt="Forgejo Logo" <li><a href="https://modrinth.com/user/limepotato">Modrinth Profile</a></li>
/> <br>
<Card <li><a href="https://git.nullafati.xyz/LimePotato/">Git Forge</a></li>
source="https://avatars.githubusercontent.com/u/67560307?s=200&v=4"
href="https://modrinth.com/user/limepotato"
title="Modrinth Profile"
alt="Modrinth Logo"
/>
</ul> </ul>
<br /><br /> <br /><br />
<center> <center>
@ -36,58 +30,24 @@ import Card from "../components/Card.astro";
<br /> <br />
<p class="instructions"> <p class="instructions">
<strong>Individual Projects</strong> <strong>Individual Projects</strong>
</p></center </p></center>
> <ul role="list">
<ul role="list" class="link-card-grid"> <li><a href="https://modrinth.com/mod/roses-quilt">Roses Mod</a>: A Minecraft mod, built for Quilt Loader, bringing back the Roses and Cyan Roses of old.</li>
<Card <br>
source="https://ouroboros.gay/files/ecfdc63b-d5a0-47ad-8ec4-8892342ddbda" <li><a href="https://modrinth.com/project/yummy!">Yummy</a>: A Minecraft mod, all about food (WIP).</li>
href="https://ouroboros.group/" <br>
title="Ouroboros Group" <li><a href="https://modrinth.com/mod/edible-blocks">Edible Blocks</a>: A Minecraft mod, that lets you.... eat block items????</li>
body="A directory of everything I host." <br>
alt="Ouroboros Icon" <li><a href="https://limepot.xyz/blog/minecraft-badges/">Minecraft 88x31 Badges</a>: A handful of 88x31 badges for all your minecraft related projects!</li>
/> <br>
<Card <li><a href="https://git.nullafati.xyz/limepotato/potrogue">Potrogue</a>: A lil roguelike project built in Kotlin with cobalt/amethyst/zircon.</li>
source="https://git.nullafati.xyz/LimePotato/roses-mod/raw/branch/main/src/main/resources/assets/roses_mod/icon.png" <br>
href="https://modrinth.com/mod/roses-quilt" <li><a href="https://git.nullafati.xyz/limepotato/kotRemote">kotRemote</a>: SSHFS (and maybe other things later) Wrapper, in Kotlin with Jexer.</li>
title="Roses" <br>
body="A Minecraft mod, built for Quilt Loader, bringing back the Roses and Cyan Roses of old." <!--
alt="Two minecraft roses, one red one cyan" https://git.nullafati.xyz/LimePotato/roses-mod/raw/branch/main/src/main/resources/assets/roses_mod/icon.png
/> https://git.nullafati.xyz/limepotato/yummy/raw/branch/main/src/main/resources/assets/yummy/icon.png"
<Card /assets/icons/Forgejo_logo.svg-->
source="https://git.nullafati.xyz/limepotato/yummy/raw/branch/main/src/main/resources/assets/yummy/icon.png"
href="https://git.nullafati.xyz/limepotato/yummy"
title="Yummy"
body="A Minecraft mod, all about food (WIP)."
alt="Pixel art smiling yummy face"
/>
<Card
source="/assets/icons/Forgejo_logo.svg"
href="https://git.nullafati.xyz/limepotato/edibleBlocks"
title="Edible Blocks"
body="A Minecraft mod, that lets you.... eat block items????"
alt="ForgeJo Logo"
/>
<Card
source="/assets/icons/Forgejo_logo.svg"
href="https://git.nullafati.xyz/limepotato/mc-badges"
title="Minecraft Badges"
body="A handful of 88x31 badges for all your minecraft related projects!"
alt="ForgeJo Logo"
/>
<Card
source="/assets/icons/Forgejo_logo.svg"
href="https://git.nullafati.xyz/Ouroboros/potrogue/"
title="potrogue"
body="A lil roguelike project built in Kotlin with cobalt/amethyst/zircon"
alt="ForgeJo Logo"
/>
<Card
source="/assets/icons/Forgejo_logo.svg"
href="https://git.nullafati.xyz/limepotato/kotRemote"
title="kotRemote"
body="SSHFS (and maybe other things later) Wrapper, in Kotlin with Jexer"
alt="ForgeJo Logo"
/>
</ul> </ul>
</div> </div>
</main> </main>

33
src/pages/services.astro Normal file
View file

@ -0,0 +1,33 @@
---
import Layout from "../layouts/Layout.astro";
---
<Layout>
<main>
<div class="content">
<h2 class="title" style="text-align: center;">Services</h2>
<h3 class="subtitle" style="text-align: center;">Here is a list of services that I host, and can be used.</h3>
<h4 style="text-align: center;"><a href="https://up.ouroboros.group/status/obosgroup">Experiencing Downtimes?</a></h4>
<ul role="list">
<li>
<a href="https://git.nullafati.xyz/">ForgeJo</a>: Git forge, registrations are disabled
</li>
<li>
<a href="https://search.ouroboros.group/">SearXNG</a>: Search Engine
</li>
<li>
<a href="https://vid.ouroboros.group/">Invidious</a>: Youtube Frontend
</li>
<li>
<a href="https://translate.ouroboros.group/">LibreTranslate</a>: Translation Service
</li>
<li>
<a href="https://ntfy.ouroboros.group/">ntfy</a>: Push notification service
</li>
<li>
<a href="https://ouroboros.gay/">Iceshrimp</a>: Fediverse Instance
</li>
</ul>
</div>
</main>
</Layout>

View file

@ -1,8 +1,28 @@
--- ---
import Layout from "../layouts/Layout.astro"; import Layout from "../layouts/Layout.astro";
import Card from "../components/Card.astro";
--- ---
<Layout title="LimePot - "> <Layout>
<main></main> <main>
<div class="content">
<h2 class="title" style="text-align: center;">Site Information</h2>
<hr>
<h2 class="subtitle">Credits</h2>
<ul>
<li><s>Uh, God And My Country</s></li>
<li>All the cool creatures in my <b>Friendly Buttons</b> section</li>
</ul>
<hr>
<h2 class="subtitle">Privacy</h2>
<ul>
<li>I dont do shit with your data!</li>
</ul>
<hr>
<h2 class="subtitle">Frameworks n' Stuff</h2>
<ul>
<li>Build System: <a href="https://astro.build/">Astro</a></li>
<li>Color Scheme: <a href="https://catppuccin.com">Catppuccin Mocha Peach</a></li>
</ul>
</div>
</main>
</Layout> </Layout>