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

Updated theme stuff.

This commit is contained in:
Alexis Werefox 2021-10-27 04:47:29 +00:00
parent 829bf457f6
commit 3562b47453
30 changed files with 61 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/info/components/basic-page.js
View File

@ -32,7 +32,7 @@ export default function BasicPage({
const url = Boolean(back_url) ? back_url : "/"; const url = Boolean(back_url) ? back_url : "/";
return ( return (
<div className="min-h-screen bg-werefox-grey-light dark:bg-werefox-grey font-nerd"> <div className="min-h-screen bg-skye-werefox-grey-light dark:bg-skye-werefox-grey font-nerd">
<Head> <Head>
<title>{page_title}</title> <title>{page_title}</title>
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />

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

@ -6,7 +6,7 @@ export default function ContactsLink({ src, alt, url, description, url_text }) {
<div> <div>
<Link href={url}> <Link href={url}>
<a target="_blank"> <a target="_blank">
<div className="p-2 md:text-lg sm:text-md text-xs text-center rounded-sm ring-2 ring-werefox-blue-dark dark:ring-werefox-blue hover:ring-werefox-pink-dark dark:hover:ring-werefox-pink text-werefox-blue-dark dark:text-werefox-blue hover:text-werefox-pink-dark dark:hover:text-werefox-pink hover:animate-yip transition"> <div className="p-2 md:text-lg sm:text-md text-xs text-center rounded-sm ring-2 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue hover:ring-skye-werefox-pink-dark dark:hover:ring-skye-werefox-pink text-skye-werefox-blue-dark dark:text-skye-werefox-blue hover:text-skye-werefox-pink-dark dark:hover:text-skye-werefox-pink hover:animate-yip transition">
<span className="animate-bounce relative inline-block w-6 h-6 align-middle"> <span className="animate-bounce relative inline-block w-6 h-6 align-middle">
<Image src={src} layout="fill" objectFit="contain" alt={alt} /> <Image src={src} layout="fill" objectFit="contain" alt={alt} />
</span>{" "} </span>{" "}

2
src/info/components/faq-block.js
View File

@ -2,7 +2,7 @@ import FCard from "./faq-card";
export default function FAQBlock({ faqs }) { export default function FAQBlock({ faqs }) {
return ( return (
<div className="p-4 space-y-4 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lightest dark:bg-werefox-grey-dark"> <div className="p-4 space-y-4 rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker bg-skye-werefox-grey-lightest dark:bg-skye-werefox-grey-dark">
{Object.keys(faqs).map((faq) => ( {Object.keys(faqs).map((faq) => (
<FCard <FCard
key={faq} key={faq}

6
src/info/components/faq-card.js
View File

@ -6,12 +6,12 @@ export default function TestimonialCard({ question, answer, src, alt }) {
return ( return (
<div className="space-y-2"> <div className="space-y-2">
<div className="ring-2 ring-werefox-pink-dark dark:ring-werefox-pink"> <div className="ring-2 ring-skye-werefox-pink-dark dark:ring-skye-werefox-pink">
<p className="p-8 text-center text-lg sm:text-xl text-werefox-pink-dark dark:text-werefox-pink"> <p className="p-8 text-center text-lg sm:text-xl text-skye-werefox-pink-dark dark:text-skye-werefox-pink">
{question} {question}
</p> </p>
</div> </div>
<div className=" ring-2 ring-werefox-blue-dark dark:ring-werefox-blue hover:ring-werefox-pink-dark dark:hover:ring-werefox-pink text-werefox-blue-dark dark:text-werefox-blue hover:text-werefox-pink-dark dark:hover:text-werefox-pink hover:animate-yip transition"> <div className=" ring-2 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue hover:ring-skye-werefox-pink-dark dark:hover:ring-skye-werefox-pink text-skye-werefox-blue-dark dark:text-skye-werefox-blue hover:text-skye-werefox-pink-dark dark:hover:text-skye-werefox-pink hover:animate-yip transition">
<Link href="https://vulpine.club/@shadow8t4"> <Link href="https://vulpine.club/@shadow8t4">
<a target="_blank"> <a target="_blank">
<div className="p-2 flex"> <div className="p-2 flex">

2
src/info/components/footer-button.js
View File

@ -7,7 +7,7 @@ export default function footerButton({ url, inner_text, is_external }) {
<div className="flex-1 overflow-visible"> <div className="flex-1 overflow-visible">
<Link href={url}> <Link href={url}>
<a target={target}> <a target={target}>
<div className="ml-1 mr-1 rounded-sm ring-2 ring-werefox-blue-dark dark:ring-werefox-blue hover:ring-werefox-pink-dark dark:hover:ring-werefox-pink text-werefox-blue-darker dark:text-werefox-blue hover:text-werefox-pink-dark dark:hover:text-werefox-pink transition"> <div className="ml-1 mr-1 rounded-sm ring-2 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue hover:ring-skye-werefox-pink-dark dark:hover:ring-skye-werefox-pink text-skye-werefox-blue-darker dark:text-skye-werefox-blue hover:text-skye-werefox-pink-dark dark:hover:text-skye-werefox-pink transition">
<p className="pl-2 pr-2 text-center sm:text-md text-sm"> <p className="pl-2 pr-2 text-center sm:text-md text-sm">
{inner_text} {inner_text}
</p> </p>

6
src/info/components/footer-card.js
View File

@ -1,8 +1,8 @@
import FButton from "./footer-button"; import FButton from "./footer-button";
export default function FooterCard() { export default function FooterCard() {
return ( return (
<footer className="p-4 space-y-2 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lightest dark:bg-werefox-grey-dark"> <footer className="p-4 space-y-2 rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker bg-skye-werefox-grey-lightest dark:bg-skye-werefox-grey-dark">
<div className="flex text-werefox-blue-darker dark:text-werefox-blue"> <div className="flex text-skye-werefox-blue-darker dark:text-skye-werefox-blue">
<div className="flex-1"></div> <div className="flex-1"></div>
<FButton <FButton
url="https://info.werefox.dev/contacts" url="https://info.werefox.dev/contacts"
@ -16,7 +16,7 @@ export default function FooterCard() {
/> />
<div className="flex-1"></div> <div className="flex-1"></div>
</div> </div>
<div className="text-center text-xs text-werefox-grey-darkest dark:text-werefox-grey-lightest"> <div className="text-center text-xs text-skye-werefox-grey-darkest dark:text-skye-werefox-grey-lightest">
This site uses{" "} This site uses{" "}
<div className="inline-block pt-1 pb-1"> <div className="inline-block pt-1 pb-1">
<FButton <FButton

2
src/info/components/home-page.js
View File

@ -4,7 +4,7 @@ import FCard from "../components/footer-card";
export default function HomePage({ page_title, card_title, children }) { export default function HomePage({ page_title, card_title, children }) {
return ( return (
<div className="min-h-screen bg-werefox-grey-light dark:bg-werefox-grey font-nerd"> <div className="min-h-screen bg-skye-werefox-grey-light dark:bg-skye-werefox-grey font-nerd">
<Head> <Head>
<title>{page_title}</title> <title>{page_title}</title>
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />

2
src/info/components/identity-button.js
View File

@ -16,7 +16,7 @@ export default function IdentityButton({
<div className="animate-wiggle container max-w-sm mx-auto md:px-2 p-2"> <div className="animate-wiggle container max-w-sm mx-auto md:px-2 p-2">
<Link href={`${url}${maybeLocator}`}> <Link href={`${url}${maybeLocator}`}>
<a <a
className={`${extraClasses} block text-lg text-center rounded-sm ring-2 ring-werefox-blue-dark dark:ring-werefox-blue hover:ring-werefox-pink-dark dark:hover:ring-werefox-pink text-werefox-blue-dark dark:text-werefox-blue hover:text-werefox-pink-dark dark:hover:text-werefox-pink hover:animate-yip transition`} className={`${extraClasses} block text-lg text-center rounded-sm ring-2 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue hover:ring-skye-werefox-pink-dark dark:hover:ring-skye-werefox-pink text-skye-werefox-blue-dark dark:text-skye-werefox-blue hover:text-skye-werefox-pink-dark dark:hover:text-skye-werefox-pink hover:animate-yip transition`}
> >
{images.map((source) => ( {images.map((source) => (
<span <span

2
src/info/components/identity-card-button.js
View File

@ -5,7 +5,7 @@ export default function IdentityCardButton({ url, button_text }) {
<div> <div>
<Link href={url}> <Link href={url}>
<a target="_blank"> <a target="_blank">
<div className="p-4 hover:text-werefox-pink-dark dark:hover:text-werefox-pink ring-2 ring-werefox-blue-dark dark:ring-werefox-blue hover:ring-werefox-pink-dark dark:hover:ring-werefox-pink hover:animate-yip transition"> <div className="p-4 hover:text-skye-werefox-pink-dark dark:hover:text-skye-werefox-pink ring-2 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue hover:ring-skye-werefox-pink-dark dark:hover:ring-skye-werefox-pink hover:animate-yip transition">
{button_text} {button_text}
</div> </div>
</a> </a>

2
src/info/components/identity-card-textbox.js
View File

@ -7,7 +7,7 @@ export default function IdentityCardTextBox({ info }) {
infodict = Object.assign({}, infoarray); infodict = Object.assign({}, infoarray);
} }
return ( return (
<div className="p-4 text-center text-md sm:text-lg ring-2 ring-werefox-blue-dark dark:ring-werefox-blue"> <div className="p-4 text-center text-md sm:text-lg ring-2 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue">
{Object.keys(infodict).map((i) => ( {Object.keys(infodict).map((i) => (
<p className="overflow-auto" key={i}> <p className="overflow-auto" key={i}>
{infodict[i] == "" ? <br /> : infodict[i]} {infodict[i] == "" ? <br /> : infodict[i]}

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

@ -2,7 +2,7 @@ import WCard from "./werefox-card";
export default function IdentityCard({ title, src, alt, children }) { export default function IdentityCard({ title, src, alt, children }) {
return ( return (
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey"> <div className="rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker bg-skye-werefox-grey-light dark:bg-skye-werefox-grey">
<WCard title={title} title_emoji={{ src: `${src}`, alt: `${alt}` }}> <WCard title={title} title_emoji={{ src: `${src}`, alt: `${alt}` }}>
{children} {children}
</WCard> </WCard>

2
src/info/components/introduction-card.js
View File

@ -4,7 +4,7 @@ export default function introductionCard({ introduction }) {
{Object.keys(introduction).map((info) => ( {Object.keys(introduction).map((info) => (
<p <p
key={info} key={info}
className="overflow-wrap w-full text-lg text-center text-werefox-blue-dark dark:text-werefox-blue" className="overflow-wrap w-full text-lg text-center text-skye-werefox-blue-dark dark:text-skye-werefox-blue"
> >
{introduction[info]} {introduction[info]}
</p> </p>

4
src/info/components/kofi-donation-widget.js
View File

@ -4,11 +4,11 @@ export default function KofiDonationWidget({ title, url }) {
return ( return (
<div className="pb-6 flex justify-center"> <div className="pb-6 flex justify-center">
<details className="rounded-lg p-1 overflow-auto"> <details className="rounded-lg p-1 overflow-auto">
<summary className="p-2 pl-4 pr-4 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker text-md text-center text-werefox-grey-darker dark:text-werefox-grey-lighter bg-werefox-blue dark:bg-werefox-blue-dark transition hover:bg-werefox-blue-light dark:hover:bg-werefox-blue-darker"> <summary className="p-2 pl-4 pr-4 rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker text-md text-center text-skye-werefox-grey-darker dark:text-skye-werefox-grey-lighter bg-skye-werefox-blue dark:bg-skye-werefox-blue-dark transition hover:bg-skye-werefox-blue-light dark:hover:bg-skye-werefox-blue-darker">
<strong>{title}</strong> <strong>{title}</strong>
</summary> </summary>
<div className="pt-2"> <div className="pt-2">
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker overflow-auto"> <div className="rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker overflow-auto">
<Iframe <Iframe
className="rounded-lg w-96 min-w-96" className="rounded-lg w-96 min-w-96"
url={url} url={url}

4
src/info/components/page-button.js
View File

@ -13,7 +13,7 @@ export default function PageButton({
<div> <div>
<Link href={url}> <Link href={url}>
<a <a
className={`${extra_classes} p-2 w-full inline-block text-lg text-center rounded-sm ring-2 bg-werefox-grey-lightest dark:bg-werefox-grey-dark ring-werefox-blue-dark dark:ring-werefox-blue hover:ring-werefox-pink-dark dark:hover:ring-werefox-pink text-werefox-blue-dark dark:text-werefox-blue hover:text-werefox-pink-dark dark:hover:text-werefox-pink focus:text-werefox-pink-dark dark:focus:text-werefox-pink hover:animate-yip transition`} className={`${extra_classes} p-2 w-full inline-block text-lg text-center rounded-sm ring-2 bg-skye-werefox-grey-lightest dark:bg-skye-werefox-grey-dark ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue hover:ring-skye-werefox-pink-dark dark:hover:ring-skye-werefox-pink text-skye-werefox-blue-dark dark:text-skye-werefox-blue hover:text-skye-werefox-pink-dark dark:hover:text-skye-werefox-pink focus:text-skye-werefox-pink-dark dark:focus:text-skye-werefox-pink hover:animate-yip transition`}
target="_blank" target="_blank"
> >
{images.map((source) => ( {images.map((source) => (
@ -39,7 +39,7 @@ export default function PageButton({
<div> <div>
<Link href={url}> <Link href={url}>
<a <a
className={`${extra_classes} p-2 w-full inline-block text-lg text-center rounded-sm ring-2 bg-werefox-grey-lightest dark:bg-werefox-grey-dark ring-werefox-blue-dark dark:ring-werefox-blue hover:ring-werefox-pink-dark dark:hover:ring-werefox-pink text-werefox-blue-dark dark:text-werefox-blue hover:text-werefox-pink-dark dark:hover:text-werefox-pink focus:text-werefox-pink-dark dark:focus:text-werefox-pink hover:animate-yip transition`} className={`${extra_classes} p-2 w-full inline-block text-lg text-center rounded-sm ring-2 bg-skye-werefox-grey-lightest dark:bg-skye-werefox-grey-dark ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue hover:ring-skye-werefox-pink-dark dark:hover:ring-skye-werefox-pink text-skye-werefox-blue-dark dark:text-skye-werefox-blue hover:text-skye-werefox-pink-dark dark:hover:text-skye-werefox-pink focus:text-skye-werefox-pink-dark dark:focus:text-skye-werefox-pink hover:animate-yip transition`}
> >
{images.map((source) => ( {images.map((source) => (
<span <span

4
src/info/components/project-card.js
View File

@ -14,7 +14,7 @@ export default function projectCard({
<div> <div>
<Link href={url}> <Link href={url}>
<a target="_blank"> <a target="_blank">
<li className="p-4 space-y-2 rounded-sm ring-2 text-werefox-blue-dark dark:text-werefox-blue hover:text-werefox-pink-dark dark:hover:text-werefox-pink ring-werefox-blue-dark dark:ring-werefox-blue hover:ring-werefox-pink-dark dark:hover:ring-werefox-pink hover:animate-yip transition"> <li className="p-4 space-y-2 rounded-sm ring-2 text-skye-werefox-blue-dark dark:text-skye-werefox-blue hover:text-skye-werefox-pink-dark dark:hover:text-skye-werefox-pink ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue hover:ring-skye-werefox-pink-dark dark:hover:ring-skye-werefox-pink hover:animate-yip transition">
<div className="text-lg text-center"> <div className="text-lg text-center">
<span className="animate-jiggle sm:w-6 sm:h-6 w-4 h-6 inline-block align-top"> <span className="animate-jiggle sm:w-6 sm:h-6 w-4 h-6 inline-block align-top">
<Image <Image
@ -37,7 +37,7 @@ export default function projectCard({
<div> <div>
<Link href={url}> <Link href={url}>
<a> <a>
<li className="p-4 space-y-2 rounded-sm ring-2 text-werefox-blue-dark dark:text-werefox-blue hover:text-werefox-pink-dark dark:hover:text-werefox-pink ring-werefox-blue-dark dark:ring-werefox-blue hover:ring-werefox-pink-dark dark:hover:ring-werefox-pink hover:animate-yip transition"> <li className="p-4 space-y-2 rounded-sm ring-2 text-skye-werefox-blue-dark dark:text-skye-werefox-blue hover:text-skye-werefox-pink-dark dark:hover:text-skye-werefox-pink ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue hover:ring-skye-werefox-pink-dark dark:hover:ring-skye-werefox-pink hover:animate-yip transition">
<div className="text-lg text-center"> <div className="text-lg text-center">
<span className="animate-jiggle sm:w-6 sm:h-6 w-4 h-6 inline-block align-top"> <span className="animate-jiggle sm:w-6 sm:h-6 w-4 h-6 inline-block align-top">
<Image <Image

4
src/info/components/server-block.js
View File

@ -4,14 +4,14 @@ import Link from "next/link";
export default function ServerBlock({ servers }) { export default function ServerBlock({ servers }) {
return ( return (
<div className="p-4 w-full inline-flow align-middle justify-center space-y-8"> <div className="p-4 w-full inline-flow align-middle justify-center space-y-8">
<div className="p-4 ring-2 ring-werefox-blue-dark dark:ring-werefox-blue"> <div className="p-4 ring-2 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue">
<p> <p>
All the stuff I run uses the following server machines with reverse All the stuff I run uses the following server machines with reverse
SSH connections to a{" "} SSH connections to a{" "}
<Link href="https://www.linode.com/?r=61251dc51397edcfacadd7f3744b258b63ad4248"> <Link href="https://www.linode.com/?r=61251dc51397edcfacadd7f3744b258b63ad4248">
<a <a
target="_blank" target="_blank"
className="transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink" className="transition hover:text-skye-werefox-pink-dark dark:hover:text-skye-werefox-pink"
> >
Linode VPS Linode VPS
</a> </a>

2
src/info/components/server-card.js
View File

@ -1,6 +1,6 @@
export default function ServerCard({ server, model, cpu, gpu, ram, os }) { export default function ServerCard({ server, model, cpu, gpu, ram, os }) {
return ( return (
<div className="p-2 space-y-1 w-full inline-flow text-left ring-4 ring-werefox-blue-darkest dark:ring-werefox-blue bg-werefox-grey-lightest dark:bg-werefox-grey-darker text-lg text-werefox-cyan-dark dark:text-werefox-cyan-light"> <div className="p-2 space-y-1 w-full inline-flow text-left ring-4 ring-skye-werefox-blue-darkest dark:ring-skye-werefox-blue bg-skye-werefox-grey-lightest dark:bg-skye-werefox-grey-darker text-lg text-ada-werefox-cyan-dark dark:text-ada-werefox-cyan-light">
<p> <p>
<code>{`System: ${server}`}</code> <code>{`System: ${server}`}</code>
</p> </p>

2
src/info/components/support-block.js
View File

@ -9,7 +9,7 @@ export default function SupportBlock({ support }) {
support my way!! 💙" support my way!! 💙"
> >
<div className="p-4 space-y-4"> <div className="p-4 space-y-4">
<p className="text-lg md:text-2xl text-center text-werefox-blue-dark dark:text-werefox-blue"> <p className="text-lg md:text-2xl text-center text-skye-werefox-blue-dark dark:text-skye-werefox-blue">
You could support me through Patreon, Ko-fi, or Liberapay You could support me through Patreon, Ko-fi, or Liberapay
</p> </p>
{Object.keys(support).map((sup) => ( {Object.keys(support).map((sup) => (

4
src/info/components/support-button.js
View File

@ -8,7 +8,7 @@ export default function SupportButton({ title, alt, src, url }) {
<div className="w-full justify-center flex"> <div className="w-full justify-center flex">
<Link href={url}> <Link href={url}>
<a target="_blank"> <a target="_blank">
<p className="rounded-lg pt-2 pb-2 pl-4 pr-4 w-full w-max-60 ring-2 ring-werefox-grey dark:ring-werefox-grey-darker text-lg text-center text-werefox-grey-darker dark:text-werefox-grey-lightest bg-werefox-blue dark:bg-werefox-blue-dark transition hover:bg-werefox-blue-light dark:hover:bg-werefox-blue-darker"> <p className="rounded-lg pt-2 pb-2 pl-4 pr-4 w-full w-max-60 ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker text-lg text-center text-skye-werefox-grey-darker dark:text-skye-werefox-grey-lightest bg-skye-werefox-blue dark:bg-skye-werefox-blue-dark transition hover:bg-skye-werefox-blue-light dark:hover:bg-skye-werefox-blue-darker">
<span className="inline-block h-6"> <span className="inline-block h-6">
<img alt={alt} src={src} className="inline-block h-6"></img> <img alt={alt} src={src} className="inline-block h-6"></img>
</span>{" "} </span>{" "}
@ -24,7 +24,7 @@ export default function SupportButton({ title, alt, src, url }) {
<Link href={url}> <Link href={url}>
<a <a
target="_blank" target="_blank"
className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker" className="rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker"
> >
<img <img
alt={alt} alt={alt}

2
src/info/components/testimonial-card.js
View File

@ -8,7 +8,7 @@ export default function TestimonialCard({ src, alt, url, innerText, user }) {
const testimonialdict = Object.assign({}, testimonialarray); const testimonialdict = Object.assign({}, testimonialarray);
return ( return (
<div className="rounded-sm ring-2 ring-werefox-pink-dark dark:ring-werefox-pink hover:ring-werefox-blue-dark dark:hover:ring-werefox-blue text-werefox-pink-dark dark:text-werefox-pink hover:text-werefox-blue-dark dark:hover:text-werefox-blue hover:animate-yip transition"> <div className="rounded-sm ring-2 ring-skye-werefox-pink-dark dark:ring-skye-werefox-pink hover:ring-skye-werefox-blue-dark dark:hover:ring-skye-werefox-blue text-skye-werefox-pink-dark dark:text-skye-werefox-pink hover:text-skye-werefox-blue-dark dark:hover:text-skye-werefox-blue hover:animate-yip transition">
<Link href={url}> <Link href={url}>
<a target="_blank"> <a target="_blank">
<div className="min-w-full flex overflow-hidden"> <div className="min-w-full flex overflow-hidden">

2
src/info/components/title-card.js
View File

@ -3,7 +3,7 @@ import Image from "next/image";
export default function TitleCard({ card_title }) { export default function TitleCard({ card_title }) {
return ( return (
<div className="p-4 w-full rounded-sm ring-4 ring-werefox-blue-dark dark:ring-werefox-blue bg-werefox-grey-lightest dark:bg-werefox-grey-dark text-xl text-center text-werefox-blue-dark dark:text-werefox-blue"> <div className="p-4 w-full rounded-sm ring-4 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue bg-skye-werefox-grey-lightest dark:bg-skye-werefox-grey-dark text-xl text-center text-skye-werefox-blue-dark dark:text-skye-werefox-blue">
<span className="animate-bounce align-middle inline-block w-6 h-6"> <span className="animate-bounce align-middle inline-block w-6 h-6">
<Image <Image
src="/emoji/pixel_alexis.png" src="/emoji/pixel_alexis.png"

8
src/info/components/werefox-card-title.js
View File

@ -3,7 +3,7 @@ import Image from "next/image";
export default function WerefoxCardTitle({ title, title_emoji }) { export default function WerefoxCardTitle({ title, title_emoji }) {
if (Boolean(title_emoji)) { if (Boolean(title_emoji)) {
return ( return (
<div className="p-4 w-full items-center justify-center align-middle rounded-sm ring-2 ring-werefox-blue-dark dark:ring-werefox-blue "> <div className="p-4 w-full items-center justify-center align-middle rounded-sm ring-2 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue ">
<span className="object-contain relative inline-block w-8 h-8 mb-1 align-middle"> <span className="object-contain relative inline-block w-8 h-8 mb-1 align-middle">
<Image <Image
src={title_emoji["src"]} src={title_emoji["src"]}
@ -12,15 +12,15 @@ export default function WerefoxCardTitle({ title, title_emoji }) {
alt={title_emoji["alt"]} alt={title_emoji["alt"]}
/> />
</span> </span>
<p className="inline text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue"> <p className="inline text-md sm:text-lg text-skye-werefox-blue-dark dark:text-skye-werefox-blue">
{` ${title}`} {` ${title}`}
</p> </p>
</div> </div>
); );
} else { } else {
return ( return (
<div className="rounded-sm ring-2 ring-werefox-blue-dark dark:ring-werefox-blue"> <div className="rounded-sm ring-2 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue">
<p className="p-4 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue"> <p className="p-4 text-center text-md sm:text-lg text-skye-werefox-blue-dark dark:text-skye-werefox-blue">
{title} {title}
</p> </p>
</div> </div>

8
src/info/components/werefox-card.js
View File

@ -3,18 +3,18 @@ import WCT from "./werefox-card-title";
export default function WerefoxCard({ title_emoji, title, children }) { export default function WerefoxCard({ title_emoji, title, children }) {
if (Boolean(title_emoji)) { if (Boolean(title_emoji)) {
return ( return (
<div className="p-4 space-y-4 text-center text-werefox-blue-dark dark:text-werefox-blue rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lightest dark:bg-werefox-grey-dark"> <div className="p-4 space-y-4 text-center text-skye-werefox-blue-dark dark:text-skye-werefox-blue rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker bg-skye-werefox-grey-lightest dark:bg-skye-werefox-grey-dark">
<WCT title={title} title_emoji={title_emoji} /> <WCT title={title} title_emoji={title_emoji} />
<div className="p-4 space-y-4 rounded-sm ring-2 ring-werefox-blue-dark dark:ring-werefox-blue"> <div className="p-4 space-y-4 rounded-sm ring-2 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue">
{children} {children}
</div> </div>
</div> </div>
); );
} else { } else {
return ( return (
<div className="p-4 space-y-4 text-center text-werefox-blue-dark dark:text-werefox-blue rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-lightest dark:bg-werefox-grey-dark"> <div className="p-4 space-y-4 text-center text-skye-werefox-blue-dark dark:text-skye-werefox-blue rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker bg-skye-werefox-grey-lightest dark:bg-skye-werefox-grey-dark">
<WCT title={title} /> <WCT title={title} />
<div className="p-4 space-y-4 rounded-sm ring-2 ring-werefox-blue-dark dark:ring-werefox-blue"> <div className="p-4 space-y-4 rounded-sm ring-2 ring-skye-werefox-blue-dark dark:ring-skye-werefox-blue">
{children} {children}
</div> </div>
</div> </div>

2
src/info/pages/hrt/index.js
View File

@ -47,7 +47,7 @@ export default function HRT({ startTimes }) {
page_button_title="Take me back home!" page_button_title="Take me back home!"
> >
<WCard title={`I'm so glad you're interested!!`}> <WCard title={`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"> <div className="p-2 sm:text-xl text-lg text-center text-skye-werefox-blue-dark dark:text-skye-werefox-blue grid grid-cols-1 grid-rows-4 gap-2">
<p>I've been on HRT for:</p> <p>I've been on HRT for:</p>
{Object.keys(timesArray).map((t) => ( {Object.keys(timesArray).map((t) => (
<p key={t}>{timesArray[t]}</p> <p key={t}>{timesArray[t]}</p>

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

@ -27,7 +27,7 @@ export default function Services({ PROJECTS }) {
card_title="Some stuff I do!" card_title="Some stuff I do!"
page_button_title="Take me back home!" page_button_title="Take me back home!"
> >
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey"> <div className="rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker bg-skye-werefox-grey-light dark:bg-skye-werefox-grey">
<PBlock title="Personal Projects" cards={PROJECTS} /> <PBlock title="Personal Projects" cards={PROJECTS} />
</div> </div>
</BasicPage> </BasicPage>

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

@ -31,7 +31,7 @@ export default function Services({ OTHER }) {
page_button_title="Take me back!" page_button_title="Take me back!"
back_url="/projects" back_url="/projects"
> >
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey"> <div className="rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker bg-skye-werefox-grey-light dark:bg-skye-werefox-grey">
<PBlock title="Miscelaneous Projects" cards={OTHER} /> <PBlock title="Miscelaneous Projects" cards={OTHER} />
</div> </div>
</BasicPage> </BasicPage>

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

@ -31,7 +31,7 @@ export default function Services({ PRIVATE }) {
page_button_title="Take me back!" page_button_title="Take me back!"
back_url="/projects" back_url="/projects"
> >
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey"> <div className="rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker bg-skye-werefox-grey-light dark:bg-skye-werefox-grey">
<PBlock title="Private Services" cards={PRIVATE} /> <PBlock title="Private Services" cards={PRIVATE} />
</div> </div>
</BasicPage> </BasicPage>

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

@ -31,7 +31,7 @@ export default function Services({ SERVICES }) {
page_button_title="Take me back!" page_button_title="Take me back!"
back_url="/projects" back_url="/projects"
> >
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey"> <div className="rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker bg-skye-werefox-grey-light dark:bg-skye-werefox-grey">
<PBlock title="Services" cards={SERVICES} /> <PBlock title="Services" cards={SERVICES} />
</div> </div>
</BasicPage> </BasicPage>

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

@ -31,7 +31,7 @@ export default function Services({ STREAMING }) {
page_button_title="Take me back!" page_button_title="Take me back!"
back_url="/projects" back_url="/projects"
> >
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey"> <div className="rounded-lg ring-2 ring-skye-werefox-grey dark:ring-skye-werefox-grey-darker bg-skye-werefox-grey-light dark:bg-skye-werefox-grey">
<PBlock title="Streaming" cards={STREAMING} /> <PBlock title="Streaming" cards={STREAMING} />
</div> </div>
</BasicPage> </BasicPage>

21
src/info/tailwind.config.js
View File

@ -7,25 +7,25 @@ module.exports = {
nerd: ["DejaVuSansMono"], nerd: ["DejaVuSansMono"],
}, },
colors: { colors: {
"werefox-cyan": { "ada-werefox-cyan": {
light: "#AAFFFF", light: "#AAFFFF",
DEFAULT: "#50FFFF", DEFAULT: "#50FFFF",
dark: "#008888", dark: "#008888",
}, },
"werefox-blue": { "skye-werefox-blue": {
light: "#94C2FF", light: "#94C2FF",
DEFAULT: "#75B1FF", DEFAULT: "#75B1FF",
dark: "#0052B8", dark: "#0052B8",
darker: "#00377A", darker: "#00377A",
darkest: "#00326B", darkest: "#00326B",
}, },
"werefox-pink": { "skye-werefox-pink": {
DEFAULT: "#FF84CA", DEFAULT: "#FF84CA",
dark: "#9E0054", dark: "#9E0054",
darker: "#8A0040", darker: "#8A0040",
darkest: "#75003F", darkest: "#75003F",
}, },
"werefox-grey": { "skye-werefox-grey": {
lightest: "#EEE", lightest: "#EEE",
lighter: "#DBDBDB", lighter: "#DBDBDB",
light: "#CCC", light: "#CCC",
@ -33,6 +33,19 @@ module.exports = {
dark: "#242424", dark: "#242424",
darker: "#121212", darker: "#121212",
}, },
"alice-werefox-red": {
light: "#FFCCCF",
DEFAULT: "#FF8F94",
dark: "#800008",
darker: "#550006",
darkest: "#7A0000",
},
"alice-werefox-blue": {
DEFAULT: "#B6A3FF",
dark: "#3300FF",
darker: "#2C00DB",
darkest: "#2700C2",
},
}, },
flex: { flex: {
5: "5 5 0%", 5: "5 5 0%",