search

petalframework / petal_components

Phoenix + Live View HEEX Components
https://petal.build/components
MIT License
768 stars 84 forks source link

The `group-hover/pc-icon-button:flex` class does not exist. #245

Closed greenleprechaun21 closed 10 months ago

greenleprechaun21 commented 11 months ago

CssSyntaxError: tailwindcss: ..../app/deps/petal_components/assets/default.css:202:3: The group-hover/pc-icon-button:flex class does not exist. If group-hover/pc-icon-button:flex is a custom class, make sure it is defined within a @layer directive.

  200 | 
  201 | .pc-icon-button__tooltip {
> 202 |   @apply absolute flex-col items-center invisible mb-6 transition-opacity duration-300 -translate-y-full opacity-0 -top-1 group-hover/pc-icon-button:flex group-hover/pc-icon-button:visible group-hover/pc-icon-button:opacity-100;
      |   ^
  203 | }
  204 |

Dependencies:

  defp deps do
    [
    ...
      {:tailwind, "~> 0.1", runtime: Mix.env() == :dev},
      {:petal_components, "~> 1.0"},
    ...
    ]
  end

Tailwind config:

module.exports = {
  content: [
    ...
    "../deps/petal_components/**/*.*ex",
  ],
nhobes commented 11 months ago

@greenleprechaun21 I've experienced this issue before and I believe it's due to an outdated version of tailwind. Run mix tailwind.install and then try again. Also, make sure Petal Components is on the latest version.

nhobes commented 10 months ago

@greenleprechaun21 closing for now, but lmk if you're still experiencing issues and can reopen if need be.