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

beginning refactor, started migrating support page code to components.

This commit is contained in:
Alexis Werefox 2021-07-10 16:49:58 +00:00
parent bcf373b203
commit d9acc8c1ef
15 changed files with 117 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/info/components/introduction-card.js Normal file
View File

@ -0,0 +1,11 @@
export default function introductionCard({ introduction }) {
return (
<div className="items-center justify-center space-y-4 p-8">
{Object.keys(introduction).map((info) => (
<p className="overflow-wrap w-full text-lg text-center text-werefox-blue-dark dark:text-werefox-blue">
{introduction[info]}
</p>
))}
</div>
);
}

80
src/info/components/support-block.js Normal file
View File

@ -0,0 +1,80 @@
import Link from "next/link";
import WCard from "./werefox-card.js";
import Iframe from "react-iframe";
export default function SupportBlock() {
return (
<WCard
innerText="I would sincerely appreciate if you would throw some financial
support my way!! 💙"
>
<div className="p-4 space-y-4">
<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>
<div className="w-full justify-center flex">
<Link href="https://www.patreon.com/bePatron?u=16333959">
<a target="_blank">
<p className="rounded-lg pt-2 pb-2 pl-4 pr-4 w-full w-max-60 ring-2 ring-werefox-grey dark:ring-werefox-grey-darker text-lg text-center text-werefox-grey-darker dark:text-werefox-grey-lightest bg-werefox-blue dark:bg-werefox-blue-dark transition hover:bg-werefox-blue-light dark:hover:bg-werefox-blue-darker">
<span>
<img
alt="Subscribe to Alexis' Patreon"
src="/images/patreon_logo.png"
className="inline-flex h-6"
></img>
</span>{" "}
Become a Patron!
</p>
</a>
</Link>
</div>
<div className="w-full justify-center flex">
<Link href="https://ko-fi.com/O5O61UAY1">
<a target="_blank">
<p className="rounded-lg pt-2 pb-2 pl-4 pr-4 w-full w-max-60 ring-2 ring-werefox-grey dark:ring-werefox-grey-darker text-lg text-center text-werefox-grey-darker dark:text-werefox-grey-lightest bg-werefox-blue dark:bg-werefox-blue-dark transition hover:bg-werefox-blue-light dark:hover:bg-werefox-blue-darker">
<span>
<img
alt="Buy Alexis a Coffee"
src="/images/kofi_logo.png"
className="inline-flex w-6 pb-1"
></img>
</span>{" "}
Buy me a Coffee!
</p>
</a>
</Link>
</div>
<div className="w-full justify-center flex">
<Link href="https://liberapay.com/alexis_werefox/donate">
<a
target="_blank"
className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker"
>
<img
alt="Donate using Liberapay"
src="/images/liberapay_donate.svg"
className="inline-flex h-10 filter transition hover:brightness-125"
/>
</a>
</Link>
</div>
<div className="pb-6 flex justify-center">
<details className="rounded-lg p-1 overflow-auto">
<summary className="p-2 pl-4 pr-4 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker text-md text-center text-werefox-grey-darker dark:text-werefox-grey-lighter bg-werefox-blue dark:bg-werefox-blue-dark transition hover:bg-werefox-blue-light dark:hover:bg-werefox-blue-darker">
<strong>Open/Close Ko-fi Donation Widget</strong>
</summary>
<div className="pt-2">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker overflow-auto">
<Iframe
className="rounded-lg w-96 min-w-96"
url="https://ko-fi.com/alexis_werefox/?hidefeed=true&widget=true&embed=true&preview=true"
height="680"
></Iframe>
</div>
</div>
</details>
</div>
</div>
</WCard>
);
}

0
src/info/data/partners.yml → src/info/data/identities/partners.yml
View File

7
src/info/data/introduction.yml Normal file
View File

