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

Begin moving identities data to YAML, site now functions properly with JS disabled.

Browse Source
This commit is contained in:
Alexis Werefox 2021-06-15 03:36:02 +00:00
parent 031581ceec
commit a4e60fa5b8
9 changed files with 137 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/info/components/contacts-link.js
View File

@ -1,12 +1,12 @@
import Image from "next/image";
export default function ContactsLink({ src, alt, url, description, url_text }) { export default function ContactsLink({ src, alt, url, description, url_text }) {
return ( return (
<p className="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={url} target="_blank"> <a href={url} target="_blank">
<span className="animate-bounce relative inline-block w-6 h-6 align-middle"> <img
<Image src={src} layout="fill" objectFit="contain" alt={alt} /> className="object-contain animate-bounce relative inline-block w-6 h-6 align-middle"
</span> src={src}
alt={alt}
/>
</a>{" "} </a>{" "}
{description}{" "} {description}{" "}
<a <a

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

@ -11,15 +11,24 @@ export default function IdentityCard({
alt2, alt2,
children, children,
}) { }) {
let infoarray = [];
let infodict = {};
if (info) {
infoarray = info.split("\n");
infoarray = infoarray.slice(0, infoarray.length - 1);
infodict = Object.assign({}, infoarray);
}
if (children) { if (children) {
return ( 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="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="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"> <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"> <p 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"> <img
<Image src={src} layout="fill" objectFit="contain" alt={alt} /> className="object-contain relative inline-block w-8 h-8 align-middle mb-1"
</span>{" "} src={src}
alt={alt}
/>{" "}
{title} {title}
</p> </p>
</div> </div>
@ -33,18 +42,20 @@ export default function IdentityCard({
<div className="p-2 flow space-y-3"> <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"> <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"> <p 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"> <img
<Image src={src} layout="fill" objectFit="contain" alt={alt} /> className="object-contain relative inline-block w-8 h-8 align-middle mb-1"
</span>{" "} src={src}
alt={alt}
/>{" "}
{title} {title}
</p> </p>
</div> </div>
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark"> <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"> <div className="p-4 space-y-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
{Object.keys(info).map((i) => ( {Object.keys(infodict).map((i) => (
<p key={i}>{info[i]}</p> <p key={i}>{infodict[i] == "" ? <br /> : infodict[i]}</p>
))} ))}
</p> </div>
</div> </div>
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark"> <div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<a href="https://twitter.com/ribbonfemale" target="_blank"> <a href="https://twitter.com/ribbonfemale" target="_blank">
@ -69,18 +80,22 @@ export default function IdentityCard({
<div className="p-2 flow space-y-3" id={title}> <div className="p-2 flow space-y-3" id={title}>
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark"> <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"> <p 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"> <img
<Image src={src} layout="fill" objectFit="contain" alt={alt} /> className="object-contain relative inline-block w-8 h-8 align-middle mb-1"
</span>{" "} src={src}
alt={alt}
/>{" "}
{title} {title}
</p> </p>
</div> </div>
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark"> <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"> <div className="p-4 space-y-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
{Object.keys(info).map((i) => ( {Object.keys(infodict).map((i) => (
<p key={i}>{info[i]}</p> <p className="overflow-auto" key={i}>
{infodict[i] == "" ? <br /> : infodict[i]}
</p>
))} ))}
</p> </div>
<div className="pb-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue"> <div className="pb-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
<Link href={url}> <Link href={url}>
<a <a
@ -101,18 +116,20 @@ export default function IdentityCard({
<div className="p-2 flow space-y-3"> <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"> <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"> <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"> <img
<Image src={src} layout="fill" objectFit="contain" alt={alt} /> className="relative inline-block w-8 h-8 align-middle mb-1"
</span>{" "} src={src}
alt={alt}
/>{" "}
{title} {title}
</h4> </h4>
</div> </div>
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark"> <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"> <div className="p-4 space-y-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
{Object.keys(info).map((i) => ( {Object.keys(infodict).map((i) => (
<p key={i}>{info[i]}</p> <p key={i}>{infodict[i]}</p>
))} ))}
</p> </div>
</div> </div>
</div> </div>
</div> </div>

11
src/info/data/gender.yml Normal file
View File

@ -0,0 +1,11 @@
--- # Gender YAML
Gender:
title: "Trans-femme"
url: "https://gender.wikia.org/wiki/Transfeminine"
src: "/emoji/transgender_flag.svg"
alt: "The transgender flag"
info: |
This is a bit of a generalized term to mean someone who identifies primarily feminine.
I do personally identify as a girl, but this is a bit more of a P.C. term to use!

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

@ -6,14 +6,17 @@ export default function Fursona() {
<BasicPage page_title="OwO What's this?" card_title="Fursona Details!"> <BasicPage page_title="OwO What's this?" card_title="Fursona Details!">
<IDCard <IDCard
title="Alexis Werefox" title="Alexis Werefox"
info={{ info={`That's me, the witchy foxxo herself! 💙
info: `That's me, the witchy foxxo herself! 💙`,
more: `Despite making this whole website, I'm honestly not much for talking about myself most of the time, unless I'm feeling particularly good.`, Despite making this whole website, I'm honestly not much for talking about myself most of the time, unless I'm feeling particularly good.
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?`, I'm a fox, though! I think originally based on a fennec, but I've kinda moved away from that design nowadays.
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!)`, 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?
}}
I know! I know! You came here to see some art, yes?! Well, here's a free one for ya!~
(this was done by the wonderful @ribbonfemale on Twitter!)`}
src="/emoji/pixel_alexis.png" src="/emoji/pixel_alexis.png"
alt="It's me! Alexis Werefox!" alt="It's me! Alexis Werefox!"
src2="/images/alexis_witch.jpg" src2="/images/alexis_witch.jpg"

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

@ -1,19 +1,39 @@
import BasicPage from "../../../components/basic-page"; import BasicPage from "../../../components/basic-page";
import IDCard from "../../../components/identity-card"; import IDCard from "../../../components/identity-card";
export default function Gender() { // An object listing pages folks can visit
export async function getStaticProps() {
const fs = require("fs");
const yaml = require("js-yaml");
let GENDER = "";
try {
let fileContent = fs.readFileSync("./data/gender.yml", "utf8");
GENDER = yaml.load(fileContent);
console.log(GENDER);
} catch (e) {
console.log(e);
}
return {
props: {
GENDER,
},
};
}
export default function Gender({ GENDER }) {
return ( return (
<BasicPage page_title="What's Gender?" card_title="I'm Transgender!"> <BasicPage page_title="What's Gender?" card_title="I'm Transgender!">
<IDCard {Object.keys(GENDER).map((gender) => (
title="Trans-femme" <IDCard
info={{ key={gender}
info: `This is a bit of a generalized term to mean someone who identifies primarily feminine.`, title={GENDER[gender].title}
more: `I do personally identify as a girl, but this is a bit more of a P.C. term to use!`, info={GENDER[gender].info}
}} url={GENDER[gender].url}
url="https://gender.wikia.org/wiki/Transfeminine" src={GENDER[gender].src}
src="/emoji/transgender_flag.svg" alt={GENDER[gender].alt}
alt="The transgender flag" />
/> ))}
</BasicPage> </BasicPage>
); );
} }

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

@ -9,23 +9,27 @@ export default function Neurodiversity() {
> >
<IDCard <IDCard
title="ADHD" title="ADHD"
info={{ info={`This stands for "Attention-Deficit Hyperactivity Disorder".
info: `This stands for "Attention-Deficit Hyperactivity Disorder".`,
neurodivergent: `Addionally, the term "neurodivergent" is a general term meaning someone who lives with a form of mental disorder which may impair or alter the way they act and react to the world around them.`, Addionally, the term "neurodivergent" is a general term meaning someone who lives with a form of mental disorder which may impair or alter the way they act and react to the world around them.
adhd: `While the term ADHD does address the attention and hyperactive aspects of the disorder, there are actually many other aspects that often go unaddressed. The main ones, however, are:`,
symptom1: `- Lack of focus, and conversely, hyperfocus!`, While the term ADHD does address the attention and hyperactive aspects of the disorder, there are actually many other aspects that often go unaddressed. The main ones, however, are:
symptom2: `- Impulsiveness`, - Lack of focus, and conversely, hyperfocus!
symptom3: `- Impaired ability to multitask`, - Impulsiveness
symptom4: `- Time management issues`, - Impaired ability to multitask
simpyom5: `- Executive dysfunction (complicated, but basically an inability to do things right away)`, - Time management issues
symptom6: `- Difficulty remembering things (especially details and things we don't find stimulating)`, - Executive dysfunction (complicated, but basically an inability to do things right away)
symptom7: `- Emotional dysregularity (we have trouble regulating our emotions!)`, - Difficulty remembering things (especially details and things we don't find stimulating)
symptom8: `- Last, but not least, is something called "rejection sensitivity", which can be hard to explain, but is essentially an extreme sensitivity to isolation, to the point where we will make up (often harmful and incorrect) reasons for why others must be avoiding us.`, - Emotional dysregularity (we have trouble regulating our emotions!)
rejection: `It isn't technically medically accepted, but is proven to be a common symptom among ADHD folks!`, - Last, but not least, is something called "rejection sensitivity", which can be hard to explain, but is essentially an extreme sensitivity to isolation, to the point where we will make up (often harmful and incorrect) reasons for why others must be avoiding us.
medical1: `Two basic things you should recgonize about why we are this way is that for one, we don't receive enough Dopamine for accomplishing things compared to neurotypicals, and it makes doing things we don't like incredibly dreadful, and gives us a bit of a dependence on receiving more Dopamine constantly.`,
medical2: `Second, the part of our brain that manages emotional regulation is underdeveloped, which makes our capacity for controlling emotions comparable sometimes to that of a child.`, It isn't technically medically accepted, but is proven to be a common symptom among ADHD folks!
conclusion: `There's a lot more I wish I could say, but I can genuinely recommend the following link to the YouTube channel "How to ADHD" if you want to learn more, especially if you believe you have this disorder yourself!`,
}} Two basic things you should recgonize about why we are this way is that for one, we don't receive enough Dopamine for accomplishing things compared to neurotypicals, and it makes doing things we don't like incredibly dreadful, and gives us a bit of a dependence on receiving more Dopamine constantly.
Second, the part of our brain that manages emotional regulation is underdeveloped, which makes our capacity for controlling emotions comparable sometimes to that of a child.
There's a lot more I wish I could say, but I can genuinely recommend the following link to the YouTube channel "How to ADHD" if you want to learn more, especially if you believe you have this disorder yourself!`}
url="https://www.youtube.com/channel/UC-nPM1_kSZf91ZGkcgy_95Q" url="https://www.youtube.com/channel/UC-nPM1_kSZf91ZGkcgy_95Q"
src="/emoji/neurodiversity.svg" src="/emoji/neurodiversity.svg"
alt="The neurodiversity symbol" alt="The neurodiversity symbol"

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

@ -51,10 +51,9 @@ export default function Partners({ PARTNERS }) {
title="My loves!" title="My loves!"
src="/emoji/blue_heart.svg" src="/emoji/blue_heart.svg"
alt="Blue heart emoji" alt="Blue heart emoji"
info={{ info={`Oh! It looks like I don't have any partners at the moment.
info: `Oh! It looks like I don't have any partners at the moment.`,
more: `Oh well!`, Oh well!`}
}}
></IDCard> ></IDCard>
</BasicPage> </BasicPage>
); );

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

@ -9,11 +9,11 @@ export default function Pronouns() {
> >
<IDCard <IDCard
title="She/Her" title="She/Her"
info={{ info={`When you're referring to me, please use the pronouns "She/Her".
info: `When you're referring to me, please use the pronouns "She/Her".`,
more: `If you need some examples, for whatever reason, here are some from the site you can visit by clicking on the link below!`, If you need some examples, for whatever reason, here are some from the site you can visit by clicking on the link below!
examples: `"Today I met a new friend, and she is really nice. She has a wonderful personality. That smile of hers really makes me happy."`,
}} "Today I met a new friend, and she is really nice. She has a wonderful personality. That smile of hers really makes me happy."`}
url="https://pronouns.me/she" url="https://pronouns.me/she"
src="/emoji/speech_bubble_left.svg" src="/emoji/speech_bubble_left.svg"
alt="A speech bubble emoji" alt="A speech bubble emoji"

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

@ -9,30 +9,27 @@ export default function Sexuality() {
> >
<IDCard <IDCard
title="Polyam" title="Polyam"
info={{ info={`Short for "Polyamory", this means that I am okay with having multiple partners!
info: `Short for "Polyamory", this means that I am okay with having multiple partners!`,
more: `There's a lot I can say about Polyamory, but I feel like if you really want to learn more about it, you might be better off following the link below.`, There's a lot I can say about Polyamory, but I feel like if you really want to learn more about it, you might be better off following the link below.`}
}}
url="https://lgbta.wikia.org/wiki/Polyamorous" url="https://lgbta.wikia.org/wiki/Polyamorous"
src="/emoji/polyamory_flag.svg" src="/emoji/polyamory_flag.svg"
alt="The polyamory flag" alt="The polyamory flag"
/> />
<IDCard <IDCard
title="Pansexual" title="Pansexual"
info={{ info={`This means that I am okay with sexual and romantic partners of any gender identity!
info: `This means that I am okay with sexual and romantic partners of any gender identity!`,
more: `Of course, being Pansexual does not mean I cannot have preferences or that I want to date *"anyone"*, just that I am open to it.`, Of course, being Pansexual does not mean I cannot have preferences or that I want to date *"anyone"*, just that I am open to it.`}
}}
url="https://lgbta.wikia.org/wiki/Pansexual" url="https://lgbta.wikia.org/wiki/Pansexual"
src="/emoji/pansexual_flag.svg" src="/emoji/pansexual_flag.svg"
alt="The pansexual flag" alt="The pansexual flag"
/> />
<IDCard <IDCard
title="Lesbian" title="Lesbian"
info={{ info={`This means that I am okay with sexual and romantic partners that are the same gender identity as me!
info: `This means that I am okay with sexual and romantic partners that are the same gender identity as me!`,
more: `If you have questions about how I could be both Pansexual and Lesiban, I'd refer you to my FAQ.`, If you have questions about how I could be both Pansexual and Lesiban, I'd refer you to my FAQ.`}
}}
url="https://lgbta.wikia.org/wiki/Lesbian" url="https://lgbta.wikia.org/wiki/Lesbian"
src="/emoji/lesbian_flag.svg" src="/emoji/lesbian_flag.svg"
alt="The lesbian flag" alt="The lesbian flag"