Rename love-card to partner-card, ensure partner page works properly based on contents of YAML.

This commit is contained in:
Alexis Werefox 2021-06-15 04:30:03 +00:00
parent a4e60fa5b8
commit 199539d0b1
9 changed files with 30 additions and 20 deletions

View File

@ -1,6 +1,6 @@
import IDButton from "./identity-button"; import IDButton from "./identity-button";
export default function IdentityBlock({ identities }) { export default function IdentityBlock({ identities, partners }) {
return ( return (
<nav> <nav>
<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"> <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">
@ -12,6 +12,7 @@ export default function IdentityBlock({ identities }) {
locator={identities[ids].locator} locator={identities[ids].locator}
imageObj={identities[ids].images} imageObj={identities[ids].images}
extraClasses={identities[ids].extra_classes} extraClasses={identities[ids].extra_classes}
partners={partners}
/> />
))} ))}
</div> </div>

View File

@ -7,6 +7,7 @@ export default function IdentityButton({
innerText, innerText,
url, url,
locator, locator,
partners,
}) { }) {
const images = Array(imageObj).flat(); const images = Array(imageObj).flat();
const maybeLocator = locator ? `#${locator}` : ""; const maybeLocator = locator ? `#${locator}` : "";
@ -31,7 +32,11 @@ export default function IdentityButton({
/>{" "} />{" "}
</span> </span>
))}{" "} ))}{" "}
{innerText} {innerText == "Partners"
? partners > 0
? `Taken(${partners})`
: "Single"
: innerText}
</a> </a>
</Link> </Link>
</div> </div>

View File

@ -21,7 +21,7 @@ export default function IdentityCard({
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 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">
<img <img
@ -127,7 +127,10 @@ export default function IdentityCard({
<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">
<div className="p-4 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(infodict).map((i) => ( {Object.keys(infodict).map((i) => (
<p key={i}>{infodict[i]}</p> <p className="overflow-auto" key={i}>
{" "}
{infodict[i] == "" ? <br /> : infodict[i]}
</p>
))} ))}
</div> </div>
</div> </div>

View File

