From 589f22cd14e8fc5696236d4d2f7ce7a9731f91ef Mon Sep 17 00:00:00 2001 From: mildrrnt Date: Fri, 19 Jan 2024 21:07:33 +0700 Subject: [PATCH] fix: background using twMerge --- src/layouts/CocktailCard.astro | 16 +++++++++++----- 1 file changed, 11 insertions(+), 5 deletions(-) diff --git a/src/layouts/CocktailCard.astro b/src/layouts/CocktailCard.astro index 81f2d5b..97f1581 100644 --- a/src/layouts/CocktailCard.astro +++ b/src/layouts/CocktailCard.astro @@ -1,5 +1,5 @@ --- -import { twMerge } from "tailwind-merge"; +import {twMerge} from "tailwind-merge" import BaseLayout from "@/layouts/BaseLayout.astro"; import Card from "@/components/story/Card.tsx"; import ButtonSet from "@/components/story/ButtonSet.tsx"; @@ -7,10 +7,16 @@ import FooterDecorator from "@/components/story/FooterDecorator.tsx"; import Logo from "@/assets/elements/logo.png"; const { id, name, img, bgbox, bg, accent, download } = Astro.props; -const classname = twMerge( - `relative flex w-full flex-col items-center justify-center gap-4 overflow-hidden bg-cover bg-repeat pb-8`, - `bg-${bg}` -); + +const background = { + raspberry: "bg-raspberry", + cosmo: "bg-cosmo", + pina: "bg-pina", + gin: "bg-gin", + lagoon: "bg-lagoon", + lalemon: "bg-lalemon", +}; +const classname = twMerge(`relative flex w-full flex-col items-center justify-center gap-4 overflow-hidden bg-cover bg-repeat pb-8`,background[bg]); ---