Big refactoring with more components, added a variables file to save data.
This commit is contained in:
		
							parent
							
								
									fe1fe42d4e
								
							
						
					
					
						commit
						a59bf8f88c
					
				
					 28 changed files with 985 additions and 878 deletions
				
			
		|  | @ -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
									
								
							
							
						
						
									
										18
									
								
								src/info/components/faq-block.js
									
									
									
									
									
										Normal 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
									
								
							
							
						
						
									
										43
									
								
								src/info/components/faq-card.js
									
									
									
									
									
										Normal 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> | ||||
|   ); | ||||
| } | ||||
|  | @ -3,40 +3,45 @@ import WCard from "./werefox-card"; | |||
| 
 | ||||
| export default function FooterCard() { | ||||
|   return ( | ||||
|     <WCard> | ||||
|       <footer className="p-4 space-y-2"> | ||||
|         <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> | ||||
|               </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> | ||||
|               </Link> | ||||
|             </p> | ||||
|           </div> | ||||
|     <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> | ||||
|             </Link> | ||||
|           </p> | ||||
|         </div> | ||||
|         <p className="text-center text-xs text-werefox-grey-darkest dark:text-werefox-grey-lightest"> | ||||
|           This site uses{" "} | ||||
|           <Link href="https://mutant.tech"> | ||||
|             <a className="transition hover:text-werefox-grey-darker dark:hover:text-werefox-grey-lighter"> | ||||
|               Mutant Standard emoji | ||||
|             </a> | ||||
|           </Link> | ||||
|           , which are licensed under a{" "} | ||||
|           <Link href="https://creativecommons.org/licenses/by-nc-sa/4.0/"> | ||||
|             <a className="transition hover:text-werefox-grey-darker dark:hover:text-werefox-grey-lighter"> | ||||
|               Creative Commons Attribution-NonCommercial-ShareAlike 4.0 | ||||
|               International License | ||||
|             </a> | ||||
|           </Link> | ||||
|         </p> | ||||
|       </footer> | ||||
|     </WCard> | ||||
|         <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> | ||||
|             </Link> | ||||
|           </p> | ||||
|         </div> | ||||
|       </div> | ||||
|       <p className="text-center text-xs text-werefox-grey-darkest dark:text-werefox-grey-lightest"> | ||||
|         This site uses{" "} | ||||
|         <Link href="https://mutant.tech"> | ||||
|           <a className="transition hover:text-werefox-grey-darker dark:hover:text-werefox-grey-lighter"> | ||||
|             Mutant Standard emoji | ||||
|           </a> | ||||
|         </Link> | ||||
|         , which are licensed under a{" "} | ||||
|         <Link href="https://creativecommons.org/licenses/by-nc-sa/4.0/"> | ||||
|           <a className="transition hover:text-werefox-grey-darker dark:hover:text-werefox-grey-lighter"> | ||||
|             Creative Commons Attribution-NonCommercial-ShareAlike 4.0 | ||||
|             International License | ||||
|           </a> | ||||
|         </Link> | ||||
|       </p> | ||||
|     </footer> | ||||
|   ); | ||||
| } | ||||
|  |  | |||
							
								
								
									
										18
									
								
								src/info/components/identity-block.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										18
									
								
								src/info/components/identity-block.js
									
									
									
									
									
										Normal 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> | ||||
