From e9d4e3e098317ff20ea3c562f39d49537887658c Mon Sep 17 00:00:00 2001 From: Alexis Werefox Date: Fri, 21 Jan 2022 03:49:30 +0000 Subject: [PATCH] Templated out theme. --- Dockerfile | 2 +- deploy.sh | 18 ++--- docker-compose.yml | 4 +- src/werefox-obs-layouts/pages/index.js | 40 +++++++++-- src/werefox-obs-layouts/tailwind.config.js | 83 ++++++++++++++++++++-- 5 files changed, 124 insertions(+), 23 deletions(-) diff --git a/Dockerfile b/Dockerfile index a26987a..f483f1f 100644 --- a/Dockerfile +++ b/Dockerfile @@ -5,4 +5,4 @@ RUN apk update && \ RUN npm install -WORKDIR /usr/src +WORKDIR /usr/src/app diff --git a/deploy.sh b/deploy.sh index e14cf12..e860d75 100755 --- a/deploy.sh +++ b/deploy.sh @@ -8,25 +8,25 @@ CONTAINER_NAME=werefox-obs-layouts MODE=$1 x=$(sudo docker container ls | grep next-js | wc -l) if [ $x -eq 1 ]; then - sudo MODE=$MODE APP_FOLDER=$APP_FOLDER docker-compose rm -sf + sudo MODE=$MODE docker-compose rm -sf fi -sudo MODE=$MODE APP_FOLDER=$APP_FOLDER docker-compose build +sudo MODE=$MODE docker-compose build +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 APP_FOLDER=$APP_FOLDER docker-compose run $CONTAINER_NAME npx create-next-app $APP_FOLDER - sudo MODE=$MODE APP_FOLDER=$APP_FOLDER docker-compose run $CONTAINER_NAME bash -c "cd $APP_FOLDER && npx tailwindcss init -p" + 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 APP_FOLDER=$APP_FOLDER docker-compose run $CONTAINER_NAME bash -c "cd $APP_FOLDER && npm install --silent" -sudo MODE=$MODE APP_FOLDER=$APP_FOLDER docker-compose run $CONTAINER_NAME bash -c "cd $APP_FOLDER && npx next telemetry disable" +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 APP_FOLDER=$APP_FOLDER docker-compose up --build --force-recreate --remove-orphans -d - sudo MODE=$MODE APP_FOLDER=$APP_FOLDER docker-compose logs -f + 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 APP_FOLDER=$APP_FOLDER docker-compose run $CONTAINER_NAME bash -c "cd $APP_FOLDER && npm run build" + 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." exit 1 diff --git a/docker-compose.yml b/docker-compose.yml index 84064c8..786c37b 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -8,7 +8,7 @@ services: context: . dockerfile: Dockerfile volumes: - - ./src:/usr/src/ + - ./src:/usr/src/app/ ports: - "64209:64209" - command: bash -c "cd $APP_FOLDER && npm run $MODE" + command: bash -c "cd werefox-obs-layouts && npm run $MODE" diff --git a/src/werefox-obs-layouts/pages/index.js b/src/werefox-obs-layouts/pages/index.js index b9356e3..38b4e20 100644 --- a/src/werefox-obs-layouts/pages/index.js +++ b/src/werefox-obs-layouts/pages/index.js @@ -1,18 +1,46 @@ -import Head from 'next/head' +import Head from "next/head"; +import Image from "next/image"; export default function Home() { return ( -
+
Create Next App -
-
-

Oh hi I'm writing things and they're displaying on the browser preview

+
+
+
+

Donation and stuff

+
+
+
+

this is the chat

+
+
+
+ +
+
+
+
+
+
+

+ Oh hi I'm writing things and they're displaying on the browser + preview +

+
+
+

+
- ) + ); } diff --git a/src/werefox-obs-layouts/tailwind.config.js b/src/werefox-obs-layouts/tailwind.config.js index cda805c..9f3904f 100644 --- a/src/werefox-obs-layouts/tailwind.config.js +++ b/src/werefox-obs-layouts/tailwind.config.js @@ -7,20 +7,25 @@ module.exports = { nerd: ["DejaVuSansMono"], }, colors: { - "werefox-blue": { + "ada-werefox-cyan": { + light: "#AAFFFF", + DEFAULT: "#50FFFF", + dark: "#008888", + }, + "skye-werefox-blue": { light: "#94C2FF", DEFAULT: "#75B1FF", dark: "#0052B8", darker: "#00377A", darkest: "#00326B", }, - "werefox-pink": { + "skye-werefox-pink": { DEFAULT: "#FF84CA", dark: "#9E0054", darker: "#8A0040", darkest: "#75003F", }, - "werefox-grey": { + "skye-werefox-grey": { lightest: "#EEE", lighter: "#DBDBDB", light: "#CCC", @@ -28,6 +33,28 @@ module.exports = { dark: "#242424", darker: "#121212", }, + "alice-werefox-grey": { + lightest: "#EEE", + lighter: "#DBDBDB", + light: "#CCC", + DEFAULT: "#242424", + dark: "#121212", + darker: "#000", + }, + "alice-werefox-red": { + light: "#E08587", + DEFAULT: "#c93439", + dark: "#800008", + darker: "#550006", + darkest: "#7A0000", + }, + "alice-werefox-blue": { + light: "#9197F3", + DEFAULT: "#1b29e0", + dark: "#3300FF", + darker: "#2C00DB", + darkest: "#2700C2", + }, }, flex: { 5: "5 5 0%", @@ -46,19 +73,65 @@ module.exports = { "0%, 100%": { transform: "scale(1, 1)" }, "50%": { transform: "scale(1.01, 1.01)" }, }, + topslide: { + "0%": { "margin-top": "10em" }, + "4%": { "margin-top": "0em" }, + "31%": { "margin-top": "0em" }, + "35%": { "margin-top": "-10em" }, + "64%": { "margin-top": "-10em" }, + "68%": { "margin-top": "-20em" }, + "96%": { "margin-top": "-20em" }, + "100%": { "margin-top": "-30em" }, + }, + heightslide: { + "0%": { width: "auto", padding: "0.5em 1em", border: "thin solid" }, + "49.99%": { + width: "auto", + padding: "0.5em 1em", + border: "thin solid", + }, + "50.01%": { width: "0", padding: "0", border: "none" }, + "100%": { width: "0", padding: "0", border: "none" }, + }, }, animation: { wiggle: "wiggle 7s ease-in-out infinite", jiggle: "jiggle 5s cubic-bezier(0.75,0.25,0.25,0.75) infinite", yip: "yip 0.1s ease-in-out", + topslide: "topslide 12s ease-in-out infinite", + heightslide: "heightslide 8s linear infinite", + }, + width: { + "1080p": "1920px", + "900p": "1600px", + "720p": "1280px", + "480p": "720px", + }, + height: { + "1080p": "1080px", + "900p": "900px", + "720p": "720px", + "480p": "480px", + }, + maxWidth: { + "1080p": "1920px", + "900p": "1600px", + "720p": "1280px", + "480p": "720px", + }, + maxHeight: { + "1080p": "1080px", + "900p": "900px", + "720p": "720px", + "480p": "480px", }, }, }, variants: { extend: { brightness: ["hover", "dark"], - ringColor: ["hover", "dark", "active"], - animation: ["hover", "focus"], + ringColor: ["hover", "dark", "active", "group-hover"], + animation: ["hover", "focus", "group-hover"], }, }, plugins: [],