My divs are white ?

Answered

Barbary Lion posted this in #help-forum

Barbary LionOP

2023-12-03T16:21:46.000Z

I'm currenty working on a personal project.

In localhost everything's fine but with vercel, my div are white...?

How can i fix this ?

Repo : https://github.com/bastianfbr/next-quiz
Site : https://nquiz.vercel.app/

Answered by Ray

const colorMap = {
  "red": "bg-red-500"
  "orange": "bg-orange-500"
}

<div className={`flex flex-col items-center justify-center rounded-md p-8 mb-2 w-2/4 sm:w-80 mx-auto ${colorMap[color]}`}>

something like this

View full answer

9 Replies

Ray

2023-12-03T16:33:12.000Z

<div className={`flex flex-col items-center justify-center rounded-md p-8 mb-2 w-2/4 sm:w-80 mx-auto bg-${color}-500`}>

the color class cannot be dynamic

@Ray the color class cannot be dynamic

Barbary LionOP

2023-12-03T16:33:53.000Z

but it works in localhost...

Ray

2023-12-03T16:34:07.000Z

try npm run build and npm run start

it won't work

tailwind doc has mention it

Barbary LionOP

2023-12-03T16:34:56.000Z

ah...

so what can i do ?

Ray

2023-12-03T16:36:08.000Z

const colorMap = {
  "red": "bg-red-500"
  "orange": "bg-orange-500"
}

<div className={`flex flex-col items-center justify-center rounded-md p-8 mb-2 w-2/4 sm:w-80 mx-auto ${colorMap[color]}`}>

something like this

Answer