|   ); | ||||
| } | ||||
|  | @ -13,82 +13,106 @@ export default function IdentityCard({ | |||
| }) { | ||||
|   if (children) { | ||||
|     return ( | ||||
|       <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 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> | ||||
|           {children} | ||||
|         </div> | ||||
|         {children} | ||||
|       </div> | ||||
|     ); | ||||
|   } else if (src2) { | ||||
|     return ( | ||||
|       <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 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 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"> | ||||
|               <span className="relative inline-flex align-middle"> | ||||
|                 <Image | ||||
|                   className="rounded-lg" | ||||
|                   src={src2} | ||||
|                   layout="intrinsic" | ||||
|                   width="2048" | ||||
|                   height="2048" | ||||
|                   alt={alt2} | ||||
|                 /> | ||||
|               </span> | ||||
|             </a> | ||||
|           </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"> | ||||
|           <p className="p-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> | ||||
|         </div> | ||||
|         <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"> | ||||
|             <span className="relative inline-flex align-middle"> | ||||
|               <Image | ||||
|                 className="rounded-lg" | ||||
|                 src={src2} | ||||
|                 layout="intrinsic" | ||||
|                 width="2048" | ||||
|                 height="2048" | ||||
|                 alt={alt2} | ||||
|               /> | ||||
|             </span> | ||||
|           </a> | ||||
|       </div> | ||||
|     ); | ||||
|   } 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"> | ||||
|               <span className="relative inline-block w-8 h-8 align-middle mb-1"> | ||||
|                 <Image src={src} layout="fill" objectFit="contain" alt={alt} /> | ||||
|               </span>{" "} | ||||
|               {title} | ||||
|             </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 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 className="pb-4 text-center text-md sm:text-lg 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" | ||||
|                 > | ||||
|                   Learn More | ||||
|                 </a> | ||||
|               </Link> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|     ); | ||||
|   } else { | ||||
|     return ( | ||||
|       <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"> | ||||
|             <span className="relative inline-block w-8 h-8 align-middle mb-1"> | ||||
|               <Image src={src} layout="fill" objectFit="contain" alt={alt} /> | ||||
|             </span>{" "} | ||||
|             {title} | ||||
|           </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"> | ||||
|             {Object.keys(info).map((i) => ( | ||||
|               <p className="pb-4" 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"> | ||||
|             <Link href={url}> | ||||
|               <a | ||||
|                 target="_blank" | ||||
|                 className=" transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|               > | ||||
|                 Learn More | ||||
|               </a> | ||||
|             </Link> | ||||
|       <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
									
								
							
							
						
						
									
										17
									
								
								src/info/components/page-block.js
									
									
									
									
									
										Normal 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
									
								
							
							
						
						
									
										29
									
								
								src/info/components/page-button.js
									
									
									
									
									
										Normal 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> | ||||
|   ); | ||||
| } | ||||
|  | @ -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} | ||||
|  |  | |||
|  | @ -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} | ||||
|  |  | |||
|  | @ -32,10 +32,12 @@ export default function TestimonialCard({ src, alt, url, innerText, user }) { | |||
|           {innerText} | ||||
|           <br /> | ||||
|           {"- "} | ||||
|           <a | ||||
|             target="_blank" | ||||
|             className={`transition ${isMeLink}`} | ||||
|           >{`@${user}`}</a> | ||||
|           <Link href={url}> | ||||
|             <a | ||||
|               target="_blank" | ||||
|               className={`transition ${isMeLink}`} | ||||
|             >{`@${user}`}</a> | ||||
|           </Link> | ||||
|         </p> | ||||
|       </div> | ||||
|     </div> | ||||
|  |  | |||
|  | @ -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) { | ||||
|   } else { | ||||
|     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 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> | ||||
|     ); | ||||
|   } | ||||
|   return ( | ||||
|     <div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey"> | ||||
|       {children} | ||||
|     </div> | ||||
|   ); | ||||
| } | ||||
|  |  | |||
							
								
								
									
										353
									
								
								src/info/js/variables.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										353
									
								
								src/info/js/variables.js
									
									
									
									
									
										Normal 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.`,
 | ||||
|   }, | ||||
| }; | ||||
|  | @ -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,158 +8,151 @@ 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"> | ||||
|               <a href="https://vulpine.club/@shadow8t4" target="_blank"> | ||||
|                 <span className="animate-bounce relative inline-block w-6 h-6 align-middle"> | ||||
|                   <Image | ||||
|                     src="/emoji/mastodon-logo.png" | ||||
|                     layout="fill" | ||||
|                     objectFit="contain" | ||||
|                     alt="Mastodon logo" | ||||
|                   /> | ||||
|                 </span> | ||||
|               </a>{" "} | ||||
|               My public Mastodon{" "} | ||||
|               <a | ||||
|                 className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|                 href="https://vulpine.club/@shadow8t4" | ||||
|                 target="_blank" | ||||
|               > | ||||
|                 @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"> | ||||
|               <a href="https://twitter.com/alexis_werefox" target="_blank"> | ||||
|                 <span className="animate-bounce relative inline-block w-6 h-6 align-middle"> | ||||
|                   <Image | ||||
|                     src="/emoji/twitter-logo.png" | ||||
|                     layout="fill" | ||||
|                     objectFit="contain" | ||||
|                     alt="Twitter logo" | ||||
|                   /> | ||||
|                 </span> | ||||
|               </a>{" "} | ||||
|               My Twitter{" "} | ||||
|               <a | ||||
|                 className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|                 href="https://twitter.com/alexis_werefox" | ||||
|                 target="_blank" | ||||
|               > | ||||
|                 @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"> | ||||
|               <a href="https://www.twitch.tv/alexis_werefox" target="_blank"> | ||||
|                 <span className="animate-bounce relative inline-block w-6 h-6 align-middle"> | ||||
|                   <Image | ||||
|                     src="/emoji/twitch-logo.png" | ||||
|                     layout="fill" | ||||
|                     objectFit="contain" | ||||
|                     alt="Twitch logo" | ||||
|                   /> | ||||
|                 </span> | ||||
|               </a>{" "} | ||||
|               My Twitch{" "} | ||||
|               <a | ||||
|                 className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|                 href="https://www.twitch.tv/alexis_werefox" | ||||
|                 target="_blank" | ||||
|               > | ||||
|                 @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"> | ||||
|               <a | ||||
|                 href="https://vid.werefox.dev/accounts/shadow8t4/video-channels" | ||||
|                 target="_blank" | ||||
|               > | ||||
|                 <span className="animate-bounce relative inline-block w-6 h-6 align-middle"> | ||||
|                   <Image | ||||
|                     src="/emoji/vhs.svg" | ||||
|                     layout="fill" | ||||
|                     objectFit="contain" | ||||
|                     alt="VHS tape emoji" | ||||
|                   /> | ||||
|                 </span> | ||||
|               </a>{" "} | ||||
|               My PeerTube (mostly VODs from the stream){" "} | ||||
|               <a | ||||
|                 className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|                 href="https://vid.werefox.dev/accounts/shadow8t4/video-channels" | ||||
|                 target="_blank" | ||||
|               > | ||||
|                 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"> | ||||
|               <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 | ||||
|                     src="/emoji/pen.svg" | ||||
|                     layout="fill" | ||||
|                     objectFit="contain" | ||||
|                     alt="Pen emoji" | ||||
|                   /> | ||||
|                 </span> | ||||
|               </a>{" "} | ||||
|               My poetry{" "} | ||||
|               <a | ||||
|                 className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|                 href="https://write.as/a-letter-to-the-void" | ||||
|                 target="_blank" | ||||
|               > | ||||
|                 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"> | ||||
|               <a href="https://werefox.dev" target="_blank"> | ||||
|                 <span className="animate-bounce relative inline-block w-6 h-6 align-middle"> | ||||
|                   <Image | ||||
|                     src="/emoji/page_with_pencil.svg" | ||||
|                     layout="fill" | ||||
|                     objectFit="contain" | ||||
|                     alt="A piece of paper with a pencil emoji" | ||||
|                   /> | ||||
|                 </span> | ||||
|               </a>{" "} | ||||
|               My (often outdated) blog{" "} | ||||
|               <a | ||||
|                 className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|                 href="https://werefox.dev" | ||||
|                 target="_blank" | ||||
|               > | ||||
|                 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"> | ||||
|               <a href="mailto:adh9694@gmail.com" target=""> | ||||
|                 <span className="animate-bounce relative inline-block w-6 h-6 align-middle"> | ||||
|                   <Image | ||||
|                     src="/emoji/inbox.svg" | ||||
|                     layout="fill" | ||||
|                     objectFit="contain" | ||||
|                     alt="Inbox emoji" | ||||
|                   /> | ||||
|                 </span> | ||||
|               </a>{" "} | ||||
|               My e-mail{" "} | ||||
|               <a | ||||
|                 className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|                 href="mailto:adh9694@gmail.com" | ||||
|                 target="_blank" | ||||
|               > | ||||
|                 adh9694@gmail.com | ||||
|               </a> | ||||
|             </p> | ||||
|           </div> | ||||
|       <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 | ||||
|                   src="/emoji/mastodon-logo.png" | ||||
|                   layout="fill" | ||||
|                   objectFit="contain" | ||||
|                   alt="Mastodon logo" | ||||
|                 /> | ||||
|               </span> | ||||
|             </a>{" "} | ||||
|             My public Mastodon{" "} | ||||
|             <a | ||||
|               className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|               href="https://vulpine.club/@shadow8t4" | ||||
|               target="_blank" | ||||
|             > | ||||
|               @shadow8t4@vulpine.club | ||||
|             </a> | ||||
|           </p> | ||||
|           <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 | ||||
|                   src="/emoji/twitter-logo.png" | ||||
|                   layout="fill" | ||||
|                   objectFit="contain" | ||||
|                   alt="Twitter logo" | ||||
|                 /> | ||||
|               </span> | ||||
|             </a>{" "} | ||||
|             My Twitter{" "} | ||||
|             <a | ||||
|               className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|               href="https://twitter.com/alexis_werefox" | ||||
|               target="_blank" | ||||
|             > | ||||
|               @alexis_werefox | ||||
|             </a> | ||||
|           </p> | ||||
|           <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 | ||||
|                   src="/emoji/twitch-logo.png" | ||||
|                   layout="fill" | ||||
|                   objectFit="contain" | ||||
|                   alt="Twitch logo" | ||||
|                 /> | ||||
|               </span> | ||||
|             </a>{" "} | ||||
|             My Twitch{" "} | ||||
|             <a | ||||
|               className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|               href="https://www.twitch.tv/alexis_werefox" | ||||
|               target="_blank" | ||||
|             > | ||||
|               @Alexis_Werefox | ||||
|             </a> | ||||
|           </p> | ||||
|           <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" | ||||
|             > | ||||
|               <span className="animate-bounce relative inline-block w-6 h-6 align-middle"> | ||||
|                 <Image | ||||
|                   src="/emoji/vhs.svg" | ||||
|                   layout="fill" | ||||
|                   objectFit="contain" | ||||
|                   alt="VHS tape emoji" | ||||
|                 /> | ||||
|               </span> | ||||
|             </a>{" "} | ||||
|             My PeerTube (mostly VODs from the stream){" "} | ||||
|             <a | ||||
|               className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|               href="https://vid.werefox.dev/accounts/shadow8t4/video-channels" | ||||
|               target="_blank" | ||||
|             > | ||||
|               vid.werefox.dev | ||||
|             </a> | ||||
|           </p> | ||||
|           <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 | ||||
|                   src="/emoji/pen.svg" | ||||
|                   layout="fill" | ||||
|                   objectFit="contain" | ||||
|                   alt="Pen emoji" | ||||
|                 /> | ||||
|               </span> | ||||
|             </a>{" "} | ||||
|             My poetry{" "} | ||||
|             <a | ||||
|               className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|               href="https://write.as/a-letter-to-the-void" | ||||
|               target="_blank" | ||||
|             > | ||||
|               write.as/a-letter-to-the-void | ||||
|             </a> | ||||
|           </p> | ||||
|           <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 | ||||
|                   src="/emoji/page_with_pencil.svg" | ||||
|                   layout="fill" | ||||
|                   objectFit="contain" | ||||
|                   alt="A piece of paper with a pencil emoji" | ||||
|                 /> | ||||
|               </span> | ||||
|             </a>{" "} | ||||
|             My (often outdated) blog{" "} | ||||
|             <a | ||||
|               className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|               href="https://werefox.dev" | ||||
|               target="_blank" | ||||
|             > | ||||
|               werefox.dev | ||||
|             </a> | ||||
|           </p> | ||||
|           <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 | ||||
|                   src="/emoji/inbox.svg" | ||||
|                   layout="fill" | ||||
|                   objectFit="contain" | ||||
|                   alt="Inbox emoji" | ||||
|                 /> | ||||
|               </span> | ||||
|             </a>{" "} | ||||
|             My e-mail{" "} | ||||
|             <a | ||||
|               className="animate-wiggle inline-flex transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" | ||||
|               href="mailto:adh9694@gmail.com" | ||||
|               target="_blank" | ||||
|             > | ||||
|               adh9694@gmail.com | ||||
|             </a> | ||||
|           </p> | ||||
|         </div> | ||||
|       </WCard> | ||||
|     </BasicPage> | ||||
|  |  | |||
|  | @ -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> | ||||
|   ); | ||||
| } | ||||
|  |  | |||
|  | @ -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> | ||||
|   ); | ||||
|  |  | |||
|  | @ -1,28 +1,24 @@ | |||
| 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={{ | ||||
|             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.`, | ||||
|             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!)` | ||||
|           }} | ||||
|           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> | ||||
|       <IDCard | ||||
|         title="Alexis Werefox" | ||||
|         info={{ | ||||
|           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.`, | ||||
|           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!)`, | ||||
|         }} | ||||
|         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." | ||||
|       /> | ||||
|     </BasicPage> | ||||
|   ); | ||||
| } | ||||
|  |  | |||
|  | @ -1,22 +1,19 @@ | |||
| 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={{ | ||||
|             info: `This is a bit of a generalized term to mean someone who identifies primarily feminine.`, | ||||
|             more: `I do personally identify as a girl, but this is a bit more of a P.C. term to use!`, | ||||
|           }} | ||||
|           url="https://gender.wikia.org/wiki/Transfeminine" | ||||
|           src="/emoji/transgender_flag.svg" | ||||
|           alt="The transgender flag" | ||||
|         /> | ||||
|       </WCard> | ||||
|       <IDCard | ||||
|         title="Trans-femme" | ||||
|         info={{ | ||||
|           info: `This is a bit of a generalized term to mean someone who identifies primarily feminine.`, | ||||
|           more: `I do personally identify as a girl, but this is a bit more of a P.C. term to use!`, | ||||
|         }} | ||||
|         url="https://gender.wikia.org/wiki/Transfeminine" | ||||
|         src="/emoji/transgender_flag.svg" | ||||
|         alt="The transgender flag" | ||||
|       /> | ||||
|     </BasicPage> | ||||
|   ); | ||||
| } | ||||
|  |  | |||
|  | @ -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,27 +7,25 @@ export default function Neurodiversity() { | |||
|       page_title="Neurodiversity, Fam" | ||||
|       card_title="I'm Neurodivergent!" | ||||
|     > | ||||
|       <WCard> | ||||
|         <IDCard | ||||
|           title="ADHD" | ||||
|           info={{ | ||||
|             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.`, | ||||
|             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!`, | ||||
|             symptom2: `- Impulsiveness`, | ||||
|             symptom3: `- Impaired ability to multitask`, | ||||
|             symptom4: `- Time management issues`, | ||||
|             symptom5: `- Difficulty remembering things (especially details and things we don't find stimulating)`, | ||||
|             symptom6: `- Emotional dysregularity (we have trouble regulating our emotions!)`, | ||||
|             symptom7: `- Last, but not least, is something called "rejection sensitivity", which can be hard to explain, and 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!`, | ||||
|           }} | ||||
|           url="https://www.youtube.com/channel/UC-nPM1_kSZf91ZGkcgy_95Q" | ||||
|           src="/emoji/neurodiversity.svg" | ||||
|           alt="The neurodiversity symbol" | ||||
|         /> | ||||
|       </WCard> | ||||
|       <IDCard | ||||
|         title="ADHD" | ||||
|         info={{ | ||||
|           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.`, | ||||
|           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!`, | ||||
|           symptom2: `- Impulsiveness`, | ||||
|           symptom3: `- Impaired ability to multitask`, | ||||
|           symptom4: `- Time management issues`, | ||||
|           symptom5: `- Difficulty remembering things (especially details and things we don't find stimulating)`, | ||||
|           symptom6: `- Emotional dysregularity (we have trouble regulating our emotions!)`, | ||||
|           symptom7: `- Last, but not least, is something called "rejection sensitivity", which can be hard to explain, and 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!`, | ||||
|         }} | ||||
|         url="https://www.youtube.com/channel/UC-nPM1_kSZf91ZGkcgy_95Q" | ||||
|         src="/emoji/neurodiversity.svg" | ||||
|         alt="The neurodiversity symbol" | ||||
|       /> | ||||
|     </BasicPage> | ||||
|   ); | ||||
| } | ||||
|  |  | |||
|  | @ -1,64 +1,43 @@ | |||
| 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" | ||||
|             alt="Blue heart emoji" | ||||
|           > | ||||
|             {Object.keys(PARTNERS).map((partner) => ( | ||||
|               <LCard | ||||
|                 key={PARTNERS[partner].url} | ||||
|                 src={PARTNERS[partner].avi} | ||||
|                 alt={`${partner}'s Avatar`} | ||||
|                 url={PARTNERS[partner].url} | ||||
|                 user={partner} | ||||
|                 fields={PARTNERS[partner].fields} | ||||
|                 bio={PARTNERS[partner].bio} | ||||
|               ></LCard> | ||||
|             ))} | ||||
|           </IDCard> | ||||
|         </WCard> | ||||
|         <IDCard | ||||
|           title="My loves!" | ||||
|           src="/emoji/blue_heart.svg" | ||||
|           alt="Blue heart emoji" | ||||
|         > | ||||
|           {Object.keys(PARTNERS).map((partner) => ( | ||||
|             <LCard | ||||
|               key={PARTNERS[partner].url} | ||||
|               src={PARTNERS[partner].avi} | ||||
|               alt={`${partner}'s Avatar`} | ||||
|               url={PARTNERS[partner].url} | ||||
|               user={partner} | ||||
|               fields={PARTNERS[partner].fields} | ||||
|               bio={PARTNERS[partner].bio} | ||||
|             ></LCard> | ||||
|           ))} | ||||
|         </IDCard> | ||||
|       </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> | ||||
|         <IDCard | ||||
|           title="My loves!" | ||||
|           src="/emoji/blue_heart.svg" | ||||
|           alt="Blue heart emoji" | ||||
|           info={{ | ||||
|             info: `Oh! It looks like I don't have any partners at the moment.`, | ||||
|             more: `Oh well!`, | ||||
|           }} | ||||
|         ></IDCard> | ||||
|       </BasicPage> | ||||
|     ); | ||||
|   } | ||||
|  |  | |||
|  | @ -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,19 +7,17 @@ export default function Pronouns() { | |||
|       page_title="What are your pronouns?" | ||||
|       card_title="Pronouns! Important!" | ||||
|     > | ||||
|       <WCard> | ||||
|         <IDCard | ||||
|           title="She / Her" | ||||
|           info={{ | ||||
|             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!`, | ||||
|             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."`, | ||||
|           }} | ||||
|           url="https://pronouns.me/she" | ||||
|           src="/emoji/speech_bubble_left.svg" | ||||
|           alt="A speech bubble emoji" | ||||
|         /> | ||||
|       </WCard> | ||||
|       <IDCard | ||||
|         title="She / Her" | ||||
|         info={{ | ||||
|           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!`, | ||||
|           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."`, | ||||
|         }} | ||||
|         url="https://pronouns.me/she" | ||||
|         src="/emoji/speech_bubble_left.svg" | ||||
|         alt="A speech bubble emoji" | ||||
|       /> | ||||
|     </BasicPage> | ||||
|   ); | ||||
| } | ||||
|  |  | |||
|  | @ -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,38 +7,36 @@ export default function Sexuality() { | |||
|       page_title="What's My Sexuality?" | ||||
|       card_title="Sexuality Details!" | ||||
|     > | ||||
|       <WCard> | ||||
|         <IDCard | ||||
|           title="Polyamory" | ||||
|           info={{ | ||||
|             info: `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.`, | ||||
|           }} | ||||
|           url="https://lgbta.wikia.org/wiki/Polyamorous" | ||||
|           src="/emoji/polyamory_flag.svg" | ||||
|           alt="The polyamory flag" | ||||
|         /> | ||||
|         <IDCard | ||||
|           title="Pansexual" | ||||
|           info={{ | ||||
|             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.`, | ||||
|           }} | ||||
|           url="https://lgbta.wikia.org/wiki/Pansexual" | ||||
|           src="/emoji/pansexual_flag.svg" | ||||
|           alt="The pansexual flag" | ||||
|         /> | ||||
|         <IDCard | ||||
|           title="Lesbian" | ||||
|           info={{ | ||||
|             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.`, | ||||
|           }} | ||||
|           url="https://lgbta.wikia.org/wiki/Lesbian" | ||||
|           src="/emoji/lesbian_flag.svg" | ||||
|           alt="The lesbian flag" | ||||
|         /> | ||||
|       </WCard> | ||||
|       <IDCard | ||||
|         title="Polyamory" | ||||
|         info={{ | ||||
|           info: `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.`, | ||||
|         }} | ||||
|         url="https://lgbta.wikia.org/wiki/Polyamorous" | ||||
|         src="/emoji/polyamory_flag.svg" | ||||
|         alt="The polyamory flag" | ||||
|       /> | ||||
|       <IDCard | ||||
|         title="Pansexual" | ||||
|         info={{ | ||||
|           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.`, | ||||
|         }} | ||||
|         url="https://lgbta.wikia.org/wiki/Pansexual" | ||||
|         src="/emoji/pansexual_flag.svg" | ||||
|         alt="The pansexual flag" | ||||
|       /> | ||||
|       <IDCard | ||||
|         title="Lesbian" | ||||
|         info={{ | ||||
|           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.`, | ||||
|         }} | ||||
|         url="https://lgbta.wikia.org/wiki/Lesbian" | ||||
|         src="/emoji/lesbian_flag.svg" | ||||
|         alt="The lesbian flag" | ||||
|       /> | ||||
|     </BasicPage> | ||||
|   ); | ||||
| } | ||||
|  |  | |||
|  | @ -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"> | ||||
|             <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> | ||||
|           </div> | ||||
|         </div> | ||||
|       <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> | ||||
|       </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> | ||||
|   ); | ||||
|  |  | |||
|  | @ -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
									
								
							
							
						
						
									
										13
									
								
								src/info/pages/projects/services/index.js
									
									
									
									
									
										Normal 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> | ||||
|   ); | ||||
| } | ||||
|  | @ -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> | ||||
|  |  | |||
|  | @ -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 | ||||
|         innerText={`Sometimes, people say some nice things about me. Here are some
 | ||||
|         examples!`}
 | ||||
|       > | ||||
|         {Object.keys(TESTIMONIALS).map((user) => ( | ||||
|           <TCard | ||||
|             key={TESTIMONIALS[user].url} | ||||
|             src={iconUrls[user]} | ||||
|             alt={`${user}'s Avatar`} | ||||
|             url={TESTIMONIALS[user].url} | ||||
|             user={user} | ||||
|             innerText={TESTIMONIALS[user].content} | ||||
|           /> | ||||
|         ))} | ||||
|       </WCard> | ||||
|       {Object.keys(USERS).map((user) => ( | ||||
|         <TCard | ||||
|           key={USERS[user].url} | ||||
|           src={iconUrls[user]} | ||||
|           alt={`${user}'s Avatar`} | ||||
|           url={USERS[user].url} | ||||
|           user={user} | ||||
|           innerText={USERS[user].content} | ||||
|         /> | ||||
|       ))} | ||||
|     </BasicPage> | ||||
|   ); | ||||
| } | ||||
|  |  | |||
							
								
								
									
										1
									
								
								src/info/public/emoji/crt_blue_screen.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										1
									
								
								src/info/public/emoji/crt_blue_screen.svg
									
									
									
									
									
										Normal 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> | ||||
| After Width: | Height: | Size: 1.2 KiB | 
		Loading…
	
		Reference in a new issue
	
	 Alexis Werefox
						Alexis Werefox