diff --git a/package.json b/package.json
index 4d6f733..3ecb408 100644
--- a/package.json
+++ b/package.json
@@ -22,11 +22,13 @@
"astro": "^4.0.7",
"clsx": "2.0.0",
"framer-motion": "10.16.16",
+ "html-to-image": "1.11.11",
"nanostores": "0.9.5",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"sharp": "^0.33.1",
"tailwindcss": "^3.4.0",
+ "tailwind-merge": "2.2.0",
"typescript": "^5.3.3"
},
"devDependencies": {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 17c1e9b..234110e 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -35,6 +35,9 @@ dependencies:
framer-motion:
specifier: 10.16.16
version: 10.16.16(react-dom@18.2.0)(react@18.2.0)
+ html-to-image:
+ specifier: 1.11.11
+ version: 1.11.11
nanostores:
specifier: 0.9.5
version: 0.9.5
@@ -47,6 +50,9 @@ dependencies:
sharp:
specifier: ^0.33.1
version: 0.33.1
+ tailwind-merge:
+ specifier: 2.2.0
+ version: 2.2.0
tailwindcss:
specifier: ^3.4.0
version: 3.4.0
@@ -461,6 +467,13 @@ packages:
'@babel/types': 7.23.6
dev: false
+ /@babel/runtime@7.23.7:
+ resolution: {integrity: sha512-w06OXVOFso7LcbzMiDGt+3X7Rh7Ho8MmgPoWU3rarH+8upf+wSU/grlGbWzQyr3DkdN6ZeuMFjpdwW0Q+HxobA==}
+ engines: {node: '>=6.9.0'}
+ dependencies:
+ regenerator-runtime: 0.14.1
+ dev: false
+
/@babel/template@7.22.15:
resolution: {integrity: sha512-QPErUVm4uyJa60rkI73qneDacvdvzxshT3kksGqlGWYdOTIUOwJ7RDUL8sGqslY1uXWSL6xMFKEXDS3ox2uF0w==}
engines: {node: '>=6.9.0'}
@@ -2885,6 +2898,10 @@ packages:
resolution: {integrity: sha512-RuMffC89BOWQoY0WKGpIhn5gX3iI54O6nRA0yC124NYVtzjmFWBIiFd8M0x+ZdX0P9R4lADg1mgP8C7PxGOWuQ==}
dev: false
+ /html-to-image@1.11.11:
+ resolution: {integrity: sha512-9gux8QhvjRO/erSnDPv28noDZcPZmYE7e1vFsBLKLlRlKDSqNJYebj6Qz1TGd5lsRV+X+xYyjCKjuZdABinWjA==}
+ dev: false
+
/html-void-elements@3.0.0:
resolution: {integrity: sha512-bEqo66MRXsUGxWHV5IP0PUiAWwoEjba4VCzg0LjFJBpchPaTfyfCKTG6bc5F8ucKec3q5y6qOdGyYTSBEvhCrg==}
dev: false
@@ -4305,6 +4322,10 @@ packages:
picomatch: 2.3.1
dev: false
+ /regenerator-runtime@0.14.1:
+ resolution: {integrity: sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==}
+ dev: false
+
/rehype-parse@9.0.0:
resolution: {integrity: sha512-WG7nfvmWWkCR++KEkZevZb/uw41E8TsH4DsY9UxsTbIXCVGbAs4S+r8FrQ+OtH5EEQAs+5UxKC42VinkmpA1Yw==}
dependencies:
@@ -4828,6 +4849,12 @@ packages:
tslib: 2.6.2
dev: true
+ /tailwind-merge@2.2.0:
+ resolution: {integrity: sha512-SqqhhaL0T06SW59+JVNfAqKdqLs0497esifRrZ7jOaefP3o64fdFNDMrAQWZFMxTLJPiHVjRLUywT8uFz1xNWQ==}
+ dependencies:
+ '@babel/runtime': 7.23.7
+ dev: false
+
/tailwindcss@3.4.0:
resolution: {integrity: sha512-VigzymniH77knD1dryXbyxR+ePHihHociZbXnLZHUyzf2MMs2ZVqlUrZ3FvpXP8pno9JzmILt1sZPD19M3IxtA==}
engines: {node: '>=14.0.0'}
diff --git a/public/fonts/sukhumvit-set/SukhumvitSet-Bold.ttf b/public/fonts/sukhumvit-set/SukhumvitSet-Bold.ttf
new file mode 100644
index 0000000..68ebcbb
Binary files /dev/null and b/public/fonts/sukhumvit-set/SukhumvitSet-Bold.ttf differ
diff --git a/public/fonts/sukhumvit-set/SukhumvitSet-Light.ttf b/public/fonts/sukhumvit-set/SukhumvitSet-Light.ttf
new file mode 100644
index 0000000..dc9dc22
Binary files /dev/null and b/public/fonts/sukhumvit-set/SukhumvitSet-Light.ttf differ
diff --git a/public/fonts/sukhumvit-set/SukhumvitSet-Medium.ttf b/public/fonts/sukhumvit-set/SukhumvitSet-Medium.ttf
new file mode 100644
index 0000000..38ee27a
Binary files /dev/null and b/public/fonts/sukhumvit-set/SukhumvitSet-Medium.ttf differ
diff --git a/public/fonts/sukhumvit-set/SukhumvitSet-SemiBold.ttf b/public/fonts/sukhumvit-set/SukhumvitSet-SemiBold.ttf
new file mode 100644
index 0000000..f897f94
Binary files /dev/null and b/public/fonts/sukhumvit-set/SukhumvitSet-SemiBold.ttf differ
diff --git a/public/fonts/sukhumvit-set/SukhumvitSet-Text.ttf b/public/fonts/sukhumvit-set/SukhumvitSet-Text.ttf
new file mode 100644
index 0000000..69c3c6c
Binary files /dev/null and b/public/fonts/sukhumvit-set/SukhumvitSet-Text.ttf differ
diff --git a/public/fonts/sukhumvit-set/SukhumvitSet-Thin.ttf b/public/fonts/sukhumvit-set/SukhumvitSet-Thin.ttf
new file mode 100644
index 0000000..da6c626
Binary files /dev/null and b/public/fonts/sukhumvit-set/SukhumvitSet-Thin.ttf differ
diff --git a/src/assets/blue-lagoon.png b/src/assets/elements/blue-lagoon.png
similarity index 100%
rename from src/assets/blue-lagoon.png
rename to src/assets/elements/blue-lagoon.png
diff --git a/src/assets/bottle.png b/src/assets/elements/bottle.png
similarity index 100%
rename from src/assets/bottle.png
rename to src/assets/elements/bottle.png
diff --git a/src/assets/cake-1.png b/src/assets/elements/cake-1.png
similarity index 100%
rename from src/assets/cake-1.png
rename to src/assets/elements/cake-1.png
diff --git a/src/assets/cake-2.png b/src/assets/elements/cake-2.png
similarity index 100%
rename from src/assets/cake-2.png
rename to src/assets/elements/cake-2.png
diff --git a/src/assets/calendar.png b/src/assets/elements/calendar.png
similarity index 100%
rename from src/assets/calendar.png
rename to src/assets/elements/calendar.png
diff --git a/src/assets/casette.png b/src/assets/elements/casette.png
similarity index 100%
rename from src/assets/casette.png
rename to src/assets/elements/casette.png
diff --git a/src/assets/Cosmopolitan.png b/src/assets/elements/cosmopolitan.png
similarity index 100%
rename from src/assets/Cosmopolitan.png
rename to src/assets/elements/cosmopolitan.png
diff --git a/src/assets/donut.png b/src/assets/elements/donut.png
similarity index 100%
rename from src/assets/donut.png
rename to src/assets/elements/donut.png
diff --git a/src/assets/drinks.png b/src/assets/elements/drinks.png
similarity index 100%
rename from src/assets/drinks.png
rename to src/assets/elements/drinks.png
diff --git a/src/assets/gin-and-tonic.png b/src/assets/elements/gin-and-tonic.png
similarity index 100%
rename from src/assets/gin-and-tonic.png
rename to src/assets/elements/gin-and-tonic.png
diff --git a/src/assets/headphone.png b/src/assets/elements/headphone.png
similarity index 100%
rename from src/assets/headphone.png
rename to src/assets/elements/headphone.png
diff --git a/src/assets/heart-1.png b/src/assets/elements/heart-1.png
similarity index 100%
rename from src/assets/heart-1.png
rename to src/assets/elements/heart-1.png
diff --git a/src/assets/heart-2.png b/src/assets/elements/heart-2.png
similarity index 100%
rename from src/assets/heart-2.png
rename to src/assets/elements/heart-2.png
diff --git a/src/assets/icecream-1.png b/src/assets/elements/icecream-1.png
similarity index 100%
rename from src/assets/icecream-1.png
rename to src/assets/elements/icecream-1.png
diff --git a/src/assets/icecream-2.png b/src/assets/elements/icecream-2.png
similarity index 100%
rename from src/assets/icecream-2.png
rename to src/assets/elements/icecream-2.png
diff --git a/src/assets/elements/lavender-lemonade.png b/src/assets/elements/lavender-lemonade.png
new file mode 100644
index 0000000..ad80083
Binary files /dev/null and b/src/assets/elements/lavender-lemonade.png differ
diff --git a/src/assets/letter.png b/src/assets/elements/letter.png
similarity index 100%
rename from src/assets/letter.png
rename to src/assets/elements/letter.png
diff --git a/src/assets/lightning.png b/src/assets/elements/lightning.png
similarity index 100%
rename from src/assets/lightning.png
rename to src/assets/elements/lightning.png
diff --git a/src/assets/elements/logo.png b/src/assets/elements/logo.png
new file mode 100644
index 0000000..d897753
Binary files /dev/null and b/src/assets/elements/logo.png differ
diff --git a/src/assets/music.png b/src/assets/elements/music.png
similarity index 100%
rename from src/assets/music.png
rename to src/assets/elements/music.png
diff --git a/src/assets/orange.png b/src/assets/elements/orange.png
similarity index 100%
rename from src/assets/orange.png
rename to src/assets/elements/orange.png
diff --git a/src/assets/palette.png b/src/assets/elements/palette.png
similarity index 100%
rename from src/assets/palette.png
rename to src/assets/elements/palette.png
diff --git a/src/assets/pina-colada.png b/src/assets/elements/pina-colada.png
similarity index 100%
rename from src/assets/pina-colada.png
rename to src/assets/elements/pina-colada.png
diff --git a/src/assets/radio.png b/src/assets/elements/radio.png
similarity index 100%
rename from src/assets/radio.png
rename to src/assets/elements/radio.png
diff --git a/src/assets/rose.png b/src/assets/elements/rose.png
similarity index 100%
rename from src/assets/rose.png
rename to src/assets/elements/rose.png
diff --git a/src/assets/strawberry.png b/src/assets/elements/strawberry.png
similarity index 100%
rename from src/assets/strawberry.png
rename to src/assets/elements/strawberry.png
diff --git a/src/assets/elements/summer-berry-sangria.png b/src/assets/elements/summer-berry-sangria.png
new file mode 100644
index 0000000..feef440
Binary files /dev/null and b/src/assets/elements/summer-berry-sangria.png differ
diff --git a/src/assets/vinyl.png b/src/assets/elements/vinyl.png
similarity index 100%
rename from src/assets/vinyl.png
rename to src/assets/elements/vinyl.png
diff --git a/src/assets/lavender-lemonade.png b/src/assets/lavender-lemonade.png
deleted file mode 100644
index 3669a8f..0000000
Binary files a/src/assets/lavender-lemonade.png and /dev/null differ
diff --git a/src/assets/summer-berry-sangria.png b/src/assets/summer-berry-sangria.png
deleted file mode 100644
index 9b05d2e..0000000
Binary files a/src/assets/summer-berry-sangria.png and /dev/null differ
diff --git a/src/components/story/Button.tsx b/src/components/story/Button.tsx
new file mode 100644
index 0000000..1aff750
--- /dev/null
+++ b/src/components/story/Button.tsx
@@ -0,0 +1,17 @@
+interface Props {
+ text: string;
+ handleClick?: () => void;
+}
+
+const Button = ({ text, handleClick }: Props) => {
+ return (
+
+ {text}
+
+ );
+};
+
+export default Button;
diff --git a/src/components/story/ButtonSet.tsx b/src/components/story/ButtonSet.tsx
new file mode 100644
index 0000000..dcc38b3
--- /dev/null
+++ b/src/components/story/ButtonSet.tsx
@@ -0,0 +1,47 @@
+import { BACKGROUND_BOX, TEXT, type Cocktail } from "@/data/cocktail";
+import { cn } from "@/lib/utils";
+import * as htmlToImage from "html-to-image";
+interface Props extends Cocktail {}
+
+const ButtonSet = ({ variant }: Props): JSX.Element => {
+ const downloadImage = () => {
+ const result = document.getElementById("result");
+ if (!result) return;
+ htmlToImage.toJpeg(result, { quality: 0.96 }).then(function (dataUrl) {
+ const link = document.createElement("a");
+ link.download = "result.jpeg";
+ link.href = dataUrl;
+ link.click();
+ });
+ };
+
+ return (
+
+ );
+};
+
+export default ButtonSet;
diff --git a/src/components/story/Card.tsx b/src/components/story/Card.tsx
new file mode 100644
index 0000000..92d480f
--- /dev/null
+++ b/src/components/story/Card.tsx
@@ -0,0 +1,36 @@
+import { useRef, type ReactNode } from "react";
+
+import { cn } from "@/lib/utils";
+
+import { BACKGROUND_BOX, NAME, TEXT, type Cocktail } from "@/data/cocktail";
+
+interface Props extends Cocktail {
+ children: ReactNode;
+ img: string;
+}
+
+const Card = ({ variant, children, img }: Props) => {
+ const ref = useRef(null);
+
+ return (
+
+
+
+
+ {NAME[variant]}
+
+
+ {children}
+
+
+
+ );
+};
+
+export default Card;
diff --git a/src/components/story/ChoiceCard.tsx b/src/components/story/ChoiceCard.tsx
new file mode 100644
index 0000000..7d18c20
--- /dev/null
+++ b/src/components/story/ChoiceCard.tsx
@@ -0,0 +1,22 @@
+import type { ReactNode } from "react";
+
+interface Props {
+ header: string;
+ children: ReactNode;
+}
+
+const ChoiceCard = ({ header, children }: Props) => {
+ return (
+
+
+ {header}
+
+ {children}
+
+ );
+};
+
+export default ChoiceCard;
diff --git a/src/components/story/FooterDecorator.astro b/src/components/story/FooterDecorator.astro
new file mode 100644
index 0000000..dce0c35
--- /dev/null
+++ b/src/components/story/FooterDecorator.astro
@@ -0,0 +1,63 @@
+---
+import { Image } from "astro:assets";
+
+import Cake1 from "@/assets/elements/cake-1.png";
+import Calendar from "@/assets/elements/calendar.png";
+import Donut from "@/assets/elements/donut.png";
+import Drinks from "@/assets/elements/drinks.png";
+import Heart1 from "@/assets/elements/heart-1.png";
+import Letter from "@/assets/elements/letter.png";
+import Orange from "@/assets/elements/orange.png";
+import Palette from "@/assets/elements/palette.png";
+import Strawberry from "@/assets/elements/strawberry.png";
+---
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/components/story/ScoredButton.tsx b/src/components/story/ScoredButton.tsx
new file mode 100644
index 0000000..5f1d2e9
--- /dev/null
+++ b/src/components/story/ScoredButton.tsx
@@ -0,0 +1,17 @@
+import { addScores } from "../../store/score.ts";
+import Button from "./Button";
+
+interface Props {
+ text: string;
+ scores: number[];
+}
+
+const ScoredButton = ({ text, scores }: Props): JSX.Element => {
+ const handleClick = () => {
+ addScores(scores);
+ };
+
+ return ;
+};
+
+export default ScoredButton;
diff --git a/src/components/story/Tap.tsx b/src/components/story/Tap.tsx
new file mode 100644
index 0000000..759c0db
--- /dev/null
+++ b/src/components/story/Tap.tsx
@@ -0,0 +1,39 @@
+import scores from "../../store/score.ts";
+const score = scores.get();
+interface Props {
+ redirect?: string;
+ scored?: boolean;
+}
+
+const Tap = ({ redirect, scored }: Props) => {
+ if (scored) {
+ const url = {
+ 0: "../cocktail/sangria",
+ 1: "../cocktail/cosmopolitan",
+ 2: "../cocktail/pinacolada",
+ 3: "../cocktail/ginandtonic",
+ 4: "../cocktail/bluelagoon",
+ 5: "../cocktail/lavenderlemonade",
+ };
+ const scoreMap: { [key: string]: number } = score;
+ const fullscore = [16, 15, 16, 15, 17, 13];
+ const product: number[] = [];
+ for (let i = 0; i < fullscore.length; i++) {
+ product.push(scoreMap[i] / fullscore[i]);
+ }
+ const maxScore = Math.max(...product);
+ const maxKey = product.indexOf(maxScore);
+ redirect = url[maxKey];
+ }
+ return (
+
+
+ Tap to
+
+ continue
+
+
+ );
+};
+
+export default Tap;
diff --git a/src/data/cocktail.ts b/src/data/cocktail.ts
new file mode 100644
index 0000000..4b73aed
--- /dev/null
+++ b/src/data/cocktail.ts
@@ -0,0 +1,40 @@
+export interface Cocktail {
+ variant: "raspberry" | "cosmo" | "pina" | "gin" | "lagoon" | "lalemon";
+}
+
+export const BACKGROUND: Record = {
+ raspberry: "bg-raspberry",
+ cosmo: "bg-cosmo",
+ pina: "bg-pina",
+ gin: "bg-gin",
+ lagoon: "bg-lagoon",
+ lalemon: "bg-lalemon",
+};
+
+export const BACKGROUND_BOX: Record = {
+ raspberry: "bg-raspberrybox",
+ cosmo: "bg-cosmobox",
+ pina: "bg-pinabox",
+ gin: "bg-ginbox",
+ lagoon: "bg-lagoonbox",
+ lalemon: "bg-lalemonbox",
+};
+
+export const TEXT: Record = {
+ raspberry: "text-salmon",
+ cosmo: "text-peach",
+ pina: "text-pineapple",
+ gin: "text-leaf",
+ lagoon: "text-tropical",
+ lalemon: "text-lavender",
+};
+
+export const NAME: Record = {
+ raspberry: "Summer Berry Sangria",
+ cosmo: "Cosmopolitan",
+ pina: "Pina Colada",
+ gin: "Gin and Tonic",
+ lagoon: "Blue Lagoon",
+ lalemon: "Lavender Lemonade",
+};
+
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index f688a8c..40224f2 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -1,6 +1,6 @@
---
-import "@/styles/global.css";
-
+import "@/style.css";
+import { ViewTransitions } from "astro:transitions";
interface Props {
pageTitle?: string;
}
@@ -15,10 +15,11 @@ const { pageTitle = "GearFestival" } = Astro.props;
{pageTitle}
+
diff --git a/src/layouts/CocktailCard.astro b/src/layouts/CocktailCard.astro
new file mode 100644
index 0000000..f58f3fd
--- /dev/null
+++ b/src/layouts/CocktailCard.astro
@@ -0,0 +1,34 @@
+---
+import { Image } from "astro:assets";
+
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import Card from "@/components/story/Card";
+import ButtonSet from "@/components/story/ButtonSet";
+import FooterDecorator from "@/components/story/FooterDecorator.astro";
+
+import Logo from "@/assets/elements/logo.png";
+import { BACKGROUND, type Cocktail } from "@/data/cocktail";
+
+interface Props extends Cocktail {
+ img: string;
+}
+
+const { variant, img } = Astro.props;
+---
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
new file mode 100644
index 0000000..21fe2b7
--- /dev/null
+++ b/src/lib/utils.ts
@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+export function cn(...args: ClassValue[]) {
+ return twMerge(clsx(args));
+}
diff --git a/src/pages/cocktail/bluelagoon.astro b/src/pages/cocktail/bluelagoon.astro
new file mode 100644
index 0000000..8444aff
--- /dev/null
+++ b/src/pages/cocktail/bluelagoon.astro
@@ -0,0 +1,26 @@
+---
+import CocktailCard from "@/layouts/CocktailCard.astro";
+import BlueLagoon from "@/assets/elements/blue-lagoon.png";
+---
+
+
+ บลู ลากูน – เครื่องดื่มสีสดใสที่เกิดจากการผสมกันระหว่าง
+ วอดก้า บลูคูราโซ่ และน้ำมะนาว เนื่องด้วยรสชาติที่ให้ความสดชื่น
+ และสีสันที่สวยงามจึงเป็นเครื่องดื่มที่มักเป็นที่นิยมในงานสังสรรค์
+
+ คุณเปรียบเสมือนค็อกเทลดังกล่าว คุณเป็นมนุษย์ที่ชอบเข้าสังคม สดใส ร่าเริง
+ ชอบพูดคุยและทำความรู้จักกับผู้คนใหม่ ๆ
+ เปรียบเหมือนผีเสื้อที่บินไปหาดอกไม้มากมาย
+
+ คุณเป็นคนที่มีความเป็นเด็กน้อยในตัวสูง
+ ตื่นเต้นกับสิ่งที่แปลกใหม่รอบตัวจนในบางทีคุณอาจจะมีแนวโน้มที่จะเป็นคนเบื่อง่าย
+
+
+
+ ถึงแม้ภายนอกคุณจะดูสดใส แต่จริง ๆ
+ คุณก็มีมุมที่มีความลึกลับที่คนนอกอาจจะเข้าไม่ถึง
+
+ “Love has absolutely no pattern,
+ and no one will ever be perfect“
+ —Taylor swift
+
diff --git a/src/pages/cocktail/cosmopolitan.astro b/src/pages/cocktail/cosmopolitan.astro
new file mode 100644
index 0000000..094db3d
--- /dev/null
+++ b/src/pages/cocktail/cosmopolitan.astro
@@ -0,0 +1,26 @@
+---
+import CocktailCard from "@/layouts/CocktailCard.astro";
+import Cosmo from "@/assets/elements/cosmopolitan.png";
+---
+
+
+ วอดก้า แครนเบอรี่ และน้ำมะนาว สามส่วนผสมหลักที่เข้ากันได้อย่างไม่น่าเชื่อ
+ รวมกันเป็นค็อกเทลรสเปรี้ยวอมหวานสีชมพูสดใส
+ ที่ครองใจสาว ๆ นักดื่มทั่วโลก
+
+ คุณเปรียบเสมือนค็อกเทลดังกล่าว คุณเป็นคนขี้เล่น มีเสน่ห์
+ และมักจะเต็มเปี่ยมไปด้วยพลังงานในการทำสิ่งต่าง ๆ
+ คุณเป็นคนที่ให้ลุคสบาย ๆ แต่ในขณะเดียวกัน ก็แฝงไปด้วยความมั่นใจในตนเอง
+ มีอารมณ์ขัน
+ และเป็นคนที่มักจะปล่อยวางในสถานการณ์ที่ควบคุมไม่ได้ได้ดี
+ แต่ในบางครั้งด้วยความที่คุณเป็นคนคารมคมคาย
+
+ คนอื่นอาจมองว่าคุณเป็นคนเจ้าชู้ ไม่จริงจังกับความสัมพันธ์
+ จากการที่คุณสามารถเข้ากับคนง่าย
+ คุณอาจจะต้องใช้ระยะเวลาและความจริงใจในการพิสูจน์
+ ซึ่งหากผ่านพ้นไปได้แล้วจะได้เจอกับความรักที่คุณตามหาแน่นอน
+
+ “Love has absolutely no pattern,
+ and no one will ever be perfect“
+ —Taylor swift
+
diff --git a/src/pages/cocktail/ginandtonic.astro b/src/pages/cocktail/ginandtonic.astro
new file mode 100644
index 0000000..ea33a7d
--- /dev/null
+++ b/src/pages/cocktail/ginandtonic.astro
@@ -0,0 +1,25 @@
+---
+import CocktailCard from "@/layouts/CocktailCard.astro";
+import Gin from "@/assets/elements/gin-and-tonic.png";
+---
+
+
+ ด้วยรสซิตรัสจาก “จิน”
+ สุรากลั่นจากเมล็ดข้าวซึ่งมีกลิ่นหอมสดชื่นอันเป็นเอกลักษณ์จากผลจูนิเปอร์
+ ผสมผสานกับ “โทนิค” เครื่องดื่มอัดแก๊สรสขมเพิ่มความซาบซ่า
+ ทำให้ค็อกเทลรสชาติจัดจ้านนี้กลายมาเป็นค็อกเทลยอดนิยมทั่วโลก
+
+ คุณเปรียบเสมือนค็อกเทลดังกล่าว
+ คุณเป็นมนุษย์ผู้รักความสมบูรณ์แบบ
+ มักจะรู้สึกหงุดหงิดเมื่อผู้คนรอบข้างปฏิบัติตัวไม่ตรงตามสิ่งที่คุณคาดหวังให้พวกเขาทำ
+
+
+ คุณเป็นคนที่หนักแน่นและซื่อสัตย์กับความรู้สึกของตนเอง
+ ยอมหักไม่ยอมงอ นอกจากนี้คุณยังใช้ชีวิตอย่างมีแบบแผน
+ และตั้งอยู่บนหลักความเป็นจริง
+
+ แต่ในบางครั้งคุณยึดติดกับแบบแผนของตนเองมากเกินไปจนละเลยความรู้สึกของคนรอบตัว
+
+ อย่าลืมที่จะปลอยวางสิ่งที่คุณยึดถือไว้
+ และหันมาใส่ใจสิ่งที่เกิดขึ้นรอบตัว โดยพยายามไม่ละเลยความรู้สึกตนเองด้วยล่ะ
+
diff --git a/src/pages/cocktail/lavenderlemonade.astro b/src/pages/cocktail/lavenderlemonade.astro
new file mode 100644
index 0000000..56b58f1
--- /dev/null
+++ b/src/pages/cocktail/lavenderlemonade.astro
@@ -0,0 +1,27 @@
+---
+import CocktailCard from "@/layouts/CocktailCard.astro";
+import Lavender from "@/assets/elements/lavender-lemonade.png";
+---
+
+
+ ลาเวนเดอร์ เลมอนเนด จิน ค็อกเทลสีม่วงน่าค้นหา
+ พร้อมส่วนผสมที่ประกอบไปด้วยจิน, น้ำเลม่อน, น้ำเชื่อมลาเวนเดอร์
+ และน้ำโซดา สร้างความซับซ้อนในรสชาติ มีรสฝาดจากน้ำมะนาว
+ และกลิ่นหอมหวานจากดอกลาเวนเดอร์ เป็นเครื่องดื่มที่มีความลึกซึ้งในรสชาติ
+
+ คุณเปรียบเสมือนค็อกเทลดังกล่าว
+ คุณเป็นคนที่อ่อนโยนและลึกซึ้งในเรื่องของความสัมพันธ์
+ คุณเป็นคนละเอียดในทุกการกระทำ
+ และมักจะมีความเห็นอกเห็นใจผู้อื่นอยู่เสมอ
+ ทำให้ใครหลายคนมักนิยามคุณว่าคุณคือผู้ฟังที่ดี
+
+ คุณมีมุมที่เป็นคนอ่อนไหวได้ง่าย
+ ในบางครั้งคุณอาจจะนึกถึงการกระทำ หรือคำพูดที่เกิดขึ้นในอดีต
+ ที่ทำให้คุณรู้สึกไม่ดีอยากจะกลับไปแก้ไข
+ แต่อย่าลืมที่จะพยายามปล่อยวางเรื่องทุกข์ใจเหล่านี้โดยหันมาโอบกอดตัวเองให้แน่นในการให้อภัย
+ ละทิ้งซึ่งอดีต และเดินหน้าไปต่ออย่างภาคภูมินะ
+
+ “Love has absolutely no pattern,
+ and no one will ever be perfect“
+ —Taylor swift
+
diff --git a/src/pages/cocktail/pinacolada.astro b/src/pages/cocktail/pinacolada.astro
new file mode 100644
index 0000000..bddb1c7
--- /dev/null
+++ b/src/pages/cocktail/pinacolada.astro
@@ -0,0 +1,27 @@
+---
+import CocktailCard from "@/layouts/CocktailCard.astro";
+import Pina from "@/assets/elements/pina-colada.png";
+---
+
+
+ น้ำสับปะรด, รัม, และครีมมะพร้าว
+ ทั้งสามสิ่งนี้คือส่วนผสมหลักที่ประกอบออกมาเป็นพีน่า โคลาดา
+ เครื่องดื่มที่ให้ความรู้สึกถึงฤดูร้อนที่แดดจ้า
+ เมื่อดื่มรู้สึกสดชื่นจากส่วนผสมหลักอย่างน้ำสับปะรด
+ ที่มีรสชาติเปรี้ยว ตัดกับความหวาานของครีมมะพร้าว
+ และความกลมกล่อมจากเหล้ารัม
+
+ คุณเปรียบเสมือนค็อกเทลดังกล่าว เป็นมนุษย์ที่มีความทะเยอทะยาน
+ และมีแพชชั่นที่ร้อนแรงในการทำสิ่งต่าง ๆ
+ คุณเป็นคนที่มีความอิสระโลดโผนในตัวสูง มีความคิดเป็นของตนเอง
+ และมีความมั่นใจในการทำสิ่งต่าง ๆ เปรียบเหมือนบรรยากาศริมชายทะเลที่มีแดดจ้า
+
+
+ บางครั้งคุณอาจจะเบื่อกับการใช้ชีวิต ทำให้คุณมักจะหาสิ่งใหม่ ๆ ทำ
+ เพื่อเป็นท้าทายตนเอง คุณมักจะมีมุมที่มีความเป็นศิลปินในตนเองสูง
+ ทำให้หลาย ๆ คนอาจจะตามคุณไม่ทัน
+
+ “Love has absolutely no pattern,
+ and no one will ever be perfect“
+ —Taylor swift
+
diff --git a/src/pages/cocktail/sangria.astro b/src/pages/cocktail/sangria.astro
new file mode 100644
index 0000000..2b20c88
--- /dev/null
+++ b/src/pages/cocktail/sangria.astro
@@ -0,0 +1,29 @@
+---
+import CocktailCard from "@/layouts/CocktailCard.astro";
+import SBSangria from "@/assets/elements/summer-berry-sangria.png";
+---
+
+
+ เครื่องดื่มสีสดใสที่ประกอบไปด้วยไวน์ขาว, เตกีล่า, น้ำผลไม้, บลูเบอร์รี่,
+ สตรอเบอร์รี่, ราสเบอร์รี่ และ เลม่อนโซดา
+
+ ซัมเมอร์ เบอร์รี่ แซงเกรียถูกจัดว่าเป็นเครื่องดื่มที่มักเสิร์ฟในงานสังสรรค์
+ และเป็นที่นิยมในประเทศสเปน ซึ่งเป็นแหล่งกำเนิดของเครื่องดื่มชนิดนี้
+
+ คุณเปรียบเสมือนค็อกเทลดังกล่าว
+ คุณชื่นชอบในการอยู่ในที่ที่คุณรู้สึกสบายใจหรือกับกลุ่มคนที่เป็นที่พักพิงทางใจ
+
+ ด้วยค็อกเทลดังกล่าวประกอบไปด้วยวัตถุดิบที่ดื่มได้ง่าย
+ มีรสชาติกล่มกล่อม เหมือนกับตัวคุณที่มักจะปรับตัวเข้ากับ
+ สังคมใหม่ ๆ ได้ง่ายกว่าใครหลายคน
+
+ คุณชื่นชอบที่จะช่วยเหลือผู้อื่นและทำให้ผู้อื่นมีความสุข
+ จนบางครั้ง
+ อาจเป็นตัวคุณเองที่ไม่สบายใจในการตัดสินใจทำบางอย่างเพื่อผู้อื่น
+ อย่าลืมหันมาให้ความสนใจกับตนเอง
+ โดยให้การมอบสิ่งที่ดีแก่ผู้อื่นของคุณสมดุลกับการรักษาใจคุณเองด้วยนะ
+
+ “Love has absolutely no pattern,
+ and no one will ever be perfect“
+ —Taylor swift
+
diff --git a/src/pages/story/1.astro b/src/pages/story/1.astro
new file mode 100644
index 0000000..11e8127
--- /dev/null
+++ b/src/pages/story/1.astro
@@ -0,0 +1,19 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import Button from "../../components/story/Button";
+import ChoiceCard from "../../components/story/ChoiceCard";
+const redirect = "./2";
+---
+
+
+
+
diff --git a/src/pages/story/2.astro b/src/pages/story/2.astro
new file mode 100644
index 0000000..5fdbfa1
--- /dev/null
+++ b/src/pages/story/2.astro
@@ -0,0 +1,19 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import ChoiceCard from "../../components/story/ChoiceCard";
+import ScoredButton from "@/components/story/ScoredButton";
+const redirect = "./3";
+---
+
+
+
+
diff --git a/src/pages/story/3.astro b/src/pages/story/3.astro
new file mode 100644
index 0000000..1565cb1
--- /dev/null
+++ b/src/pages/story/3.astro
@@ -0,0 +1,9 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import Tap from "../../components/story/Tap";
+---
+
+
+ นี่คือหน้าเปล่าที่แตะแล้วไปต่อได้
+
+
diff --git a/src/pages/story/4.astro b/src/pages/story/4.astro
new file mode 100644
index 0000000..1c70771
--- /dev/null
+++ b/src/pages/story/4.astro
@@ -0,0 +1,7 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+---
+
+
+ Well done!
+
diff --git a/src/pages/story/Q1.astro b/src/pages/story/Q1.astro
new file mode 100644
index 0000000..2965f45
--- /dev/null
+++ b/src/pages/story/Q1.astro
@@ -0,0 +1,31 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import ScoredButton from "@/components/story/ScoredButton";
+import ChoiceCard from "@/components/story/ChoiceCard";
+const redirect = "./Q2";
+---
+
+
+
+
diff --git a/src/pages/story/Q10.astro b/src/pages/story/Q10.astro
new file mode 100644
index 0000000..9a4a9e8
--- /dev/null
+++ b/src/pages/story/Q10.astro
@@ -0,0 +1,18 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import Button from "@/components/story/Button";
+import ChoiceCard from "@/components/story/ChoiceCard";
+const redirect = "./Scene14"; //Temporary: Skip to the end of the story
+---
+
+
+
+
diff --git a/src/pages/story/Q2.astro b/src/pages/story/Q2.astro
new file mode 100644
index 0000000..c3f1861
--- /dev/null
+++ b/src/pages/story/Q2.astro
@@ -0,0 +1,21 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import Button from "@/components/story/Button";
+import ChoiceCard from "@/components/story/ChoiceCard";
+---
+
+
+
+
diff --git a/src/pages/story/Q3A.astro b/src/pages/story/Q3A.astro
new file mode 100644
index 0000000..c2c371d
--- /dev/null
+++ b/src/pages/story/Q3A.astro
@@ -0,0 +1,31 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import ScoredButton from "@/components/story/ScoredButton";
+import ChoiceCard from "@/components/story/ChoiceCard";
+const redirect = "./Scene3";
+---
+
+
+
+
diff --git a/src/pages/story/Q3B.astro b/src/pages/story/Q3B.astro
new file mode 100644
index 0000000..ffe54b5
--- /dev/null
+++ b/src/pages/story/Q3B.astro
@@ -0,0 +1,31 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import ScoredButton from "@/components/story/ScoredButton";
+import ChoiceCard from "@/components/story/ChoiceCard";
+const redirect = "./Scene3";
+---
+
+
+
+
diff --git a/src/pages/story/Q3C.astro b/src/pages/story/Q3C.astro
new file mode 100644
index 0000000..ef2ef7a
--- /dev/null
+++ b/src/pages/story/Q3C.astro
@@ -0,0 +1,36 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import ScoredButton from "@/components/story/ScoredButton";
+import ChoiceCard from "@/components/story/ChoiceCard";
+const redirect = "./Scene3";
+---
+
+
+
+
diff --git a/src/pages/story/Q4.astro b/src/pages/story/Q4.astro
new file mode 100644
index 0000000..b15d700
--- /dev/null
+++ b/src/pages/story/Q4.astro
@@ -0,0 +1,20 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import Button from "@/components/story/Button";
+import ChoiceCard from "@/components/story/ChoiceCard";
+const redirect = "./Q5";
+---
+
+
+
+
diff --git a/src/pages/story/Q5.astro b/src/pages/story/Q5.astro
new file mode 100644
index 0000000..4fbbfdd
--- /dev/null
+++ b/src/pages/story/Q5.astro
@@ -0,0 +1,43 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import ScoredButton from "@/components/story/ScoredButton";
+import ChoiceCard from "@/components/story/ChoiceCard";
+const redirect = "./Scene4";
+---
+
+
+
+
diff --git a/src/pages/story/Q6.astro b/src/pages/story/Q6.astro
new file mode 100644
index 0000000..972f638
--- /dev/null
+++ b/src/pages/story/Q6.astro
@@ -0,0 +1,22 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import ScoredButton from "@/components/story/ScoredButton";
+import ChoiceCard from "@/components/story/ChoiceCard";
+const redirect = "./Scene5";
+---
+
+
+
+
diff --git a/src/pages/story/Q7.astro b/src/pages/story/Q7.astro
new file mode 100644
index 0000000..c772321
--- /dev/null
+++ b/src/pages/story/Q7.astro
@@ -0,0 +1,31 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import ScoredButton from "@/components/story/ScoredButton";
+import ChoiceCard from "@/components/story/ChoiceCard";
+const redirect = "./Scene7";
+---
+
+
+
+
diff --git a/src/pages/story/Q8.astro b/src/pages/story/Q8.astro
new file mode 100644
index 0000000..b2ac2fb
--- /dev/null
+++ b/src/pages/story/Q8.astro
@@ -0,0 +1,26 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import ScoredButton from "@/components/story/ScoredButton";
+import ChoiceCard from "@/components/story/ChoiceCard";
+const redirect = "./Scene9";
+---
+
+
+
+
diff --git a/src/pages/story/Q9.astro b/src/pages/story/Q9.astro
new file mode 100644
index 0000000..e88e98d
--- /dev/null
+++ b/src/pages/story/Q9.astro
@@ -0,0 +1,31 @@
+---
+import BaseLayout from "@/layouts/BaseLayout.astro";
+import ScoredButton from "@/components/story/ScoredButton";
+import ChoiceCard from "@/components/story/ChoiceCard";
+const redirect = "./Scene10";
+---
+
+
+
+
diff --git a/src/pages/story/Scene10.astro b/src/pages/story/Scene10.astro
new file mode 100644
index 0000000..4efb7bd
--- /dev/null
+++ b/src/pages/story/Scene10.astro
@@ -0,0 +1,9 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import Tap from "../../components/story/Tap";
+---
+
+
+ นี่คือหน้าเปล่าที่แตะแล้วไปต่อได้
+
+
diff --git a/src/pages/story/Scene14.astro b/src/pages/story/Scene14.astro
new file mode 100644
index 0000000..8831ac0
--- /dev/null
+++ b/src/pages/story/Scene14.astro
@@ -0,0 +1,9 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import Tap from "../../components/story/Tap";
+---
+
+
+ นี่คือหน้าเปล่าที่แตะแล้วไปต่อได้ แต่เป็นหน้าสุดท้าย
+
+
diff --git a/src/pages/story/Scene3.astro b/src/pages/story/Scene3.astro
new file mode 100644
index 0000000..d44634b
--- /dev/null
+++ b/src/pages/story/Scene3.astro
@@ -0,0 +1,9 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import Tap from "../../components/story/Tap";
+---
+
+
+ นี่คือหน้าเปล่าที่แตะแล้วไปต่อได้
+
+
diff --git a/src/pages/story/Scene4.astro b/src/pages/story/Scene4.astro
new file mode 100644
index 0000000..2a14408
--- /dev/null
+++ b/src/pages/story/Scene4.astro
@@ -0,0 +1,9 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import Tap from "../../components/story/Tap";
+---
+
+
+ นี่คือหน้าเปล่าที่แตะแล้วไปต่อได้
+
+
diff --git a/src/pages/story/Scene5.astro b/src/pages/story/Scene5.astro
new file mode 100644
index 0000000..3114df0
--- /dev/null
+++ b/src/pages/story/Scene5.astro
@@ -0,0 +1,9 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import Tap from "../../components/story/Tap";
+---
+
+
+ นี่คือหน้าเปล่าที่แตะแล้วไปต่อได้
+
+
diff --git a/src/pages/story/Scene6.astro b/src/pages/story/Scene6.astro
new file mode 100644
index 0000000..a786a87
--- /dev/null
+++ b/src/pages/story/Scene6.astro
@@ -0,0 +1,9 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import Tap from "../../components/story/Tap";
+---
+
+
+ นี่คือหน้าเปล่าที่แตะแล้วไปต่อได้ ไม่อร่อย
+
+
diff --git a/src/pages/story/Scene7.astro b/src/pages/story/Scene7.astro
new file mode 100644
index 0000000..b994684
--- /dev/null
+++ b/src/pages/story/Scene7.astro
@@ -0,0 +1,9 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import Tap from "../../components/story/Tap";
+---
+
+
+ นี่คือหน้าเปล่าที่แตะแล้วไปต่อได้
+
+
diff --git a/src/pages/story/Scene8.astro b/src/pages/story/Scene8.astro
new file mode 100644
index 0000000..2a14408
--- /dev/null
+++ b/src/pages/story/Scene8.astro
@@ -0,0 +1,9 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import Tap from "../../components/story/Tap";
+---
+
+
+ นี่คือหน้าเปล่าที่แตะแล้วไปต่อได้
+
+
diff --git a/src/pages/story/Scene9.astro b/src/pages/story/Scene9.astro
new file mode 100644
index 0000000..4767563
--- /dev/null
+++ b/src/pages/story/Scene9.astro
@@ -0,0 +1,9 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+import Tap from "../../components/story/Tap";
+---
+
+
+ นี่คือหน้าเปล่าที่แตะแล้วไปต่อได้
+
+
diff --git a/src/store/score.ts b/src/store/score.ts
index e889735..62afe5b 100644
--- a/src/store/score.ts
+++ b/src/store/score.ts
@@ -1,12 +1,12 @@
import { persistentAtom } from "@nanostores/persistent";
const initialValue: Record = {
+ 0: 0,
1: 0,
2: 0,
3: 0,
4: 0,
5: 0,
- 6: 0,
};
const scores = persistentAtom("scores", initialValue, {
diff --git a/src/style.css b/src/style.css
new file mode 100644
index 0000000..d449964
--- /dev/null
+++ b/src/style.css
@@ -0,0 +1,47 @@
+@font-face {
+ font-family: "SukhumvitSet";
+ src: url("/fonts/sukhumvit-set/SukhumvitSet-Text.ttf");
+ font-weight: normal;
+ font-style: normal;
+ font-display: swap;
+}
+
+@font-face {
+ font-family: "SukhumvitSet";
+ src: url("/fonts/sukhumvit-set/SukhumvitSet-Bold.ttf");
+ font-weight: bold;
+ font-style: normal;
+ font-display: swap;
+}
+
+@font-face {
+ font-family: "SukhumvitSet";
+ src: url("/fonts/sukhumvit-set/SukhumvitSet-SemiBold.ttf");
+ font-weight: 600;
+ font-style: normal;
+ font-display: swap;
+}
+
+@font-face {
+ font-family: "SukhumvitSet";
+ src: url("/fonts/sukhumvit-set/SukhumvitSet-Medium.ttf");
+ font-weight: 500;
+ font-style: normal;
+ font-display: swap;
+}
+
+@font-face {
+ font-family: "SukhumvitSet";
+ src: url("/fonts/sukhumvit-set/SukhumvitSet-Light.ttf");
+ font-weight: 300;
+ font-style: normal;
+ font-display: swap;
+}
+
+@font-face {
+ font-family: "SukhumvitSet";
+ src: url("/fonts/sukhumvit-set/SukhumvitSet-Thin.ttf");
+ font-weight: 100;
+ font-style: normal;
+ font-display: swap;
+}
diff --git a/tailwind.config.mjs b/tailwind.config.mjs
index ecb545c..6f1506f 100644
--- a/tailwind.config.mjs
+++ b/tailwind.config.mjs
@@ -1,17 +1,46 @@
-const { addDynamicIconSelectors } = require("@iconify/tailwind");
+import { addDynamicIconSelectors } from "@iconify/tailwind";
+import defaultTheme from "tailwindcss/defaultTheme";
/** @type {import('tailwindcss').Config} */
export default {
content: ["./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}"],
theme: {
extend: {
- colors: {
- primary: "#864974",
- base: "#E0E0E0",
+ fontFamily: {
+ sans: ["SukhumvitSet", ...defaultTheme.fontFamily.sans],
},
backgroundImage: {
signin:
"url(/src/assets/images/grain-bg.png), linear-gradient(170deg, #A283AB -10.14%, #0D3C56 69.45%);",
+ raspberry:
+ 'url("/src/assets/images/grain-bg.png"), linear-gradient(170deg, #F9998C -10.14%, #650C17 98.39%)',
+ raspberrybox:
+ "linear-gradient(166deg, #FFFDF9 -16.07%, #ECC7BB 81.36%)",
+ cosmo:
+ 'url("/src/assets/images/grain-bg.png"), linear-gradient(170deg, #F9A68B -10.14%, #C04343 98.39%)',
+ cosmobox: "linear-gradient(166deg, #FFFFFF -16.07%, #ECC8BB 81.36%)",
+ pina: 'url("/src/assets/images/grain-bg.png"), linear-gradient(170deg, #F9C08C -10.14%, #CB6100 98.39%)',
+ pinabox: "linear-gradient(166deg, #FFFDF9 -16.07%, #ECD3BB 81.36%)",
+ gin: 'url("/src/assets/images/grain-bg.png"), linear-gradient(170deg, #B2C196 -10.14%, #0D5649 98.39%)',
+ ginbox: "linear-gradient(166deg, #FFFFFF -16.07%, #C7DBB7 81.36%)",
+ lagoon:
+ 'url("/src/assets/images/grain-bg.png"), linear-gradient(170deg, #84C9EF -10.14%, #0D3C56 98.39%)',
+ lagoonbox: "linear-gradient(166deg, #FAFEFF -16.07%, #B1DCFC 81.36%)",
+ lalemon:
+ 'url("/src/assets/images/grain-bg.png"), linear-gradient(170deg, #D09DDE -10.14%, #30255A 98.39%)',
+ lalemonbox: "linear-gradient(166deg, #FBF6FE -16.07%, #E2C9E8 81.36%)",
+ },
+ colors: {
+ primary: "#864974",
+ base: "#E0E0E0",
+ mutedpurple: "#864974",
+ mutedbrown: "#6D5958",
+ salmon: "#EB7676",
+ peach: "#DE7671",
+ pineapple: "#E5986C",
+ leaf: "#547937",
+ tropical: "#3884EB",
+ lavender: "#8D61A7",
},
boxShadow: {
button: