Lots of minor edits.

This commit is contained in:
Alexis Werefox 2021-04-28 05:17:56 +00:00
parent c7bcd145c6
commit 6f7488309b
8 changed files with 40 additions and 31 deletions

View File

@ -6,17 +6,17 @@ export default function FooterCard() {
<WCard> <WCard>
<footer className="p-4 space-y-2"> <footer className="p-4 space-y-2">
<div className="container flex text-werefox-blue-darker dark:text-werefox-blue"> <div className="container flex text-werefox-blue-darker dark:text-werefox-blue">
<div className="flex-1 lg:pl-16 pl-4"> <div className="flex-1 sm:pr-16 pr-4">
<p className="text-center sm:text-md text-sm transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink"> <p className="text-right sm:text-md text-sm transition">
<Link href="/contacts"> <Link href="/contacts">
<a>Contact</a> <a className="hover:text-werefox-pink-dark dark:hover:text-werefox-pink">Contact</a>
</Link> </Link>
</p> </p>
</div> </div>
<div className="flex-1 lg:pr-16 pr-4"> <div className="flex-1 sm:pl-16 pl-4">
<p className="text-center sm:text-md text-sm transition hover:text-werefox-pink-dark dark:hover:text-werefox-pink"> <p className="text-left sm:text-md text-sm transition">
<Link href="https://gitea.werefox.dev/shadow8t4/info-werefox-dev"> <Link href="https://gitea.werefox.dev/shadow8t4/info-werefox-dev">
<a target="_blank"> /src</a> <a className="hover:text-werefox-pink-dark dark:hover:text-werefox-pink" target="_blank"> /src</a>
</Link> </Link>
</p> </p>
</div> </div>

View File

@ -17,14 +17,14 @@ export function renderPossibleURLField(field) {
if (validURL(field)) { if (validURL(field)) {
return ( return (
<Link href={field}> <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-lighter dark:bg-werefox-grey-dark hover:text-werefox-blue-dark dark:hover:text-werefox-blue"> <a className="p-2 text-center overflow-clip overflow-auto ring-2 ring-werefox-grey-light dark:ring-werefox-grey-darker rounded-lg bg-werefox-grey-lighter dark:bg-werefox-grey-dark hover:text-werefox-blue-dark dark:hover:text-werefox-blue">
{field} {field}
</a> </a>
</Link> </Link>
); );
} else { } else {
return ( 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-lighter dark:bg-werefox-grey-dark"> <p className="p-2 text-center overflow-clip overflow-auto ring-2 ring-werefox-grey-light dark:ring-werefox-grey-darker rounded-lg bg-werefox-grey-lighter dark:bg-werefox-grey-dark">
{field} {field}
</p> </p>
); );
@ -63,7 +63,7 @@ export default function LoveCard({ src, alt, url, fields, bio, user }) {
))} ))}
</div> </div>
<div className="ring-2 ring-werefox-grey-lightest dark:ring-werefox-grey-darker rounded-lg p-2 bg-werefox-grey-light dark:bg-werefox-grey"> <div className="ring-2 ring-werefox-grey-lightest dark:ring-werefox-grey-darker rounded-lg p-2 bg-werefox-grey-light dark:bg-werefox-grey">
<p> <p className="overflow-auto">
{bio} {bio}
<br /> <br />
{"- "} {"- "}

View File

@ -2,14 +2,20 @@ import Link from "next/link";
export default function TestimonialCard({ src, alt, url, innerText, user }) { export default function TestimonialCard({ src, alt, url, innerText, user }) {
const finalsrc = Boolean(src) ? src : "/images/logo.png"; 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" const isMe =
const isMeLink = (user == "Shadow8t4") ? "hover:text-werefox-pink-dark dark:hover:text-werefox-pink": "hover:text-werefox-blue-dark dark:hover:text-werefox-blue" user == "Shadow8t4"
? "text-werefox-blue-dark dark:text-werefox-blue"
: "text-werefox-pink-dark dark:text-werefox-pink";
const isMeLink =
user == "Shadow8t4"
? "hover:text-werefox-pink-dark dark:hover:text-werefox-pink"
: "hover:text-werefox-blue-dark dark:hover:text-werefox-blue";
return ( 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"> <div className="rounded-lg min-w-full flex overflow-hidden ring-2 ring-werefox-grey-lightest dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
<Link href={url}> <Link href={url}>
<a> <a>
<div className="flex-1"> <div className="flex-1 pt-4 pb-4 pl-4">
{" "} {" "}
<img <img
className="rounded-lg sm:w-32 w-16" className="rounded-lg sm:w-32 w-16"
@ -19,14 +25,17 @@ export default function TestimonialCard({ src, alt, url, innerText, user }) {
</div> </div>
</a> </a>
</Link>{" "} </Link>{" "}
<div className={`animate-wiggle flex-5 p-4 sm:text-lg text-xs text-center ${isMe}`}> <div
className={`flex items-center justify-center animate-wiggle flex-5 p-4 sm:text-lg text-xs text-center min-h-full ${isMe}`}
>
<p> <p>
{innerText} {innerText}
<br /> <br />
{"- "} {"- "}
<Link href={url}> <a
<a target="_blank" className={`transition ${isMeLink}`}>{`@${user}`}</a> target="_blank"
</Link> className={`transition ${isMeLink}`}
>{`@${user}`}</a>
</p> </p>
</div> </div>
</div> </div>

View File

@ -22,12 +22,12 @@ export default function WerefoxCard({
<div className="container"> <div className="container">
<Link href={url}> <Link href={url}>
<a <a
className={`${extraClasses} block ring-2 ring-werefox-grey-lightest dark:ring-werefox-grey-darker rounded-lg p-4 text-xl text-center text-werefox-grey dark:text-werefox-grey-dark bg-werefox-grey-lighter dark:bg-werefox-grey-lightest transition hover:bg-werefox-grey-lightest dark:hover:bg-werefox-grey-light`} className={`${extraClasses} p-2 block ring-2 ring-werefox-grey-lightest dark:ring-werefox-grey-darker rounded-lg text-lg text-center text-werefox-grey dark:text-werefox-grey-dark bg-werefox-grey-lighter dark:bg-werefox-grey-lightest transition hover:bg-werefox-grey-lightest dark:hover:bg-werefox-grey-light`}
> >
{images.map((source) => ( {images.map((source) => (
<span <span
key={source.src} key={source.src}
className="relative inline-block w-8 h-8 align-middle mb-1" className="relative inline-block w-6 h-6 align-middle mb-1"
> >
{" "} {" "}
<Image <Image

View File

@ -16,7 +16,7 @@ export default function Contacts() {
</p> </p>
</div> </div>
<div className="rounded-lg ring-2 ring-werefox-grey-lightest dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark"> <div className="rounded-lg ring-2 ring-werefox-grey-lightest 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"> <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"> <a href="https://vulpine.club/@shadow8t4" target="_blank">
<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 <Image
@ -36,7 +36,7 @@ export default function Contacts() {
@shadow8t4@vulpine.club @shadow8t4@vulpine.club
</a> </a>
</p> </p>
<p className="pl-4 pr-4 pb-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue"> <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"> <a href="https://twitter.com/alexis_werefox" target="_blank">
<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 <Image
@ -56,7 +56,7 @@ export default function Contacts() {
@alexis_werefox @alexis_werefox
</a> </a>
</p> </p>
<p className="pl-4 pr-4 pb-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue"> <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"> <a href="https://www.twitch.tv/alexis_werefox" target="_blank">
<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 <Image
@ -76,7 +76,7 @@ export default function Contacts() {
@Alexis_Werefox @Alexis_Werefox
</a> </a>
</p> </p>
<p className="pl-4 pr-4 pb-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue"> <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 <a
href="https://vid.werefox.dev/accounts/shadow8t4/video-channels" href="https://vid.werefox.dev/accounts/shadow8t4/video-channels"
target="_blank" target="_blank"
@ -96,10 +96,10 @@ export default function Contacts() {
href="https://vid.werefox.dev/accounts/shadow8t4/video-channels" href="https://vid.werefox.dev/accounts/shadow8t4/video-channels"
target="_blank" target="_blank"
> >
@shadow8t4@vid.werefox.dev vid.werefox.dev
</a> </a>
</p> </p>
<p className="pl-4 pr-4 pb-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue"> <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"> <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"> <span className="animate-bounce relative inline-block w-6 h-6 align-middle">
<Image <Image
@ -119,7 +119,7 @@ export default function Contacts() {
write.as/a-letter-to-the-void write.as/a-letter-to-the-void
</a> </a>
</p> </p>
<p className="pl-4 pr-4 pb-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue"> <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"> <a href="https://werefox.dev" target="_blank">
<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 <Image
@ -139,7 +139,7 @@ export default function Contacts() {
werefox.dev werefox.dev
</a> </a>
</p> </p>
<p className="pl-4 pr-4 pb-4 text-lg text-center text-werefox-blue-dark dark:text-werefox-blue"> <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=""> <a href="mailto:adh9694@gmail.com" target="">
<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 <Image

View File

@ -1,5 +1,3 @@
import Head from "next/head";
import Image from "next/image";
import BasicPage from "../../components/basic-page-template"; import BasicPage from "../../components/basic-page-template";
import WCard from "../../components/werefox-card"; import WCard from "../../components/werefox-card";
import TCard from "../../components/testimonial-card"; import TCard from "../../components/testimonial-card";

View File

@ -46,17 +46,19 @@ export default function HRT({ startTimes }) {
card_title="Track my HRT progress!" card_title="Track my HRT progress!"
> >
<WCard> <WCard>
<div className="p-4">
<p className="pt-6 text-lg md:text-2xl text-center text-werefox-blue-dark dark:text-werefox-blue"> <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!! I'm so glad you're interested!!
</p> </p>
<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-werefox-blue-dark dark:text-werefox-blue">
I have been on HRT for: I've been on HRT for:
</p> </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"> <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">
{Object.keys(timesArray).map((t) => ( {Object.keys(timesArray).map((t) => (
<p key={t}>{timesArray[t]}</p> <p key={t}>{timesArray[t]}</p>
))} ))}
</div> </div>
</div>
</WCard> </WCard>
</BasicPage> </BasicPage>
); );

View File

@ -138,7 +138,7 @@ export default function Home() {
</div> </div>
</WCard> </WCard>
<WCard> <WCard>
<div className="p-2 space-y-2"> <div className="p-2 space-y-3">
<div className="rounded-lg ring-2 ring-werefox-grey-lightest dark:ring-werefox-grey-darker bg-werefox-grey-lighter dark:bg-werefox-grey-dark"> <div className="rounded-lg ring-2 ring-werefox-grey-lightest 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 className="p-2 text-center text-md sm:text-lg text-werefox-blue-dark dark:text-werefox-blue">
Useful Pages! (hopefully!) Useful Pages! (hopefully!)