Updated theme stuff.
This commit is contained in:
parent
829bf457f6
commit
3562b47453
@ -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" />
|
||||||
|
@ -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,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,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">
|
||||||
|
@ -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>
|
||||||
|
@ -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
|
||||||
|
@ -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" />
|
||||||
|
@ -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
|
||||||
|
@ -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>
|
||||||
|
@ -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,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>
|
||||||
|
@ -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,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}
|
||||||
|
@ -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
|
||||||
|
@ -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,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>
|
||||||
|
@ -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>
|
||||||
|
@ -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) => (
|
||||||
|
@ -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}
|
||||||
|
@ -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">
|
||||||
|
@ -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"
|
||||||
|
@ -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>
|
||||||
|
@ -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>
|
||||||
|
@ -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>
|
||||||
|
@ -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>
|
||||||
|
@ -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>
|
||||||
|
@ -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>
|
||||||
|
@ -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>
|
||||||
|
@ -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>
|
||||||
|
@ -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%",
|
||||||
|
Loading…
Reference in New Issue
Block a user