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

src/info/components/identity-block.js

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

src/info/components/identity-button.js

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

src/info/components/identity-card.js

@@ -21,7 +21,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="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-4 text-center text-lg sm:text-2xl text-werefox-grey-dark dark:text-werefox-grey-lighter">
               <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="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) => (
-                <p key={i}>{infodict[i]}</p>
+                <p className="overflow-auto" key={i}>
+                  {" "}
+                  {infodict[i] == "" ? <br /> : infodict[i]}
+                </p>
               ))}
             </div>
           </div>

src/info/components/partner-card.js

@@ -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 isMe =
-    user == "Shadow8t4"
-      ? "text-werefox-blue-dark dark:text-werefox-blue"
-      : "text-werefox-pink-dark dark:text-werefox-pink";
   let bioarray = bio.split("\n");
   bioarray = bioarray.slice(0, bioarray.length - 1);
   const biodict = Object.assign({}, bioarray);
@@ -55,7 +51,7 @@ export default function LoveCard({ src, alt, url, fields, bio, user }) {
           </div>
         </a>
       </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="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) => (

src/info/data/identities.yml

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

src/info/pages/identities/gender/index.js

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

src/info/pages/identities/partners/index.js

@@ -1,6 +1,6 @@
 import BasicPage from "../../../components/basic-page";
 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
 export async function getStaticProps() {
@@ -22,7 +22,7 @@ export async function getStaticProps() {
 }
 
 export default function Partners({ PARTNERS }) {
-  if (Object.keys(PARTNERS).length) {
+  if (PARTNERS) {
     return (
       <BasicPage page_title="Partners" card_title="Partners!">
         <IDCard
@@ -31,7 +31,7 @@ export default function Partners({ PARTNERS }) {
           alt="Blue heart emoji"
         >
           {Object.keys(PARTNERS).map((partner) => (
-            <LCard
+            <PCard
               key={PARTNERS[partner].url}
               src={PARTNERS[partner].avi}
               alt={`${partner}'s Avatar`}
@@ -39,7 +39,7 @@ export default function Partners({ PARTNERS }) {
               user={partner}
               fields={PARTNERS[partner].fields}
               bio={PARTNERS[partner].bio}
-            ></LCard>
+            ></PCard>
           ))}
         </IDCard>
       </BasicPage>
@@ -53,7 +53,8 @@ export default function Partners({ PARTNERS }) {
           alt="Blue heart emoji"
           info={`Oh! It looks like I don't have any partners at the moment.
           
-          Oh well!`}
+          Oh well!
+          `}
         ></IDCard>
       </BasicPage>
     );

src/info/pages/index.js

@@ -9,12 +9,15 @@ export async function getStaticProps() {
   const yaml = require("js-yaml");
   let IDENTITIES = {};
   let PAGES = {};
+  let PARTNERS = {};
 
   try {
     let fileContent = fs.readFileSync("./data/identities.yml", "utf8");
     IDENTITIES = yaml.load(fileContent);
     fileContent = fs.readFileSync("./data/pages.yml", "utf8");
     PAGES = yaml.load(fileContent);
+    fileContent = fs.readFileSync("./data/partners.yml", "utf8");
+    PARTNERS = yaml.load(fileContent);
   } catch (e) {
     console.log(e);
   }
@@ -22,15 +25,17 @@ export async function getStaticProps() {
     props: {
       IDENTITIES,
       PAGES,
+      PARTNERS,
     },
   };
 }
 
-export default function Home({ IDENTITIES, PAGES }) {
+export default function Home({ IDENTITIES, PAGES, PARTNERS }) {
+  const partnerslen = PARTNERS ? Object.keys(PARTNERS).length : 0;
   return (
     <HomePage page_title="About A Werefox" card_title="Hi! I'm Alexis Werefox!">
       <WCard innerText="Basic Info">
-        <IDBlock identities={IDENTITIES} />
+        <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">