Does Tailwindcss @v4 still support this?

[aziz-codes]

I have this code in my global.css with next js 14, now i have upgraded to latest version of tailwindcss and next js. so does this code still works?

@layer base {
  * {
    @apply border-border;
  }
  body {
    @apply bg-background text-foreground;
  }
}
@layer components {
  .navLink {
    @apply md:!justify-start space-x-2 md:!my-1.5 !px-3 w-full;
  }
  .menuItem {
    @apply !cursor-pointer flex items-center gap-x-2 !px-4 !py-3.5 !m-1.5 rounded-lg font-medium;
  }
}

cz I am getting warnings

Thanks for your help

[wongjn]

Those are warnings from VSCode since it does not know Tailwind CSS specific syntax. You can ignore them or you could look at installing the Tailwind CSS IntelliSense VSCode plugin and then:

files.associations

Use the files.associations setting to tell VS Code to always open .css files in Tailwind CSS mode:

"files.associations": {
  "*.css": "tailwindcss"
}

Otherwise, you could set css.lint.unknownAtRules VSCode setting to ignore.