@ -0,0 +1,7 @@
--- # Introduction YAML
intro: |
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.
Feel free to click/tap any of the cute buttons above this to learn more about my different aspects of personality.
Down below, I've got some more neat little pages and useful info you can look at.
Please do look around and enjoy your stay!~ 💙

0
src/info/data/other.yml → src/info/data/projects/other.yml
View File

0
src/info/data/private.yml → src/info/data/projects/private.yml
View File

0
src/info/data/services.yml → src/info/data/projects/services.yml
View File

0
src/info/data/streaming.yml → src/info/data/projects/streaming.yml
View File

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

@ -9,7 +9,7 @@ export async function getStaticProps() {
let PARTNERS = {};
try {
let fileContent = fs.readFileSync("./data/partners.yml", "utf8");
let fileContent = fs.readFileSync("./data/identities/partners.yml", "utf8");
PARTNERS = yaml.load(fileContent);
} catch (e) {
console.log(e);

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

@ -1,6 +1,7 @@
import HomePage from "../components/home-page";
import IDBlock from "../components/identity-block";
import WCard from "../components/werefox-card";
import ICard from "../components/introduction-card";
import PBlock from "../components/page-block";
// An object listing pages folks can visit
@ -8,15 +9,18 @@ export async function getStaticProps() {
const fs = require("fs");
const yaml = require("js-yaml");
let IDENTITIES = {};
let INTRODUCTION = {};
let PAGES = {};
let PARTNERS = {};
try {
let fileContent = fs.readFileSync("./data/identities.yml", "utf8");
IDENTITIES = yaml.load(fileContent);
fileContent = fs.readFileSync("./data/introduction.yml", "utf8");
INTRODUCTION = yaml.load(fileContent);
fileContent = fs.readFileSync("./data/pages.yml", "utf8");
PAGES = yaml.load(fileContent);
fileContent = fs.readFileSync("./data/partners.yml", "utf8");
fileContent = fs.readFileSync("./data/identities/partners.yml", "utf8");
PARTNERS = yaml.load(fileContent);
} catch (e) {
console.log(e);
@ -24,35 +28,26 @@ export async function getStaticProps() {
return {
props: {
IDENTITIES,
INTRODUCTION,
PAGES,
PARTNERS,
},
};
}
export default function Home({ IDENTITIES, PAGES, PARTNERS }) {
export default function Home({ IDENTITIES, INTRODUCTION, PAGES, PARTNERS }) {
const partnerslen = PARTNERS ? Object.keys(PARTNERS).length : 0;
let introarray = INTRODUCTION["intro"].split("\n");
introarray = introarray.slice(0, introarray.length - 1);
const introdict = Object.assign({}, introarray);
return (
<HomePage page_title="About A Werefox" card_title="Hi! I'm Alexis Werefox!">
<WCard innerText="Basic Info">
<IDBlock identities={IDENTITIES} partners={partnerslen} />
</WCard>
<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.
</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.
</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>
<ICard introduction={introdict} />
</WCard>
<WCard innerText="Neat Pages!">
<PBlock pages={PAGES} />

2
src/info/pages/projects/other/index.js
View File

@ -8,7 +8,7 @@ export async function getStaticProps() {
let OTHER = {};
try {
let fileContent = fs.readFileSync("./data/other.yml", "utf8");
let fileContent = fs.readFileSync("./data/projects/other.yml", "utf8");
OTHER = yaml.load(fileContent);
} catch (e) {
console.log(e);

2
src/info/pages/projects/private/index.js
View File

@ -8,7 +8,7 @@ export async function getStaticProps() {
let PRIVATE = {};
try {
let fileContent = fs.readFileSync("./data/private.yml", "utf8");
let fileContent = fs.readFileSync("./data/projects/private.yml", "utf8");
PRIVATE = yaml.load(fileContent);
} catch (e) {
console.log(e);

2
src/info/pages/projects/services/index.js
View File

@ -8,7 +8,7 @@ export async function getStaticProps() {
let SERVICES = {};
try {
let fileContent = fs.readFileSync("./data/services.yml", "utf8");
let fileContent = fs.readFileSync("./data/projects/services.yml", "utf8");
SERVICES = yaml.load(fileContent);
} catch (e) {
console.log(e);

2
src/info/pages/projects/streaming/index.js
View File

@ -8,7 +8,7 @@ export async function getStaticProps() {
let STREAMING = {};
try {
let fileContent = fs.readFileSync("./data/streaming.yml", "utf8");
let fileContent = fs.readFileSync("./data/projects/streaming.yml", "utf8");
STREAMING = yaml.load(fileContent);
} catch (e) {
console.log(e);

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

@ -1,83 +1,10 @@
import BasicPage from "../../components/basic-page";
import WCard from "../../components/werefox-card";
import Link from "next/link";
import Iframe from "react-iframe";
import SBlock from "../../components/support-block";
export default function Support() {
return (
<BasicPage page_title="Support" card_title="Support Me!">
<WCard
innerText="I would sincerely appreciate if you would throw some financial
support my way!! 💙"
>
<div className="p-4 space-y-4">
<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>
<div className="w-full justify-center flex">
<Link href="https://www.patreon.com/bePatron?u=16333959">
<a target="_blank">
<p className="rounded-lg pt-2 pb-2 pl-4 pr-4 w-full w-max-60 ring-2 ring-werefox-grey dark:ring-werefox-grey-darker text-lg text-center text-werefox-grey-darker dark:text-werefox-grey-lightest bg-werefox-blue dark:bg-werefox-blue-dark transition hover:bg-werefox-blue-light dark:hover:bg-werefox-blue-darker">
<span>
<img
alt="Subscribe to Alexis' Patreon"
src="/images/patreon_logo.png"
className="inline-flex h-6"
></img>
</span>{" "}
Become a Patron!
</p>
</a>
</Link>
</div>
<div className="w-full justify-center flex">
<Link href="https://ko-fi.com/O5O61UAY1">
<a target="_blank">
<p className="rounded-lg pt-2 pb-2 pl-4 pr-4 w-full w-max-60 ring-2 ring-werefox-grey dark:ring-werefox-grey-darker text-lg text-center text-werefox-grey-darker dark:text-werefox-grey-lightest bg-werefox-blue dark:bg-werefox-blue-dark transition hover:bg-werefox-blue-light dark:hover:bg-werefox-blue-darker">
<span>
<img
alt="Buy Alexis a Coffee"
src="/images/kofi_logo.png"
className="inline-flex w-6 pb-1"
></img>
</span>{" "}
Buy me a Coffee!
</p>
</a>
</Link>
</div>
<div className="w-full justify-center flex">
<Link href="https://liberapay.com/alexis_werefox/donate">
<a
target="_blank"
className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker"
>
<img
alt="Donate using Liberapay"
src="/images/liberapay_donate.svg"
className="inline-flex h-10 filter transition hover:brightness-125"
/>
</a>
</Link>
</div>
<div className="pb-6 flex justify-center">
<details className="rounded-lg p-1 overflow-auto">
<summary className="p-2 pl-4 pr-4 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker text-md text-center text-werefox-grey-darker dark:text-werefox-grey-lighter bg-werefox-blue dark:bg-werefox-blue-dark transition hover:bg-werefox-blue-light dark:hover:bg-werefox-blue-darker">
<strong>Open/Close Ko-fi Donation Widget</strong>
</summary>
<div className="pt-2">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker overflow-auto">
<Iframe
className="rounded-lg w-96 min-w-96"
url="https://ko-fi.com/alexis_werefox/?hidefeed=true&widget=true&embed=true&preview=true"
height="680"
></Iframe>
</div>
</div>
</details>
</div>
</div>
</WCard>
<SBlock />
</BasicPage>
);
}