@ -31,12 +31,8 @@ export function renderPossibleURLField(field) {
} }
} }
export default function LoveCard({ src, alt, url, fields, bio, user }) { export default function PartnerCard({ src, alt, url, fields, bio, user }) {
const finalsrc = Boolean(src) ? src : "/images/logo.png"; const finalsrc = Boolean(src) ? src : "/images/logo.png";
const isMe =
user == "Shadow8t4"
? "text-werefox-blue-dark dark:text-werefox-blue"
: "text-werefox-pink-dark dark:text-werefox-pink";
let bioarray = bio.split("\n"); let bioarray = bio.split("\n");
bioarray = bioarray.slice(0, bioarray.length - 1); bioarray = bioarray.slice(0, bioarray.length - 1);
const biodict = Object.assign({}, bioarray); const biodict = Object.assign({}, bioarray);
@ -55,7 +51,7 @@ export default function LoveCard({ src, alt, url, fields, bio, user }) {
</div> </div>
</a> </a>
</Link>{" "} </Link>{" "}
<div className={`flex-5 p-4 sm:text-sm text-xs text-center ${isMe}`}> <div className="flex-5 p-4 sm:text-sm text-xs text-center text-werefox-pink-dark dark:text-werefox-pink">
<div className="grid grid-cols-1 gap-2"> <div className="grid grid-cols-1 gap-2">
<div className="ring-2 ring-werefox-grey dark:ring-werefox-grey-darker rounded-lg p-2 grid grid-cols-2 grid-rows-1 gap-2 bg-werefox-grey-light dark:bg-werefox-grey"> <div className="ring-2 ring-werefox-grey dark:ring-werefox-grey-darker rounded-lg p-2 grid grid-cols-2 grid-rows-1 gap-2 bg-werefox-grey-light dark:bg-werefox-grey">
{Object.keys(fields).map((field) => ( {Object.keys(fields).map((field) => (

View File

@ -40,7 +40,7 @@ Lesbian:
- { src: "/emoji/lesbian_flag.svg", alt: "Lesbian flag emoji" } - { src: "/emoji/lesbian_flag.svg", alt: "Lesbian flag emoji" }
extra_classes: "" extra_classes: ""
"Taken(1)": Partners:
url: "/identities/partners" url: "/identities/partners"
images: [{ src: "/emoji/blue_heart.svg", alt: "Blue heart emoji" }] images: [{ src: "/emoji/blue_heart.svg", alt: "Blue heart emoji" }]
extra_classes: "" extra_classes: ""

View File

@ -24,4 +24,4 @@ Gumby:
ko-fi.com/gumbyrat ko-fi.com/gumbyrat
CashApp: $GumbyRat CashApp: $GumbyRat
🔞 🔞

View File

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

View File

@ -1,6 +1,6 @@
import BasicPage from "../../../components/basic-page"; import BasicPage from "../../../components/basic-page";
import IDCard from "../../../components/identity-card"; import IDCard from "../../../components/identity-card";
import LCard from "../../../components/love-card"; import PCard from "../../../components/partner-card";
// An object listing pages folks can visit // An object listing pages folks can visit
export async function getStaticProps() { export async function getStaticProps() {
@ -22,7 +22,7 @@ export async function getStaticProps() {
} }
export default function Partners({ PARTNERS }) { export default function Partners({ PARTNERS }) {
if (Object.keys(PARTNERS).length) { if (PARTNERS) {
return ( return (
<BasicPage page_title="Partners" card_title="Partners!"> <BasicPage page_title="Partners" card_title="Partners!">
<IDCard <IDCard
@ -31,7 +31,7 @@ export default function Partners({ PARTNERS }) {
alt="Blue heart emoji" alt="Blue heart emoji"
> >
{Object.keys(PARTNERS).map((partner) => ( {Object.keys(PARTNERS).map((partner) => (
<LCard <PCard
key={PARTNERS[partner].url} key={PARTNERS[partner].url}
src={PARTNERS[partner].avi} src={PARTNERS[partner].avi}
alt={`${partner}'s Avatar`} alt={`${partner}'s Avatar`}
@ -39,7 +39,7 @@ export default function Partners({ PARTNERS }) {
user={partner} user={partner}
fields={PARTNERS[partner].fields} fields={PARTNERS[partner].fields}
bio={PARTNERS[partner].bio} bio={PARTNERS[partner].bio}
></LCard> ></PCard>
))} ))}
</IDCard> </IDCard>
</BasicPage> </BasicPage>
@ -53,7 +53,8 @@ export default function Partners({ PARTNERS }) {
alt="Blue heart emoji" alt="Blue heart emoji"
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.
Oh well!`} Oh well!
`}
></IDCard> ></IDCard>
</BasicPage> </BasicPage>
); );

View File

@ -9,12 +9,15 @@ export async function getStaticProps() {
const yaml = require("js-yaml"); const yaml = require("js-yaml");
let IDENTITIES = {}; let IDENTITIES = {};
let PAGES = {}; let PAGES = {};
let PARTNERS = {};
try { try {
let fileContent = fs.readFileSync("./data/identities.yml", "utf8"); let fileContent = fs.readFileSync("./data/identities.yml", "utf8");
IDENTITIES = yaml.load(fileContent); IDENTITIES = yaml.load(fileContent);
fileContent = fs.readFileSync("./data/pages.yml", "utf8"); fileContent = fs.readFileSync("./data/pages.yml", "utf8");
PAGES = yaml.load(fileContent); PAGES = yaml.load(fileContent);
fileContent = fs.readFileSync("./data/partners.yml", "utf8");
PARTNERS = yaml.load(fileContent);
} catch (e) { } catch (e) {
console.log(e); console.log(e);
} }
@ -22,15 +25,17 @@ export async function getStaticProps() {
props: { props: {
IDENTITIES, IDENTITIES,
PAGES, PAGES,
PARTNERS,
}, },
}; };
} }
export default function Home({ IDENTITIES, PAGES }) { export default function Home({ IDENTITIES, PAGES, PARTNERS }) {
const partnerslen = PARTNERS ? Object.keys(PARTNERS).length : 0;
return ( return (
<HomePage page_title="About A Werefox" card_title="Hi! I'm Alexis Werefox!"> <HomePage page_title="About A Werefox" card_title="Hi! I'm Alexis Werefox!">
<WCard innerText="Basic Info"> <WCard innerText="Basic Info">
<IDBlock identities={IDENTITIES} /> <IDBlock identities={IDENTITIES} partners={partnerslen}/>
</WCard> </WCard>
<WCard innerText="Welcome to my little info site!"> <WCard innerText="Welcome to my little info site!">
<p className="p-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue"> <p className="p-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue">