ada/werefox-cafe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Big refactoring with more components, added a variables file to save data.

Browse Source
This commit is contained in:
Alexis Werefox 2021-05-01 06:15:09 +00:00
parent fe1fe42d4e
commit a59bf8f88c
28 changed files with 985 additions and 878 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/info/components/basic-page-template.js → src/info/components/basic-page.js
View File

@ -2,8 +2,9 @@ import Head from "next/head";
import Image from "next/image";
import WCard from "../components/werefox-card";
import FCard from "./footer-card";
import PButton from "../components/page-button";
export default function HRT({ is_home, page_title, card_title, children }) {
export default function BasicPage({ is_home, page_title, card_title, children }) {
if (is_home) {
return (
<div className="min-h-screen bg-werefox-grey-lighter dark:bg-werefox-grey-dark font-nerd">
@ -55,25 +56,21 @@ export default function HRT({ is_home, page_title, card_title, children }) {
{card_title}
</h1>
</WCard>
<WCard
isCardButton="true"
extraClasses=""
imageObj={[
<PButton
title="Take me back home!"
images={[
{ src: "/emoji/pixel_alexis.png", alt: "Pixel Alexis!" },
{ src: "/emoji/blue_heart.svg", alt: "Blue heart" },
]}
innerText="Take me back home!"
url="/"
/>
{children}
<WCard
isCardButton="true"
extraClasses=""
imageObj={[
<PButton
title="Take me back home!"
images={[
{ src: "/emoji/pixel_alexis.png", alt: "Pixel Alexis!" },
{ src: "/emoji/blue_heart.svg", alt: "Blue heart" },
]}
innerText="Take me back home!"
url="/"
/>
<FCard />

18
src/info/components/faq-block.js Normal file
View File

@ -0,0 +1,18 @@
import FCard from "./faq-card";
import { FAQS } from "../js/variables";
export default function FAQBlock() {
return (
<>
{Object.keys(FAQS).map((faq) => (
<FCard
key={faq}
question={FAQS[faq].question}
answer={FAQS[faq].answer}
src={FAQS[faq].src}
alt={FAQS[faq].alt}
/>
))}
</>
);
}

43
src/info/components/faq-card.js Normal file
View File

@ -0,0 +1,43 @@
import Link from "next/link";
export default function TestimonialCard({ question, answer, src, alt }) {
const finalsrc = Boolean(src) ? src : "/images/logo.png";
return (
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
<div className="p-2 space-y-2">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-8 text-center text-lg sm:text-xl text-werefox-pink-dark dark:text-werefox-pink">
{question}
</p>
</div>
<div className="p-2 flex space-y-2 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<Link href="https://vulpine.club/@shadow8t4">
<a>
<div className="flex-1 pt-4 pb-4 pl-4">
<img
className="rounded-lg sm:w-32 w-16"
src={finalsrc}
alt={alt}
/>
</div>
</a>
</Link>{" "}
<div className="flex items-center justify-center animate-wiggle flex-5 p-4 sm:text-lg text-xs text-center min-h-full text-werefox-blue-dark dark:text-werefox-blue">
<p>
{answer}
<br />
{"- "}
<Link href="https://vulpine.club/@shadow8t4">
<a
target="_blank"
className="transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink"
>{`@shadow8t4`}</a>
</Link>
</p>
</div>
</div>
</div>
</div>
);
}

15
src/info/components/footer-card.js
View File

@ -3,20 +3,26 @@ import WCard from "./werefox-card";
export default function FooterCard() {
return (
<WCard>
<footer className="p-4 space-y-2">
<footer className="p-4 space-y-2 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
<div className="flex text-werefox-blue-darker dark:text-werefox-blue">
<div className="flex-1 sm:pr-16 pr-4">
<p className="text-right sm:text-md text-sm transition">
<Link href="/contacts">
<a className="hover:text-werefox-pink-dark dark:hover:text-werefox-pink">Contact</a>
<a className="hover:text-werefox-pink-dark dark:hover:text-werefox-pink">
Contact
</a>
</Link>
</p>
</div>
<div className="flex-1 sm:pl-16 pl-4">
<p className="text-left sm:text-md text-sm transition">
<Link href="https://gitea.werefox.dev/shadow8t4/info-werefox-dev">
<a className="hover:text-werefox-pink-dark dark:hover:text-werefox-pink" target="_blank"> /src</a>
<a
className="hover:text-werefox-pink-dark dark:hover:text-werefox-pink"
target="_blank"
>
/src
</a>
</Link>
</p>
</div>
@ -37,6 +43,5 @@ export default function FooterCard() {
</Link>
</p>
</footer>
</WCard>
);
}

18
src/info/components/identity-block.js Normal file
View File

@ -0,0 +1,18 @@
import IDButton from "./identity-button";
import { IDENTITIES } from "../js/variables";
export default function IdentityBlock() {
return (
<div className="grid xl:grid-rows-2 xl:grid-cols-5 sm:grid-rows-3 sm:grid-cols-3 grid-rows-9 grid-cols-1 sm:gap-2 gap-0">
{Object.keys(IDENTITIES).map((ids) => (
<IDButton
key={ids}
innerText={ids}
url={IDENTITIES[ids].url}
imageObj={IDENTITIES[ids].images}
extraClasses={IDENTITIES[ids].extra_classes}
/>
))}
</div>
);
}

42
src/info/components/identity-card.js
View File

@ -13,6 +13,7 @@ export default function IdentityCard({
}) {
if (children) {
return (
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
<div className="p-2 flow space-y-3">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<h4 className="p-4 text-center text-lg sm:text-2xl text-werefox-grey-dark dark:text-werefox-grey-lighter">
@ -24,9 +25,11 @@ export default function IdentityCard({
</div>
{children}
</div>
</div>
);
} else if (src2) {
return (
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
<div className="p-2 flow space-y-3">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<h4 className="p-4 text-center text-lg sm:text-2xl text-werefox-grey-dark dark:text-werefox-grey-lighter">
@ -37,11 +40,9 @@ export default function IdentityCard({
</h4>
</div>
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
<p className="p-4 flow space-y-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
{Object.keys(info).map((i) => (
<p className="pb-4" key={i}>
{info[i]}
</p>
<p key={i}>{info[i]}</p>
))}
</p>
</div>
@ -60,9 +61,11 @@ export default function IdentityCard({
</a>
</div>
</div>
</div>
);
} else {
} else if (url) {
return (
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
<div className="p-2 flow space-y-3">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-4 text-center text-lg sm:text-2xl text-werefox-grey-dark dark:text-werefox-grey-lighter">
@ -73,11 +76,9 @@ export default function IdentityCard({
</p>
</div>
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
<p className="p-4 flow space-y-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
{Object.keys(info).map((i) => (
<p className="pb-4" key={i}>
{info[i]}
</p>
<p key={i}>{info[i]}</p>
))}
</p>
<div className="pb-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
@ -92,6 +93,29 @@ export default function IdentityCard({
</div>
</div>
</div>
</div>
);
} else {
return (
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
<div className="p-2 flow space-y-3">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<h4 className="p-4 text-center text-lg sm:text-2xl text-werefox-grey-dark dark:text-werefox-grey-lighter">
<span className="relative inline-block w-8 h-8 align-middle mb-1">
<Image src={src} layout="fill" objectFit="contain" alt={alt} />
</span>{" "}
{title}
</h4>
</div>
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-4 flow space-y-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
{Object.keys(info).map((i) => (
<p key={i}>{info[i]}</p>
))}
</p>
</div>
</div>
</div>
);
}
}

17
src/info/components/page-block.js Normal file
View File

@ -0,0 +1,17 @@
import PButton from "./page-button";
import { PAGES } from "../js/variables";
export default function ProjectBlock() {
return (
<>
{Object.keys(PAGES).map((page) => (
<PButton
key={page}
title={page}
images={PAGES[page].images}
url={PAGES[page].url}
/>
))}
</>
);
}

29
src/info/components/page-button.js Normal file
View File

@ -0,0 +1,29 @@
import Link from "next/link";
import Image from "next/image";
export default function PageButton({ title, images, url, extra_classes }) {
return (
<div className="">
<Link href={url}>
<a
className={`${extra_classes} sm:p-2 p-1 w-full inline-block ring-2 ring-werefox-grey-darker dark:ring-werefox-grey-light rounded-lg text-lg text-center text-werefox-grey-lighter dark:text-werefox-grey-dark bg-werefox-grey dark:bg-werefox-grey-lightest transition hover:bg-werefox-grey-dark dark:hover:bg-werefox-grey-light`}
>
{images.map((source) => (
<span
key={source}
className="animate-jiggle sm:w-6 sm:h-6 w-4 h-6 inline-block align-top"
>
<Image
src={source.src}
layout="fill"
objectFit="contain"
alt={source.alt}
/>
</span>
))}{" "}
{title}
</a>
</Link>
</div>
);
}

4
src/info/components/project-block.js
View File

@ -1,6 +1,6 @@
import PCard from "./project-card";
export default function ProjectBlock({ title, cards }) {
export default function ProjectCardBlock({ title, cards }) {
return (
<div className="p-2 flow space-y-3 w-full">
<div className="p-2 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker w-full bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
@ -13,7 +13,7 @@ export default function ProjectBlock({ title, cards }) {
{Object.keys(cards).map((card) => (
<PCard
key={card}
title={cards[card].title}
title={card}
url={cards[card].url}
src={cards[card].src}
alt={cards[card].alt}

16
src/info/components/project-card.js
View File

@ -1,14 +1,26 @@
import Link from "next/link";
import Image from "next/image";
export default function projectCard({ title, url, src, alt, description }) {
export default function projectCard({
title,
url,
new_tab,
src,
alt,
description,
}) {
const open_new_tab = new_tab ? "_blank" : "";
return (
<li className="p2 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker w-full bg-werefox-grey-light dark:bg-werefox-grey">
<div className="p-2 flow space-y-2 w-full">
<div className="p-3 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker w-full bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<div className="text-lg text-center text-werefox-blue-dark dark:text-werefox-blue">
<Link href={url}>
<a target="_blank" className="transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink">
<a
target={open_new_tab}
className="transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink"
>
<span className="animate-jiggle sm:w-6 sm:h-6 w-4 h-6 inline-block align-top">
<Image
src={src}

2
src/info/components/testimonial-card.js
View File

@ -32,10 +32,12 @@ export default function TestimonialCard({ src, alt, url, innerText, user }) {
{innerText}
<br />
{"- "}
<Link href={url}>
<a
target="_blank"
className={`transition ${isMeLink}`}
>{`@${user}`}</a>
</Link>
</p>
</div>
</div>

45
src/info/components/werefox-card.js
View File

@ -1,51 +1,28 @@
import Image from "next/image";
import Link from "next/link";
export default function WerefoxCard({
isTitle,
isCardButton,
extraClasses,
imageObj,
innerText,
url,
children,
}) {
const images = Array(imageObj).flat();
if (isTitle) {
return (
<header className="rounded-lg ring-4 ring-werefox-blue bg-werefox-grey-light dark:bg-werefox-grey">
{children}
</header>
);
} else if (isCardButton) {
return (
<div className="">
<Link href={url}>
<a
className={`${extraClasses} sm:p-2 p-1 w-full inline-block ring-2 ring-werefox-grey-darker dark:ring-werefox-grey-light rounded-lg text-lg text-center text-werefox-grey-lighter dark:text-werefox-grey-dark bg-werefox-grey dark:bg-werefox-grey-lightest transition hover:bg-werefox-grey-dark dark:hover:bg-werefox-grey-light`}
>
{images.map((source) => (
<span
key={source.src}
className="animate-jiggle sm:w-6 sm:h-6 w-4 h-6 inline-block align-top"
>
<Image
src={source.src}
layout="fill"
objectFit="contain"
alt={source.alt}
/>
</span>
))}{" "}
{innerText}
</a>
</Link>
</div>
);
}
} else {
return (
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
<div className="p-2 space-y-2">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-2 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
{innerText}
</p>
</div>
<div className="p-2 flow space-y-2 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
{children}
</div>
</div>
</div>
);
}
}

353
src/info/js/variables.js Normal file
View File

@ -0,0 +1,353 @@
// An object listing my different identity aspects
export const IDENTITIES = {
26: {
url: "",
images: [
{
src: "/emoji/18_plus.svg",
alt: "Over 18 emoji",
},
],
extra_classes: "pointer-events-none",
},
"Trans-femme": {
url: "/identities/gender",
images: [
{
src: "/emoji/transgender_flag.svg",
alt: "Transgender flag emoji",
},
{
src: "/emoji/female_symbol.svg",
alt: "Female symbol emoji",
},
],
extra_classes: "xl:pt-1 xl:align-text-bottom xl:text-sm xl:min-h-full",
},
"She/her": {
url: "/identities/pronouns",
images: [
{
src: "/emoji/speech_bubble_left.svg",
alt: "A speech bubble emoji",
},
],
extra_classes: "",
},
Polyam: {
url: "/identities/sexuality",
images: [
{
src: "/emoji/polyamory_flag.svg",
alt: "Polyamory flag emoji",
},
],
extra_classes: "",
},
Pansexual: {
url: "/identities/sexuality",
images: [
{
src: "/emoji/pansexual_flag.svg",
alt: "Pansexual flag emoji",
},
],
extra_classes: "",
},
Lesbian: {
url: "/identities/sexuality",
images: [
{
src: "/emoji/lesbian_flag.svg",
alt: "Lesbian flag emoji",
},
],
extra_classes: "",
},
Single: {
url: "/identities/partners",
images: [
{
src: "/emoji/blue_heart.svg",
alt: "Blue heart emoji",
},
],
extra_classes: "",
},
ADHD: {
url: "/identities/neuro",
images: [
{
src: "/emoji/neurodiversity.svg",
alt: "Neurodiversity symbol emoji",
},
],
extra_classes: "",
},
"Fox witch": {
url: "/identities/fursona",
images: [
{
src: "/emoji/fox.svg",
alt: "Fox emoji",
},
{
src: "/emoji/magic_wand.svg",
alt: "Magic wand emoji",
},
],
extra_classes: "xl:pt-1 xl:align-text-bottom xl:text-sm xl:min-h-full",
},
};
// An object listing pages folks can visit
export const PAGES = {
"Stuff I do!": {
url: "/projects",
images: [
{
src: "/emoji/crt_prompt.svg",
alt: "CRT prompt emoji",
},
],
},
"See Testimonials!": {
url: "/testimonials",
images: [{ src: "/emoji/awoo.svg", alt: "Awoo emoji" }],
},
"HRT Tracker!": {
url: "/hrt",
images: [
{
src: "/emoji/trans_heart.png",
alt: "Transgender heart emoji",
},
],
},
FAQ: {
url: "/faq",
images: [
{
src: "/emoji/red_question_mark.svg",
alt: "Red question mark emoji",
},
],
},
"Support Me?": {
url: "/support",
images: [
{
src: "/emoji/green_money.svg",
alt: "Green money emoji",
},
],
},
};
// Use this to list out partners on the partners page. >w>
export const PARTNERS = {
// parnter: {
// url: "",
// avi: "",
// fields: {
// "": "",
// },
// bio: ``,
// },
};
// This is where you put the testimonial users' info
export const TESTIMONIALS = {
colabunny: {
json: "https://yiff.life/@colabunny.json",
url: "https://yiff.life/@colabunny",
content: '"please stay your jokes are funny and smart"',
},
ElfLord: {
url: "https://freedom.horse/@ElfLord",
json: "https://freedom.horse/@ElfLord.json",
content: `"Someday I'm gonna visit you in Texas, and when I get there, I'm going to realize you don't live in Texas at all, and I'm in the wrong state"`,
},
Decimal: {
url: "https://plush.city/@Decimal",
json: "https://plush.city/@Decimal.json",
content: `"I will appreciate the heck out of you any day"`,
},
skelly: {
url: "https://redroo.ml/@skelly",
json: "https://redroo.ml/@skelly.json",
content: `"this an an official invitation for any one of you to put 'fuck you i dont give testimonials' as a testimonial by me on your profile"`,
},
Drako_Fenris: {
url: "https://yiff.life/@Drako_Fenris",
json: "https://yiff.life/@Drako_Fenris.json",
content: `"[Alexis' future wife] lives in the ether yet to be revealed. she awaits the day her big tiddie goth gf rides in on her unicorn and rescues her."`,
},
"00dani": {
url: "https://vulpine.club/@00dani",
json: "https://vulpine.club/@00dani.json",
content: `"*falls in love with you* haha whoopsies 😳"`,
},
Gumby: {
url: "https://puppy.cafe/@Gumby",
json: "https://puppy.cafe/@Gumby.json",
content: `"im love alexis a lot 💚 🐀"`,
},
AshBunny: {
url: "https://vulpine.club/@AshBunny",
json: "https://vulpine.club/@AshBunny.json",
content: `"heck. I don't think I can take all of this support."`,
},
heatherhorns: {
url: "https://plush.city/@heatherhorns",
json: "https://plush.city/@heatherhorns.json",
content: `";~;
gpsd gosh"`,
},
MutoShack: {
url: "https://functional.cafe/@MutoShack",
json: "https://functional.cafe/@MutoShack.json",
content: `"yess w'all say nice things! usually "alexis is the good" and "alexis is the gay"
because it is the truth"`,
},
immychan: {
url: "https://antabaka.me/@immychan",
json: "https://antabaka.me/@immychan.json",
content: `"Oh damn you're cute 😳"`,
},
nautilee: {
url: "https://dragon.style/@nautilee",
json: "https://dragon.style/@nautilee.json",
content: `"...how are you so goshdarn cute"`,
},
lindsays: {
url: "https://hackers.town/@lindsays",
json: "https://hackers.town/@lindsays.json",
content: `"Regarding @shadow8t4 : She's an amazing, sweet, beautiful dork, and a spectacular best friend. also, a butt."`,
},
};
// This is where I put the questions and answers for the FAQ
export const FAQS = {
q1: {
question: `"So is Werefox like a species or...?"`,
answer: `That's a good question! No, my fursona's full name is Alexis Werefox,
so Werefox is just a last name. I am just a fox!`,
src: "/images/alexis_heart.png",
alt: "Alexis giving a heart emoji",
},
q2: {
question: `"How can you be Pansexual and a Lesbian?"`,
answer: `I believe I've been told the proper term is "sapphic",
it just means I *am* Pansexual, but I prefer those who identify more femme.`,
src: "/images/alexis_wink.png",
alt: "Alexis winking and giving a peace sign",
},
q3: {
question: `"How do I get more Xenia stickers?"`,
answer: `Yeah, about that. So, I've made a few posts aobut this, but when
I first started giving those out, I was in a good financial position, among
other things. Now I'm not! I will get to it when I do.`,
src: "/images/alexis_annoyed.png",
alt: "Alexis looking annoyed and crossing her arms",
},
q4: {
question: `"What do you do?"`,
answer: `Something! I mainly focus on maintaining the services I run at the
moment, Beat Saber streaming, myself and my transition. I could use some
financial support, if you're feeling up to it and can afford it!`,
src: "/images/alexis_shrug.png",
alt: "Alexis shrugging",
},
};
// An object listing the different stuff I do
export const PROJECTS = {
Services: {
url: "/projects/services",
src: "/emoji/crt_blue_screen.svg",
alt: "A CRT blue screen emoji",
description: `Here is a list of some of the services I host.
Some of them, because a few I keep to just myself.`,
},
Poetry: {
url: "https://write.as/a-letter-to-the-void",
new_tab: true,
src: "/emoji/pen.svg",
alt: "Pen emoji",
description: `Sometimes, I write poetry. It's not the happiest
always, but I am proud of it. It would mean a lot if you took
a look!`,
},
};
// An object listing the services I host
export const SERVICES = {
Mastodon: {
url: "https://masto.werefox.dev/about/",
new_tab: true,
src: "/emoji/mastodon-logo.png",
alt: "The Mastodon logo",
description: `Mastodon is an online, self-hosted social media, and social networking service.
It allows anyone to host their own server node in the network, and its various separately
operated user bases are federated across many different servers.`,
},
Pinafore: {
url: "https://pina.werefox.dev/",
new_tab: true,
src: "/emoji/pinafore_logo.svg",
alt: "The Pinafore logo",
description: `An alternative web client for Mastodon, focused on speed and simplicity.`,
},
Halcyon: {
url: "https://halcyon.werefox.dev/",
new_tab: true,
src: "/emoji/halcyon_logo.png",
alt: "The Halcyon logo",
description: `Halcyon is standard Twitter like client of Mastodon, And you can use it just
by login to your instance. Let's Toot like a tweet.`,
},
Brutaldon: {
url: "https://brutal.werefox.dev/",
new_tab: true,
src: "/emoji/brutaldon_logo.png",
alt: "The Brutaldon logo",
description: `Brutaldon is a brutalist, Web 1.0 web interface for Mastodon and Pleroma.`,
},
PeerTube: {
url: "https://vid.werefox.dev/",
new_tab: true,
src: "/emoji/peertube_logo.svg",
alt: "The PeerTube logo",
description: `PeerTube is a free and open-source, decentralized, federated video platform
powered by ActivityPub and WebTorrent, that uses peer-to-peer technology to reduce load on
individual servers when viewing videos.`,
},
Element: {
url: "https://elem.werefox.dev/",
new_tab: true,
src: "/emoji/element_logo.svg",
alt: "The Element logo",
description: `Element (previously Riot) is an all-in-one secure chat app for teams,
friends and organisations. Keeps conversations in your control, safe from data-mining
and ads. Talk to everyone through the open global Matrix network, protected by proper
end-to-end encryption. (additionally, I host a Matrix server at matrix.werefox.dev)`,
},
Gitea: {
url: "https://gitea.werefox.dev/",
new_tab: true,
src: "/emoji/gitea_logo.svg",
alt: "The Gitea logo",
description: `A painless self-hosted Git service. Gitea is a community managed
lightweight code hosting solution written in Go. It is published under the MIT license.`,
},
};

27
src/info/pages/contacts/index.js
View File

@ -1,4 +1,4 @@
import BasicPage from "../../components/basic-page-template";
import BasicPage from "../../components/basic-page";
import WCard from "../../components/werefox-card";
import Image from "next/image";
@ -8,15 +8,9 @@ export default function Contacts() {
page_title="Where To Find Me"
card_title={`"Do you have a [Social Media]?"`}
>
<WCard>
<div className="p-2 space-y-2">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-2 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
You can find me in quite a few places!
</p>
</div>
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-4 md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<WCard innerText="You can find me in quite a few places!">
<div className="p-4 space-y-4">
<p className="md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<a href="https://vulpine.club/@shadow8t4" target="_blank">
<span className="animate-bounce relative inline-block w-6 h-6 align-middle">
<Image
@ -36,7 +30,7 @@ export default function Contacts() {
@shadow8t4@vulpine.club
</a>
</p>
<p className="pl-4 pr-4 pb-4 md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<p className="md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<a href="https://twitter.com/alexis_werefox" target="_blank">
<span className="animate-bounce relative inline-block w-6 h-6 align-middle">
<Image
@ -56,7 +50,7 @@ export default function Contacts() {
@alexis_werefox
</a>
</p>
<p className="pl-4 pr-4 pb-4 md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<p className="md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<a href="https://www.twitch.tv/alexis_werefox" target="_blank">
<span className="animate-bounce relative inline-block w-6 h-6 align-middle">
<Image
@ -76,7 +70,7 @@ export default function Contacts() {
@Alexis_Werefox
</a>
</p>
<p className="pl-4 pr-4 pb-4 md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<p className="md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<a
href="https://vid.werefox.dev/accounts/shadow8t4/video-channels"
target="_blank"
@ -99,7 +93,7 @@ export default function Contacts() {
vid.werefox.dev
</a>
</p>
<p className="pl-4 pr-4 pb-4 md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<p className="md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<a href="https://write.as/a-letter-to-the-void" target="_blank">
<span className="animate-bounce relative inline-block w-6 h-6 align-middle">
<Image
@ -119,7 +113,7 @@ export default function Contacts() {
write.as/a-letter-to-the-void
</a>
</p>
<p className="pl-4 pr-4 pb-4 md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<p className="md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<a href="https://werefox.dev" target="_blank">
<span className="animate-bounce relative inline-block w-6 h-6 align-middle">
<Image
@ -139,7 +133,7 @@ export default function Contacts() {
werefox.dev
</a>
</p>
<p className="pl-4 pr-4 pb-4 md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<p className="md:text-lg sm:text-md text-xs text-center text-werefox-blue-dark dark:text-werefox-blue">
<a href="mailto:adh9694@gmail.com" target="">
<span className="animate-bounce relative inline-block w-6 h-6 align-middle">
<Image
@ -160,7 +154,6 @@ export default function Contacts() {
</a>
</p>
</div>
</div>
</WCard>
</BasicPage>
);

58
src/info/pages/faq/index.js
View File

@ -1,62 +1,10 @@
import BasicPage from "../../components/basic-page-template";
import WCard from "../../components/werefox-card";
import TCard from "../../components/testimonial-card";
import BasicPage from "../../components/basic-page";
import FBlock from "../../components/faq-block";
export default function FAQ() {
return (
<BasicPage page_title="FAQ" card_title="Frequently Asked Questions!">
<WCard>
<p className="p-6 text-lg text-center text-werefox-pink-dark dark:text-werefox-pink">
"So is Werefox like a species or...?"
</p>
</WCard>
<TCard
key=""
src="/images/alexis_heart.png"
alt="Alexis"
url="https://vulpine.club/@shadow8t4"
user="Shadow8t4"
innerText="That's a good question! No, my fursona's full name is Alexis Werefox, so Werefox is just a last name. I am just a fox!"
/>
<WCard>
<p className="p-6 text-lg text-center text-werefox-pink-dark dark:text-werefox-pink">
"How can you be Pansexual and a Lesbian?"
</p>
</WCard>
<TCard
key=""
src="/images/alexis_wink.png"
alt="Alexis"
url="https://vulpine.club/@shadow8t4"
user="Shadow8t4"
innerText={`I believe I've been told the proper term is "sapphic", it just means I *am* Pansexual, but I prefer those who identify more femme.`}
/>
<WCard>
<p className="p-6 text-lg text-center text-werefox-pink-dark dark:text-werefox-pink">
"How do I get more Xenia stickers?"
</p>
</WCard>
<TCard
key=""
src="/images/alexis_annoyed.png"
alt="Alexis"
url="https://vulpine.club/@shadow8t4"
user="Shadow8t4"
innerText={`Yeah, about that. So, I've made a few posts aobut this, but when I first started giving those out, I was in a good financial position, among other things. Now I'm not! I will get to it when I do.`}
/>
<WCard>
<p className="p-6 text-lg text-center text-werefox-pink-dark dark:text-werefox-pink">
"What do you do?"
</p>
</WCard>
<TCard
key=""
src="/images/alexis_shrug.png"
alt="Alexis"
url="https://vulpine.club/@shadow8t4"
user="Shadow8t4"
innerText="Something! I mainly focus on maintaining the services I run at the moment, Beat Saber streaming, myself and my transition. I could use some financial support, if you're feeling up to it and can afford it!"
/>
<FBlock />
</BasicPage>
);
}

15
src/info/pages/hrt/index.js
View File

@ -1,4 +1,4 @@
import BasicPage from "../../components/basic-page-template";
import BasicPage from "../../components/basic-page";
import WCard from "../../components/werefox-card";
import { useEffect, useState } from "react";
@ -45,20 +45,13 @@ export default function HRT({ startTimes }) {
page_title="Alexis Werefox HRT Tracker"
card_title="Track my HRT progress!"
>
<WCard>
<div className="p-4">
<p className="pt-6 text-lg md:text-2xl text-center text-werefox-blue-dark dark:text-werefox-blue">
I'm so glad you're interested!!
</p>
<p className="text-lg md:text-2xl text-center text-werefox-blue-dark dark:text-werefox-blue">
I've been on HRT for:
</p>
<div className="pb-6 text-lg md:text-2xl text-center text-werefox-blue-dark dark:text-werefox-blue grid grid-cols-1 grid-rows-4">
<WCard innerText={`I'm so glad you're interested!!`}>
<div className="p-2 sm:text-xl text-lg text-center text-werefox-blue-dark dark:text-werefox-blue grid grid-cols-1 grid-rows-4 gap-2">
<p>I've been on HRT for:</p>
{Object.keys(timesArray).map((t) => (
<p key={t}>{timesArray[t]}</p>
))}
</div>
</div>
</WCard>
</BasicPage>
);

8
src/info/pages/identities/fursona/index.js
View File

@ -1,11 +1,9 @@
import BasicPage from "../../../components/basic-page-template";
import WCard from "../../../components/werefox-card";
import BasicPage from "../../../components/basic-page";
import IDCard from "../../../components/identity-card";
export default function Fursona() {
return (
<BasicPage page_title="OwO What's this?" card_title="Fursona Details!">
<WCard>
<IDCard
title="Alexis Werefox"
info={{
@ -14,15 +12,13 @@ export default function Fursona() {
species: `I'm a fox, though! I think originally based on a fennec, but I've kinda moved away from that design nowadays.`,
magic: `Also, I'm a witch! I have magic powers, which have honestly been mostly used to indulge in kinks, but uhhhhhh... What were we talking about here again?`,
art: `I know! I know! You came here to see some art, yes?! Well, here's a free one for ya!~`,
source: `(this was done by the wonderful @ribbonfemale on Twitter!)`
source: `(this was done by the wonderful @ribbonfemale on Twitter!)`,
}}
url=""
src="/emoji/pixel_alexis.png"
alt="It's me! Alexis Werefox!"
src2="/images/alexis_witch.jpg"
alt2="Some art of Alexis Werefox in a black corset and miniskirt and pink/black striped leggings and a witch hat, with magic effects surrounding her."
/>
</WCard>
</BasicPage>
);
}

5
src/info/pages/identities/gender/index.js
View File

@ -1,11 +1,9 @@
import BasicPage from "../../../components/basic-page-template";
import WCard from "../../../components/werefox-card";
import BasicPage from "../../../components/basic-page";
import IDCard from "../../../components/identity-card";
export default function Gender() {
return (
<BasicPage page_title="What's Gender?" card_title="I'm Transgender!">
<WCard>
<IDCard
title="Trans-femme"
info={{
@ -16,7 +14,6 @@ export default function Gender() {
src="/emoji/transgender_flag.svg"
alt="The transgender flag"
/>
</WCard>
</BasicPage>
);
}

5
src/info/pages/identities/neuro/index.js
View File

@ -1,5 +1,4 @@
import BasicPage from "../../../components/basic-page-template";
import WCard from "../../../components/werefox-card";
import BasicPage from "../../../components/basic-page";
import IDCard from "../../../components/identity-card";
export default function Neurodiversity() {
@ -8,7 +7,6 @@ export default function Neurodiversity() {
page_title="Neurodiversity, Fam"
card_title="I'm Neurodivergent!"
>
<WCard>
<IDCard
title="ADHD"
info={{
@ -28,7 +26,6 @@ export default function Neurodiversity() {
src="/emoji/neurodiversity.svg"
alt="The neurodiversity symbol"
/>
</WCard>
</BasicPage>
);
}

35
src/info/pages/identities/partners/index.js
View File

@ -1,26 +1,12 @@
import BasicPage from "../../../components/basic-page-template";
import BasicPage from "../../../components/basic-page";
import IDCard from "../../../components/identity-card";
import LCard from "../../../components/love-card";
import WCard from "../../../components/werefox-card";
// Use this to list out partner info on this page. >w>
const PARTNERS = {
// parnter: {
// url: "",
// avi: "",
// fields: {
// "": "",
// },
// bio: ``,
// },
};
import { PARTNERS } from "../../../js/variables";
export default function Partners() {
if (Object.keys(PARTNERS).length) {
return (
<BasicPage page_title="Partners" card_title="Partners!">
<WCard>
<IDCard
title="My loves!"
src="/emoji/blue_heart.svg"
@ -38,27 +24,20 @@ export default function Partners() {
></LCard>
))}
</IDCard>
</WCard>
</BasicPage>
);
} else {
return (
<BasicPage page_title="Partners" card_title="Partners!">
<WCard>
<IDCard
title="My loves!"
src="/emoji/blue_heart.svg"
alt="Blue heart emoji"
>
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-6 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue">
Oh! It looks like I don't have any partners at the moment.
<br />
Oh well!
</p>
</div>
</IDCard>
</WCard>
info={{
info: `Oh! It looks like I don't have any partners at the moment.`,
more: `Oh well!`,
}}
></IDCard>
</BasicPage>
);
}

5
src/info/pages/identities/pronouns/index.js
View File

@ -1,5 +1,4 @@
import BasicPage from "../../../components/basic-page-template";
import WCard from "../../../components/werefox-card";
import BasicPage from "../../../components/basic-page";
import IDCard from "../../../components/identity-card";
export default function Pronouns() {
@ -8,7 +7,6 @@ export default function Pronouns() {
page_title="What are your pronouns?"
card_title="Pronouns! Important!"
>
<WCard>
<IDCard
title="She / Her"
info={{
@ -20,7 +18,6 @@ export default function Pronouns() {
src="/emoji/speech_bubble_left.svg"
alt="A speech bubble emoji"
/>
</WCard>
</BasicPage>
);
}

5
src/info/pages/identities/sexuality/index.js
View File

@ -1,5 +1,4 @@
import BasicPage from "../../../components/basic-page-template";
import WCard from "../../../components/werefox-card";
import BasicPage from "../../../components/basic-page";
import IDCard from "../../../components/identity-card";
export default function Sexuality() {
@ -8,7 +7,6 @@ export default function Sexuality() {
page_title="What's My Sexuality?"
card_title="Sexuality Details!"
>
<WCard>
<IDCard
title="Polyamory"
info={{
@ -39,7 +37,6 @@ export default function Sexuality() {
src="/emoji/lesbian_flag.svg"
alt="The lesbian flag"
/>
</WCard>
</BasicPage>
);
}

187
src/info/pages/index.js
View File

@ -1,6 +1,7 @@
import BasicPage from "../components/basic-page-template";
import IDButton from "../components/identity-button";
import BasicPage from "../components/basic-page";
import IDBlock from "../components/identity-block";
import WCard from "../components/werefox-card";
import PBlock from "../components/page-block";
export default function Home() {
return (
@ -9,192 +10,28 @@ export default function Home() {
page_title="About A Werefox"
card_title="Hi! I'm Alexis Werefox!"
>
<WCard>
<div className="p-2 space-y-2">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-2 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
<p>Basic Info</p>
</p>
</div>
<div className="grid xl:grid-rows-2 xl:grid-cols-5 sm:grid-rows-3 sm:grid-cols-3 grid-rows-9 grid-cols-1 sm:gap-2 gap-0">
<IDButton
extraClasses="pointer-events-none"
imageObj={{ src: "/emoji/18_plus.svg", alt: "Over 18" }}
innerText="26"
url=""
/>
<IDButton
extraClasses="xl:pt-1 xl:align-text-bottom xl:text-sm xl:min-h-full"
imageObj={[
{
src: "/emoji/transgender_flag.svg",
alt: "Transgender flag",
},
{
src: "/emoji/female_symbol.svg",
alt: "Female symbol",
},
]}
innerText="Trans-femme"
url="/identities/gender"
/>
<IDButton
extraClasses=""
imageObj={{
src: "/emoji/speech_bubble_left.svg",
alt: "",
}}
innerText="She/her"
url="/identities/pronouns"
/>
<IDButton
extraClasses=""
imageObj={{
src: "/emoji/polyamory_flag.svg",
alt: "Polyamory flag",
}}
innerText="Polyam"
url="/identities/sexuality"
/>
<IDButton
extraClasses=""
imageObj={{
src: "/emoji/pansexual_flag.svg",
alt: "Pansexual flag",
}}
innerText="Pansexual"
url="/identities/sexuality"
/>
<IDButton
extraClasses=""
imageObj={{
src: "/emoji/lesbian_flag.svg",
alt: "Lesbian flag",
}}
innerText="Lesbian"
url="/identities/sexuality"
/>
<IDButton
extraClasses=""
imageObj={{
src: "/emoji/blue_heart.svg",
alt: "Blue heart",
}}
innerText="Single"
url="/identities/partners"
/>
<IDButton
extraClasses=""
imageObj={{
src: "/emoji/neurodiversity.svg",
alt: "Neurodiversity symbol",
}}
innerText="ADHD"
url="/identities/neuro"
/>
<IDButton
extraClasses="xl:pt-1 xl:align-text-bottom xl:text-sm xl:min-h-full"
imageObj={[
{
src: "/emoji/fox.svg",
alt: "Fox",
},
{
src: "/emoji/magic_wand.svg",
alt: "Magic wand",
},
]}
innerText="Fox witch"
url="/identities/fursona"
/>
</div>
</div>
<WCard innerText="Basic Info">
<IDBlock />
</WCard>
<WCard>
<div className="p-2 space-y-2">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-2 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
<p>Welcome to my little info site!</p>
</p>
</div>
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<WCard innerText="Welcome to my little info site!">
<p className="p-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue">
I'd describe myself as somewhere between a hot date and a hot
mess. Just a witchy foxxo programmer trying to make it in the
world tbh.
I'd describe myself as somewhere between a hot date and a hot mess.
Just a witchy foxxo programmer trying to make it in the world tbh.
</p>
<p className="pl-4 pr-4 pb-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue">
Feel free to click/tap any of the cute buttons above this to learn
more about my different aspects of personality.
</p>
<p className="pl-4 pr-4 pb-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue">
Down below, I've got some more neat little pages and useful info
you can look at.
Down below, I've got some more neat little pages and useful info you
can look at.
</p>
<p className="pl-4 pr-4 pb-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue">
Please do look around and enjoy your stay!~ 💙
</p>
</div>
</div>
</WCard>
<WCard>
<div className="p-2 space-y-3">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p className="p-2 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
Neat Pages!
</p>
</div>
<WCard
isCardButton="true"
extraClasses=""
imageObj={{
src: "/emoji/crt_prompt.svg",
alt: "CRT prompt emoji",
}}
innerText="Stuff I do!"
url="/projects"
/>
<WCard
isCardButton="true"
extraClasses=""
imageObj={{
src: "/emoji/awoo.svg",
alt: "Awoo emoji",
}}
innerText="See Testimonials!"
url="/testimonials"
/>
<WCard
isCardButton="true"
extraClasses=""
imageObj={{
src: "/emoji/trans_heart.png",
alt: "Transgender heart",
}}
innerText="HRT Tracker!"
url="/hrt"
/>
<WCard
isCardButton="true"
extraClasses=""
imageObj={{
src: "/emoji/red_question_mark.svg",
alt: "Question mark emoji",
}}
innerText="FAQ"
url="/faq"
/>
<WCard
isCardButton="true"
extraClasses=""
imageObj={{
src: "/emoji/green_money.svg",
alt: "Support",
}}
innerText="Support Me?"
url="/support"
/>
</div>
<WCard innerText="Neat Pages!">
<PBlock />
</WCard>
</BasicPage>
);

75
src/info/pages/projects/index.js
View File

@ -1,74 +1,13 @@
import BasicPage from "../../components/basic-page-template";
import WCard from "../../components/werefox-card";
import BasicPage from "../../components/basic-page";
import PBlock from "../../components/project-block";
import { PROJECTS } from "../../js/variables";
const CARDS = {
mastodon: {
title: "Mastodon",
url: "https://masto.werefox.dev/about/",
src: "/emoji/mastodon-logo.png",
alt: "The Mastodon logo",
description: `Mastodon is an online, self-hosted social media, and social networking service.
It allows anyone to host their own server node in the network, and its various separately
operated user bases are federated across many different servers.`,
},
pinafore: {
title: "Pinafore",
url: "https://pina.werefox.dev/",
src: "/emoji/pinafore_logo.svg",
alt: "The Pinafore logo",
description: `An alternative web client for Mastodon, focused on speed and simplicity.`,
},
halcyon: {
title: "Halcyon",
url: "https://halcyon.werefox.dev/",
src: "/emoji/halcyon_logo.png",
alt: "The Halcyon logo",
description: `Halcyon is standard Twitter like client of Mastodon, And you can use it just
by login to your instance. Let's Toot like a tweet.`,
},
brutaldon: {
title: "Brutaldon",
url: "https://brutal.werefox.dev/",
src: "/emoji/brutaldon_logo.png",
alt: "The Brutaldon logo",
description: `Brutaldon is a brutalist, Web 1.0 web interface for Mastodon and Pleroma.`,
},
peertube: {
title: "PeerTube",
url: "https://vid.werefox.dev/",
src: "/emoji/peertube_logo.svg",
alt: "The PeerTube logo",
description: `PeerTube is a free and open-source, decentralized, federated video platform
powered by ActivityPub and WebTorrent, that uses peer-to-peer technology to reduce load on
individual servers when viewing videos.`,
},
element: {
title: "Element",
url: "https://elem.werefox.dev/",
src: "/emoji/element_logo.svg",
alt: "The Element logo",
description: `Element (previously Riot) is an all-in-one secure chat app for teams,
friends and organisations. Keeps conversations in your control, safe from data-mining
and ads. Talk to everyone through the open global Matrix network, protected by proper
end-to-end encryption. (additionally, I host a Matrix server at matrix.werefox.dev)`,
},
gitea: {
title: "Gitea",
url: "https://gitea.werefox.dev/",
src: "/emoji/gitea_logo.svg",
alt: "The Gitea logo",
description: `A painless self-hosted Git service. Gitea is a community managed
lightweight code hosting solution written in Go. It is published under the MIT license.`,
},
};
export default function Projects() {
export default function Services() {
return (
<BasicPage page_title="Werefox Projects" card_title="Some stuff I do!">
<WCard>
<PBlock title="Services" cards={CARDS} />
</WCard>
<BasicPage page_title="Personal Projects" card_title="Some stuff I do!">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
<PBlock title="Personal Projects" cards={PROJECTS} />
</div>
</BasicPage>
);
}

13
src/info/pages/projects/services/index.js Normal file
View File

@ -0,0 +1,13 @@
import BasicPage from "../../../components/basic-page";
import PBlock from "../../../components/project-block";
import { SERVICES } from "../../../js/variables";
export default function Services() {
return (
<BasicPage page_title="Werefox Services" card_title="Services I Host!">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
<PBlock title="Services" cards={SERVICES} />
</div>
</BasicPage>
);
}

11
src/info/pages/support/index.js
View File

@ -1,4 +1,4 @@
import BasicPage from "../../components/basic-page-template";
import BasicPage from "../../components/basic-page";
import WCard from "../../components/werefox-card";
import Link from "next/link";
import Iframe from "react-iframe";
@ -6,12 +6,11 @@ import Iframe from "react-iframe";
export default function Support() {
return (
<BasicPage page_title="Support" card_title="Support Me!">
<WCard>
<WCard
innerText="I would sincerely appreciate if you would throw some financial
support my way!! 💙"
>
<div className="p-4 space-y-4">
<p className="pt-6 text-lg md:text-2xl text-center text-werefox-blue-dark dark:text-werefox-blue">
I would sincerely appreciate if you would throw some financial
support my way!! 💙
</p>
<p className="text-lg md:text-2xl text-center text-werefox-blue-dark dark:text-werefox-blue">
You could support me through Patreon, Ko-fi, or Liberapay
</p>

98
src/info/pages/testimonials/index.js
View File

@ -1,6 +1,7 @@
import BasicPage from "../../components/basic-page-template";
import BasicPage from "../../components/basic-page";
import WCard from "../../components/werefox-card";
import TCard from "../../components/testimonial-card";
import { TESTIMONIALS } from "../../js/variables";
import axios from "axios";
// Async functions to grab user avatars server-side
@ -15,7 +16,7 @@ export const getIcon = async ({ json, name }) =>
);
export const getStaticProps = async () => {
const promises = Object.entries(USERS).map(([name, { json }]) =>
const promises = Object.entries(TESTIMONIALS).map(([name, { json }]) =>
getIcon({ name, json })
);
const iconUrls = await Promise.all(promises);
@ -29,99 +30,24 @@ export const getStaticProps = async () => {
};
};
// This is where you put the testimonial users' info
const USERS = {
colabunny: {
json: "https://yiff.life/@colabunny.json",
url: "https://yiff.life/@colabunny",
content: '"please stay your jokes are funny and smart"',
},
ElfLord: {
url: "https://freedom.horse/@ElfLord",
json: "https://freedom.horse/@ElfLord.json",
content: `"Someday I'm gonna visit you in Texas, and when I get there, I'm going to realize you don't live in Texas at all, and I'm in the wrong state"`,
},
Decimal: {
url: "https://plush.city/@Decimal",
json: "https://plush.city/@Decimal.json",
content: `"I will appreciate the heck out of you any day"`,
},
skelly: {
url: "https://redroo.ml/@skelly",
json: "https://redroo.ml/@skelly.json",
content: `"this an an official invitation for any one of you to put 'fuck you i dont give testimonials' as a testimonial by me on your profile"`,
},
Drako_Fenris: {
url: "https://yiff.life/@Drako_Fenris",
json: "https://yiff.life/@Drako_Fenris.json",
content: `"[Alexis' future wife] lives in the ether yet to be revealed. she awaits the day her big tiddie goth gf rides in on her unicorn and rescues her."`,
},
"00dani": {
url: "https://vulpine.club/@00dani",
json: "https://vulpine.club/@00dani.json",
content: `"*falls in love with you* haha whoopsies 😳"`,
},
Gumby: {
url: "https://puppy.cafe/@Gumby",
json: "https://puppy.cafe/@Gumby.json",
content: `"im love alexis a lot 💚 🐀"`,
},
AshBunny: {
url: "https://vulpine.club/@AshBunny",
json: "https://vulpine.club/@AshBunny.json",
content: `"heck. I don't think I can take all of this support."`,
},
heatherhorns: {
url: "https://plush.city/@heatherhorns",
json: "https://plush.city/@heatherhorns.json",
content: `";~;
gpsd gosh"`,
},
MutoShack: {
url: "https://functional.cafe/@MutoShack",
json: "https://functional.cafe/@MutoShack.json",
content: `"yess w'all say nice things! usually "alexis is the good" and "alexis is the gay"
because it is the truth"`,
},
immychan: {
url: "https://antabaka.me/@immychan",
json: "https://antabaka.me/@immychan.json",
content: `"Oh damn you're cute 😳"`,
},
nautilee: {
url: "https://dragon.style/@nautilee",
json: "https://dragon.style/@nautilee.json",
content: `"...how are you so goshdarn cute"`,
},
lindsays: {
url: "https://hackers.town/@lindsays",
json: "https://hackers.town/@lindsays.json",
content: `"Regarding @shadow8t4 : She's an amazing, sweet, beautiful dork, and a spectacular best friend. also, a butt."`,
},
};
export default function Testimonials({ iconUrls }) {
return (
<BasicPage page_title="Werefox Testimonials" card_title="Testimonials!">
<WCard>
<p className="p-6 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue">
Sometimes, people say some nice things about me. Here are some
examples!
</p>
</WCard>
{Object.keys(USERS).map((user) => (
<WCard
innerText={`Sometimes, people say some nice things about me. Here are some
examples!`}
>
{Object.keys(TESTIMONIALS).map((user) => (
<TCard
key={USERS[user].url}
key={TESTIMONIALS[user].url}
src={iconUrls[user]}
alt={`${user}'s Avatar`}
url={USERS[user].url}
url={TESTIMONIALS[user].url}
user={user}
innerText={USERS[user].content}
innerText={TESTIMONIALS[user].content}
/>
))}
</WCard>
</BasicPage>
);
}

1
src/info/public/emoji/crt_blue_screen.svg Normal file
View File

@ -0,0 +1 @@
<svg clip-rule="evenodd" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.41421" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><path clip-rule="evenodd" d="m0 0h32v32h-32z"/></clipPath><metadata/><path d="m0 0h32v32h-32z" fill="none"/><g clip-path="url(#a)"><path d="m0 0h32v32h-32z"/><path d="m30 2h-28v22l1 .5-1 .5v5h28v-5l-1-.5 1-.5z" fill="#4d4d4d"/><path d="m2 24h28v1h-28z" fill="#333"/><g fill="#808080"><path d="m4 26h2v1h-2z"/><path d="m4 28h2v1h-2z"/><path d="m7 26h2v1h-2z"/><path d="m7 28h2v1h-2z"/><path d="m10 26h2v1h-2z"/><path d="m10 28h2v1h-2z"/></g><path d="m25 26h3v3h-3z" fill="#219555"/><circle cx="14.5" cy="27.5" fill="#333" r="1.5"/><circle cx="18.5" cy="27.5" fill="#333" r="1.5"/><circle cx="22.5" cy="27.5" fill="#333" r="1.5"/><path d="m28 6c0-.53-.211-1.039-.586-1.414s-.884-.586-1.414-.586c-4.52 0-15.48 0-20 0-.53 0-1.039.211-1.414.586s-.586.884-.586 1.414v14c0 .53.211 1.039.586 1.414s.884.586 1.414.586h20c.53 0 1.039-.211 1.414-.586s.586-.884.586-1.414c0-3.463 0-10.537 0-14z" fill="#2243fd"/><path d="m17 18h6v2h-6z" fill="#fff"/><path d="m24 18h2v2h-2z" fill="#fff"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB