'Why do some colors in tailwindcss not work with conditional classes in Next.js?

When I run this code it works fine.

    return (
    <Link href={path}>
        <h2
            className={`text-xs w-20 sm:text-sm sm:w-24 md:text-lg md:w-28 lg:text-xl lg:w-36 font-semibold text-sky-500 py-1 text-center cursor-pointer capitalize bg-white rounded-lg hover:underline ${
                active && "text-amber-400 underline"
            }`}>
            {name}
        </h2>
    </Link>
);

When I change the 500 to a 400 it doesn't work. I have seen this happen with several color combinations. Also, early today it was working with 400. I came back several hours later with no code changed and it suddenly wasn't working. Has anyone dealt with something like this before? I have searched the web and have found nothing regarding this issue. Thanks.

cssnext.jstailwind-css


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions