Updated deploy script, docker-compose, dockerfile, and many dependency updates.
This commit is contained in:
parent
0fe6cea68d
commit
82692c5bf2
@ -1,8 +1,8 @@
|
|||||||
FROM node:12-alpine
|
FROM node:alpine
|
||||||
|
|
||||||
RUN apk update && \
|
RUN apk update && \
|
||||||
apk add --no-cache bash
|
apk add --no-cache bash
|
||||||
|
|
||||||
RUN npm install
|
|
||||||
|
|
||||||
WORKDIR /usr/src/app
|
WORKDIR /usr/src/app
|
||||||
|
|
||||||
|
RUN npm install -g create-next-app
|
||||||
|
42
deploy.sh
42
deploy.sh
@ -6,28 +6,28 @@ APP_FOLDER=info
|
|||||||
CONTAINER_NAME=werefox-dev
|
CONTAINER_NAME=werefox-dev
|
||||||
|
|
||||||
MODE=$1
|
MODE=$1
|
||||||
x=$(sudo docker container ls | grep next-js | wc -l)
|
x=$(APP_FOLDER=$APP_FOLDER MODE=$MODE docker compose ps | grep $CONTAINER_NAME | wc -l)
|
||||||
if [ $x -eq 1 ]; then
|
|
||||||
sudo MODE=$MODE docker-compose rm -sf
|
|
||||||
fi
|
|
||||||
|
|
||||||
sudo MODE=$MODE docker-compose build
|
if [ "$MODE" == "" ]; then
|
||||||
sudo MODE=$MODE docker-compose run $CONTAINER_NAME bash -c "cd $APP_FOLDER && npm install --silent"
|
|
||||||
|
|
||||||
if [ ! -d "./src/$APP_FOLDER" ]; then
|
|
||||||
sudo MODE=$MODE docker-compose run $CONTAINER_NAME npx create-next-app $APP_FOLDER
|
|
||||||
sudo MODE=$MODE docker-compose run $CONTAINER_NAME bash -c "cd $APP_FOLDER && npx tailwindcss init -p"
|
|
||||||
sudo chown -R $USER:$USER ./src
|
|
||||||
fi
|
|
||||||
|
|
||||||
sudo MODE=$MODE docker-compose run $CONTAINER_NAME bash -c "cd $APP_FOLDER && npx next telemetry disable"
|
|
||||||
|
|
||||||
if [ $MODE == "dev" ] || [ $MODE == "start" ]; then
|
|
||||||
sudo MODE=$MODE docker-compose up --build --force-recreate --remove-orphans -d
|
|
||||||
sudo MODE=$MODE docker-compose logs -f
|
|
||||||
elif [ $MODE == "build" ]; then
|
|
||||||
sudo MODE=$MODE docker-compose run $CONTAINER_NAME bash -c "cd $APP_FOLDER && npm run build"
|
|
||||||
else
|
|
||||||
echo "Please use 'dev', 'build', or 'start' as an argument."
|
echo "Please use 'dev', 'build', or 'start' as an argument."
|
||||||
exit 1
|
exit 1
|
||||||
fi
|
fi
|
||||||
|
|
||||||
|
if [ $x -eq 1 ]; then
|
||||||
|
APP_FOLDER=$APP_FOLDER MODE=$MODE docker compose rm -sf
|
||||||
|
fi
|
||||||
|
|
||||||
|
if [ ! -d "$(pwd)/src/$APP_FOLDER" ]; then
|
||||||
|
APP_FOLDER=$APP_FOLDER MODE=$MODE docker compose run $CONTAINER_NAME sh -c "npm install --silent create-next-app && \
|
||||||
|
npx create-next-app /usr/src/app/$APP_FOLDER --ts --eslint && \
|
||||||
|
cd $APP_FOLDER && npm install tailwindcss autoprefixer && npx tailwindcss init -p && \
|
||||||
|
cd /usr/src/app && rm -rf node_modules package.json package-lock.json"
|
||||||
|
fi
|
||||||
|
|
||||||
|
APP_FOLDER=$APP_FOLDER MODE=$MODE docker compose run $CONTAINER_NAME sh -c "cd $APP_FOLDER && npm install --silent"
|
||||||
|
APP_FOLDER=$APP_FOLDER MODE=$MODE docker compose run $CONTAINER_NAME sh -c "cd $APP_FOLDER && npx next telemetry disable"
|
||||||
|
APP_FOLDER=$APP_FOLDER MODE=$MODE docker compose up -d
|
||||||
|
|
||||||
|
if [ "$MODE" == "dev" ] || [ "$MODE" == "start" ]; then
|
||||||
|
APP_FOLDER=$APP_FOLDER MODE=$MODE docker compose logs -f
|
||||||
|
fi
|
@ -3,11 +3,11 @@ version: "3"
|
|||||||
|
|
||||||
services:
|
services:
|
||||||
"werefox-dev":
|
"werefox-dev":
|
||||||
image: next-js:latest
|
image: node:alpine
|
||||||
container_name: werefox-dev
|
|
||||||
build: .
|
|
||||||
volumes:
|
volumes:
|
||||||
- ./src:/usr/src/app/
|
- ./src:/usr/src/app/
|
||||||
ports:
|
ports:
|
||||||
- "3444:3444"
|
- "3444:3444"
|
||||||
command: bash -c "cd info && npm run $MODE"
|
user: "1000:1000"
|
||||||
|
working_dir: "/usr/src/app"
|
||||||
|
command: 'sh -c "cd $APP_FOLDER && npm run $MODE"'
|
||||||
|
@ -4,18 +4,16 @@ import Image from "next/image";
|
|||||||
export default function ContactsLink({ src, alt, url, description, url_text }) {
|
export default function ContactsLink({ src, alt, url, description, url_text }) {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Link href={url}>
|
<Link href={url} target="_blank">
|
||||||
<a target="_blank">
|
<div className="p-2 md:text-lg sm:text-md text-xs text-center rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition">
|
||||||
<div className="p-2 md:text-lg sm:text-md text-xs text-center rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light 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>{" "}
|
{description}{" "}
|
||||||
{description}{" "}
|
<div className="animate-wiggle inline-flex" target="_blank">
|
||||||
<div className="animate-wiggle inline-flex" target="_blank">
|
{url_text}
|
||||||
{url_text}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</div>
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -12,24 +12,22 @@ export default function TestimonialCard({ question, answer, src, alt }) {
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div className=" ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition">
|
<div className=" ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition">
|
||||||
<Link href="https://yiff.life/@werefox">
|
<Link href="https://yiff.life/@werefox" target="_blank">
|
||||||
<a target="_blank">
|
<div className="p-2 flex">
|
||||||
<div className="p-2 flex">
|
<div className="order-1 flex-shrink-0 relative inline sm:w-32 w-16 min-h-full items-center justify-center align-middle pt-4 pb-4 pl-4">
|
||||||
<div className="order-1 flex-shrink-0 relative inline sm:w-32 w-16 min-h-full items-center justify-center align-middle pt-4 pb-4 pl-4">
|
<Image
|
||||||
<Image
|
src={finalsrc}
|
||||||
src={finalsrc}
|
layout="fill"
|
||||||
layout="fill"
|
objectFit="contain"
|
||||||
objectFit="contain"
|
alt={alt}
|
||||||
alt={alt}
|
/>
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="order-2 flex overflow-auto items-center justify-center animate-wiggle p-4 sm:text-lg text-xs text-center sm:min-h-full h-full">
|
|
||||||
{answer}
|
|
||||||
<br />
|
|
||||||
{"- @alice"}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</a>
|
<div className="order-2 flex overflow-auto items-center justify-center animate-wiggle p-4 sm:text-lg text-xs text-center sm:min-h-full h-full">
|
||||||
|
{answer}
|
||||||
|
<br />
|
||||||
|
{"- @alice"}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -5,43 +5,37 @@ export default function footerButton({ theme, url, inner_text, is_external }) {
|
|||||||
if (theme == "Ada") {
|
if (theme == "Ada") {
|
||||||
return (
|
return (
|
||||||
<div className="flex-1 overflow-visible">
|
<div className="flex-1 overflow-visible">
|
||||||
<Link href={url}>
|
<Link href={url} target={target}>
|
||||||
<a target={target}>
|
<div className="ml-1 mr-1 rounded-sm ring-2 ring-ada-werefox-cyan-dark dark:ring-ada-werefox-cyan hover:ring-skye-werefox-blue-dark dark:hover:ring-skye-werefox-blue text-ada-werefox-cyan-darker dark:text-ada-werefox-cyan hover:text-skye-werefox-blue-dark dark:hover:text-skye-werefox-blue-light transition">
|
||||||
<div className="ml-1 mr-1 rounded-sm ring-2 ring-ada-werefox-cyan-dark dark:ring-ada-werefox-cyan hover:ring-skye-werefox-blue-dark dark:hover:ring-skye-werefox-blue text-ada-werefox-cyan-darker dark:text-ada-werefox-cyan hover:text-skye-werefox-blue-dark dark:hover:text-skye-werefox-blue-light 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>
|
</div>
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
if (theme == "Skye") {
|
if (theme == "Skye") {
|
||||||
return (
|
return (
|
||||||
<div className="flex-1 overflow-visible">
|
<div className="flex-1 overflow-visible">
|
||||||
<Link href={url}>
|
<Link href={url} target={target}>
|
||||||
<a target={target}>
|
<div className="ml-1 mr-1 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-darker dark:text-skye-werefox-pink hover:text-skye-werefox-blue-dark dark:hover:text-skye-werefox-blue-light transition">
|
||||||
<div className="ml-1 mr-1 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-darker dark:text-skye-werefox-pink hover:text-skye-werefox-blue-dark dark:hover:text-skye-werefox-blue-light 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>
|
</div>
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
return (
|
return (
|
||||||
<div className="flex-1 overflow-visible">
|
<div className="flex-1 overflow-visible">
|
||||||
<Link href={url}>
|
<Link href={url} target={target}>
|
||||||
<a target={target}>
|
<div className="ml-1 mr-1 rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-darker dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light transition">
|
||||||
<div className="ml-1 mr-1 rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-darker dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light 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>
|
</div>
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -14,30 +14,29 @@ export default function IdentityButton({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<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
|
||||||
<a
|
href={`${url}${maybeLocator}`}
|
||||||
className={`${extraClasses} block text-lg text-center rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition`}
|
className={`${extraClasses} block text-lg text-center rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition`}
|
||||||
>
|
>
|
||||||
{images.map((source) => (
|
{images.map((source) => (
|
||||||
<span
|
<span
|
||||||
key={source.src}
|
key={source.src}
|
||||||
className="relative inline-block w-4 h-4 align-middle mb-1"
|
className="relative inline-block w-4 h-4 align-middle mb-1"
|
||||||
>
|
>
|
||||||
{" "}
|
{" "}
|
||||||
<Image
|
<Image
|
||||||
src={source.src}
|
src={source.src}
|
||||||
layout="fill"
|
layout="fill"
|
||||||
objectFit="contain"
|
objectFit="contain"
|
||||||
alt={source.alt}
|
alt={source.alt}
|
||||||
/>{" "}
|
/>{" "}
|
||||||
</span>
|
</span>
|
||||||
))}{" "}
|
))}{" "}
|
||||||
{innerText == "Partners"
|
{innerText == "Partners"
|
||||||
? partners > 0
|
? partners > 0
|
||||||
? `Taken(${partners})`
|
? `Taken(${partners})`
|
||||||
: "Single"
|
: "Single"
|
||||||
: innerText}
|
: innerText}
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -3,12 +3,10 @@ import Link from "next/link";
|
|||||||
export default function IdentityCardButton({ url, button_text }) {
|
export default function IdentityCardButton({ url, button_text }) {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Link href={url}>
|
<Link href={url} target="_blank">
|
||||||
<a target="_blank">
|
<div className="p-4 hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue hover:animate-yip transition">
|
||||||
<div className="p-4 hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue hover:animate-yip transition">
|
{button_text}
|
||||||
{button_text}
|
</div>
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -13,8 +13,7 @@ export default function PageButton({
|
|||||||
if (Boolean(new_tab)) {
|
if (Boolean(new_tab)) {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Link href={url}>
|
<Link href={url}
|
||||||
<a
|
|
||||||
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-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-light focus:text-skye-werefox-blue-dark dark:focus:text-skye-werefox-blue-light 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-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-light focus:text-skye-werefox-blue-dark dark:focus:text-skye-werefox-blue-light hover:animate-yip transition`}
|
||||||
target="_blank"
|
target="_blank"
|
||||||
>
|
>
|
||||||
@ -32,15 +31,13 @@ export default function PageButton({
|
|||||||
</span>
|
</span>
|
||||||
))}
|
))}
|
||||||
{` ${title}`}
|
{` ${title}`}
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Link href={url}>
|
<Link href={url}
|
||||||
<a
|
|
||||||
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-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-light focus:text-skye-werefox-blue-dark dark:focus:text-skye-werefox-blue-light 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-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-light focus:text-skye-werefox-blue-dark dark:focus:text-skye-werefox-blue-light hover:animate-yip transition`}
|
||||||
>
|
>
|
||||||
{images.map((source) => (
|
{images.map((source) => (
|
||||||
@ -57,7 +54,6 @@ export default function PageButton({
|
|||||||
</span>
|
</span>
|
||||||
))}
|
))}
|
||||||
{` ${title}`}
|
{` ${title}`}
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
@ -66,8 +62,7 @@ export default function PageButton({
|
|||||||
if (Boolean(new_tab)) {
|
if (Boolean(new_tab)) {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Link href={url}>
|
<Link href={url}
|
||||||
<a
|
|
||||||
className={`${extra_classes} p-2 w-full inline-block text-lg text-center rounded-sm ring-2 bg-alice-werefox-grey-lightest dark:bg-alice-werefox-grey-dark ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light focus:text-alice-werefox-blue-dark dark:focus:text-alice-werefox-blue-light hover:animate-yip transition`}
|
className={`${extra_classes} p-2 w-full inline-block text-lg text-center rounded-sm ring-2 bg-alice-werefox-grey-lightest dark:bg-alice-werefox-grey-dark ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light focus:text-alice-werefox-blue-dark dark:focus:text-alice-werefox-blue-light hover:animate-yip transition`}
|
||||||
target="_blank"
|
target="_blank"
|
||||||
>
|
>
|
||||||
@ -85,15 +80,13 @@ export default function PageButton({
|
|||||||
</span>
|
</span>
|
||||||
))}
|
))}
|
||||||
{` ${title}`}
|
{` ${title}`}
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Link href={url}>
|
<Link href={url}
|
||||||
<a
|
|
||||||
className={`${extra_classes} p-2 w-full inline-block text-lg text-center rounded-sm ring-2 bg-alice-werefox-grey-lightest dark:bg-alice-werefox-grey-dark ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light focus:text-alice-werefox-blue-dark dark:focus:text-alice-werefox-blue-light hover:animate-yip transition`}
|
className={`${extra_classes} p-2 w-full inline-block text-lg text-center rounded-sm ring-2 bg-alice-werefox-grey-lightest dark:bg-alice-werefox-grey-dark ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light focus:text-alice-werefox-blue-dark dark:focus:text-alice-werefox-blue-light hover:animate-yip transition`}
|
||||||
>
|
>
|
||||||
{images.map((source) => (
|
{images.map((source) => (
|
||||||
@ -110,7 +103,6 @@ export default function PageButton({
|
|||||||
</span>
|
</span>
|
||||||
))}
|
))}
|
||||||
{` ${title}`}
|
{` ${title}`}
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -47,12 +47,10 @@ export function formatCustomEmoji(str, emoji_paths) {
|
|||||||
export function renderPossibleURLField(field, emoji_paths) {
|
export function renderPossibleURLField(field, emoji_paths) {
|
||||||
if (validURL(field)) {
|
if (validURL(field)) {
|
||||||
return (
|
return (
|
||||||
<Link href={field}>
|
<Link href={field} target="_blank">
|
||||||
<a target="_blank">
|
<div className="p-2 flex min-w-full min-h-full justify-center items-center align-middle ring-2 rounded-sm ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition">
|
||||||
<div className="p-2 flex min-w-full min-h-full justify-center items-center align-middle ring-2 rounded-sm ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition">
|
{field}
|
||||||
{field}
|
</div>
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
@ -113,25 +111,18 @@ export default function PartnerCard({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="p-4 flex-column space-y-4 sm:break-normal break-all sm:text-sm text-xs text-center rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red">
|
<div className="p-4 flex-column space-y-4 sm:break-normal break-all sm:text-sm text-xs text-center rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red">
|
||||||
<Link href={url}>
|
<Link href={url} target="_blank">
|
||||||
<a target="_blank">
|
<div className="p-4 flex group rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition">
|
||||||
<div className="p-4 flex group rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition">
|
<div className="order-1 flex-1 flex-shrink-0 relative items-center justify-center align-middle sm:w-32 w-16 min-h-full mr-4">
|
||||||
<div className="order-1 flex-1 flex-shrink-0 relative items-center justify-center align-middle sm:w-32 w-16 min-h-full mr-4">
|
<Image src={finalsrc} layout="fill" objectFit="contain" alt={alt} />
|
||||||
<Image
|
</div>
|
||||||
src={finalsrc}
|
<div className="order-2 flex-5 space-y-4">
|
||||||
layout="fill"
|
<div className="p-2 rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red group-hover:ring-alice-werefox-blue-dark dark:group-hover:ring-alice-werefox-blue">
|
||||||
objectFit="contain"
|
{renderPossibleBio(bio, emoji_paths)}
|
||||||
alt={alt}
|
{`- @${user}`}
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="order-2 flex-5 space-y-4">
|
|
||||||
<div className="p-2 rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red group-hover:ring-alice-werefox-blue-dark dark:group-hover:ring-alice-werefox-blue">
|
|
||||||
{renderPossibleBio(bio, emoji_paths)}
|
|
||||||
{`- @${user}`}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</div>
|
||||||
</Link>
|
</Link>
|
||||||
<div className="flex-column space-y-4 break-all text-alice-werefox-red-dark dark:text-alice-werefox-red-light">
|
<div className="flex-column space-y-4 break-all text-alice-werefox-red-dark dark:text-alice-werefox-red-light">
|
||||||
{renderPossibleFields(fields, emoji_paths)}
|
{renderPossibleFields(fields, emoji_paths)}
|
||||||
|
@ -12,23 +12,16 @@ export default function projectCard({
|
|||||||
if (Boolean(new_tab)) {
|
if (Boolean(new_tab)) {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Link href={url}>
|
<Link href={url} target="_blank">
|
||||||
<a target="_blank">
|
<li className="p-4 space-y-2 rounded-sm ring-2 text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue hover:animate-yip transition">
|
||||||
<li className="p-4 space-y-2 rounded-sm ring-2 text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue 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 src={src} layout="fill" objectFit="contain" alt={alt} />
|
||||||
<Image
|
</span>
|
||||||
src={src}
|
{` ${title}`}
|
||||||
layout="fill"
|
</div>
|
||||||
objectFit="contain"
|
<div className="text-md text-center">{description}</div>
|
||||||
alt={alt}
|
</li>
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
{` ${title}`}
|
|
||||||
</div>
|
|
||||||
<div className="text-md text-center">{description}</div>
|
|
||||||
</li>
|
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
@ -36,22 +29,15 @@ export default function projectCard({
|
|||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Link href={url}>
|
<Link href={url}>
|
||||||
<a>
|
<li className="p-4 space-y-2 rounded-sm ring-2 text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue hover:animate-yip transition">
|
||||||
<li className="p-4 space-y-2 rounded-sm ring-2 text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue 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 src={src} layout="fill" objectFit="contain" alt={alt} />
|
||||||
<Image
|
</span>
|
||||||
src={src}
|
{` ${title}`}
|
||||||
layout="fill"
|
</div>
|
||||||
objectFit="contain"
|
<div className="text-md text-center">{description}</div>
|
||||||
alt={alt}
|
</li>
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
{` ${title}`}
|
|
||||||
</div>
|
|
||||||
<div className="text-md text-center">{description}</div>
|
|
||||||
</li>
|
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -1,5 +1,4 @@
|
|||||||
import SCard from "./server-card";
|
import SCard from "./server-card";
|
||||||
import Link from "next/link";
|
|
||||||
|
|
||||||
export default function ServerBlock({ servers }) {
|
export default function ServerBlock({ servers }) {
|
||||||
return (
|
return (
|
||||||
|
@ -9,32 +9,30 @@ export default function TestimonialCard({ src, alt, url, innerText, user }) {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition">
|
<div className="rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition">
|
||||||
<Link href={url}>
|
<Link href={url} target="_blank">
|
||||||
<a target="_blank">
|
<div className="min-w-full flex overflow-hidden">
|
||||||
<div className="min-w-full flex overflow-hidden">
|
<div className="order-1 flex-1 flex-shrink-0 pt-4 pb-4 pl-4">
|
||||||
<div className="order-1 flex-1 flex-shrink-0 pt-4 pb-4 pl-4">
|
<span className="relative inline-block sm:w-32 w-16 sm:h-32 h-16">
|
||||||
<span className="relative inline-block sm:w-32 w-16 sm:h-32 h-16">
|
<Image
|
||||||
<Image
|
className="rounded-sm"
|
||||||
className="rounded-sm"
|
src={finalsrc}
|
||||||
src={finalsrc}
|
layout="fill"
|
||||||
layout="fill"
|
objectFit="contain"
|
||||||
objectFit="contain"
|
alt={alt}
|
||||||
alt={alt}
|
/>
|
||||||
/>
|
</span>
|
||||||
</span>
|
</div>
|
||||||
</div>
|
<div className="order-2 flex flex-5 p-4 items-center justify-center min-h-full">
|
||||||
<div className="order-2 flex flex-5 p-4 items-center justify-center min-h-full">
|
<div className="animate-wiggle sm:text-lg text-xs text-center">
|
||||||
<div className="animate-wiggle sm:text-lg text-xs text-center">
|
{Object.keys(testimonialdict).map((t) => (
|
||||||
{Object.keys(testimonialdict).map((t) => (
|
<p className="overflow-auto" key={t}>
|
||||||
<p className="overflow-auto" key={t}>
|
{testimonialdict[t] == "" ? <br /> : testimonialdict[t]}
|
||||||
{testimonialdict[t] == "" ? <br /> : testimonialdict[t]}
|
</p>
|
||||||
</p>
|
))}
|
||||||
))}
|
{`- @${user}`}
|
||||||
{`- @${user}`}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</div>
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -1,4 +1,3 @@
|
|||||||
import Link from "next/link";
|
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
|
|
||||||
export default function TitleCard({ theme, card_title }) {
|
export default function TitleCard({ theme, card_title }) {
|
||||||
|
7928
src/info/package-lock.json
generated
7928
src/info/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -13,11 +13,11 @@
|
|||||||
"foo": "^1.0.0",
|
"foo": "^1.0.0",
|
||||||
"glob-parent": "^6.0.2",
|
"glob-parent": "^6.0.2",
|
||||||
"js-yaml": "^4.1.0",
|
"js-yaml": "^4.1.0",
|
||||||
"next": "^10.2.3",
|
"next": "^13.0.6",
|
||||||
"npm": "^7.24.2",
|
"npm": "^9.1.3",
|
||||||
"postcss": "^8.3.9",
|
"postcss": "^8.3.9",
|
||||||
"react": "17.0.2",
|
"react": "^18.2.0",
|
||||||
"react-dom": "17.0.2",
|
"react-dom": "^18.2.0",
|
||||||
"react-iframe": "^1.8.0",
|
"react-iframe": "^1.8.0",
|
||||||
"tailwindcss": "^2.2.16"
|
"tailwindcss": "^2.2.16"
|
||||||
}
|
}
|
||||||
|
@ -38,19 +38,17 @@ export default function Fursona({ FURSONA }) {
|
|||||||
>
|
>
|
||||||
<IDCardText info={FURSONA[fursona].info} />
|
<IDCardText info={FURSONA[fursona].info} />
|
||||||
<div className="rounded-lg hover:animate-yip transition">
|
<div className="rounded-lg hover:animate-yip transition">
|
||||||
<Link href="https://plush.city/@Logan">
|
<Link href="https://plush.city/@Logan" target="_blank">
|
||||||
<a target="_blank">
|
<span className="relative inline-flex align-middle">
|
||||||
<span className="relative inline-flex align-middle">
|
<Image
|
||||||
<Image
|
className="rounded-lg"
|
||||||
className="rounded-lg"
|
src={FURSONA[fursona].src2}
|
||||||
src={FURSONA[fursona].src2}
|
layout="intrinsic"
|
||||||
layout="intrinsic"
|
width="2048"
|
||||||
width="2048"
|
height="2048"
|
||||||
height="2048"
|
alt={FURSONA[fursona].alt2}
|
||||||
alt={FURSONA[fursona].alt2}
|
/>
|
||||||
/>
|
</span>
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</IDCard>
|
</IDCard>
|
||||||
|
@ -38,19 +38,17 @@ export default function Fursona({ FURSONA }) {
|
|||||||
>
|
>
|
||||||
<IDCardText info={FURSONA[fursona].info} />
|
<IDCardText info={FURSONA[fursona].info} />
|
||||||
<div className="rounded-lg hover:animate-yip transition">
|
<div className="rounded-lg hover:animate-yip transition">
|
||||||
<Link href="https://twitter.com/ribbonfemale">
|
<Link href="https://twitter.com/ribbonfemale" target="_blank">
|
||||||
<a target="_blank">
|
<span className="relative inline-flex align-middle">
|
||||||
<span className="relative inline-flex align-middle">
|
<Image
|
||||||
<Image
|
className="rounded-lg"
|
||||||
className="rounded-lg"
|
src={FURSONA[fursona].src2}
|
||||||
src={FURSONA[fursona].src2}
|
layout="intrinsic"
|
||||||
layout="intrinsic"
|
width="2048"
|
||||||
width="2048"
|
height="2048"
|
||||||
height="2048"
|
alt={FURSONA[fursona].alt2}
|
||||||
alt={FURSONA[fursona].alt2}
|
/>
|
||||||
/>
|
</span>
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</IDCard>
|
</IDCard>
|
||||||
|
Loading…
Reference in New Issue
Block a user