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

Finished up the partners page.

Browse Source
This commit is contained in:
Alexis Werefox 2021-04-26 02:18:47 +00:00
parent 5e5a86f79f
commit f120dd2bd4
5 changed files with 111 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

70
src/info/components/love-card.js
View File

@ -1,8 +1,42 @@
import Link from "next/link";
export default function TestimonialCard({ src, alt, url, innerText, user }) {
const finalsrc = Boolean(src) ? src : "/images/werefox_logo.png";
const isMe = (user == "Shadow8t4") ? "text-werefox-blue-dark dark:text-werefox-blue": "text-werefox-pink-dark dark:text-werefox-pink"
export function validURL(str) {
var pattern = new RegExp(
"^(https?:\\/\\/)?" + // protocol
"((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|" + // domain name
"((\\d{1,3}\\.){3}\\d{1,3}))" + // OR ip (v4) address
"(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*" + // port and path
"(\\?[;&a-z\\d%_.~+=-]*)?" + // query string
"(\\#[-a-z\\d_]*)?$",
"i"
); // fragment locator
return !!pattern.test(str);
}
export function renderPossibleURLField(field) {
if (validURL(field)) {
return (
<Link href={field}>
<a className="p-2 text-center overflow-ellipsis overflow-hidden ring-2 ring-werefox-grey-light dark:ring-werefox-grey-darker rounded-lg bg-werefox-grey-lightest dark:bg-werefox-grey">
{field}
</a>
</Link>
);
} else {
return (
<p className="p-2 text-center overflow-ellipsis overflow-hidden ring-2 ring-werefox-grey-light dark:ring-werefox-grey-darker rounded-lg bg-werefox-grey-lightest dark:bg-werefox-grey">
{field}
</p>
);
}
}
export default function TestimonialCard({ src, alt, url, fields, bio, user }) {
const finalsrc = Boolean(src) ? src : "/images/logo.png";
const isMe =
user == "Shadow8t4"
? "text-werefox-blue-dark dark:text-werefox-blue"
: "text-werefox-pink-dark dark:text-werefox-pink";
return (
<div className="rounded-lg container flex overflow-hidden ring-2 ring-werefox-grey-lightest dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
@ -18,15 +52,27 @@ export default function TestimonialCard({ src, alt, url, innerText, user }) {
</div>
</a>
</Link>{" "}
<div className={`animate-wiggle flex-5 p-4 sm:text-lg text-xs text-center ${isMe}`}>
<p>
{innerText}
<br />
{"- "}
<Link href={url}>
<a target="_blank">{`@${user}`}</a>
</Link>
</p>
<div className={`flex-5 p-4 sm:text-sm text-xs text-center ${isMe}`}>
<div className="grid grid-cols-1 gap-2">
<div className="ring-2 ring-werefox-grey-lightest dark:ring-werefox-grey-darker rounded-lg p-2 grid grid-cols-2 grid-rows-1 gap-2 bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
{Object.keys(fields).map((field) => (
<>
{renderPossibleURLField(field)}
{renderPossibleURLField(fields[field])}
</>
))}
</div>
<div className="ring-2 ring-werefox-grey-lightest dark:ring-werefox-grey-darker rounded-lg p-2 bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
<p>
{bio}
<br />
{"- "}
<Link href={url}>
<a target="_blank">{`@${user}`}</a>
</Link>
</p>
</div>
</div>
</div>
</div>
);

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

@ -1,7 +1,5 @@
import Head from "next/head";
import BasicPage from "../../components/basic-page-template";
import WCard from "../../components/werefox-card";
import MS from "../../components/mutant-standard";
export default function HRT() {
return (

54
src/info/pages/identities/partners/index.js
View File

@ -1,12 +1,48 @@
import BasicPage from "../../../components/basic-page-template"
import BasicPage from "../../../components/basic-page-template";
import WCard from "../../../components/werefox-card";
import LCard from "../../../components/love-card";
export default function HRT() {
return (
<BasicPage
page_title="Partners"
card_title="Partners!"
>
// Use this to list out partner info on this page. >w>
</BasicPage>
);
const PARTNERS = {
// heatherhorns: {
// url: "",
// avi: "",
// fields: {
// "": "",
// },
// bio: ``,
// },
};
export default function Partners() {
if (PARTNERS == null) {
return (
<BasicPage page_title="Partners" card_title="Partners!">
{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>
))}
</BasicPage>
);
} else {
return (
<BasicPage page_title="Partners" card_title="Partners!">
<WCard>
<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>
</WCard>
</BasicPage>
);
}
}

3
src/info/pages/index.js
View File

@ -1,9 +1,6 @@
import Head from "next/head";
import Image from "next/image";
import BasicPage from "../components/basic-page-template";
import IDButton from "../components/identity-button";
import WCard from "../components/werefox-card";
import MS from "../components/mutant-standard";
export default function Home() {
return (

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

@ -8,12 +8,16 @@ module.exports = {
},
colors: {
"werefox-blue": {
DEFAULT: "#60A4FF",
dark: "#2885ff",
DEFAULT: "#75B1FF",
dark: "#0052B8",
darker: "#0052B8",
darkest: "#0052B8",
},
"werefox-pink": {
DEFAULT: "#ff84c5",
dark: "#ff329f",
DEFAULT: "#FF84CA",
dark: "#9E0054",
darker: "#8A0040",
darkest: "#75003F",
},
"werefox-grey": {
lightest: "#EEE",