Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now
Light
Dark
System
Ask  Question

Missing classes on Tailwind latest version


I believe the following classes are missing on the metronic 9 themes

-animate-pulse
-bg-gray-200
-bg-gray-700

also it seems that I try to do the following "bg-gray-100 dark:bg-gray-600" it does not work, since bg-gray-600


G
Guest 1 year ago
Metronic Tailwind 4
3 Answers
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)

G
Guest 1 year ago

Thanks for your response
understood on the gray

but on the animate-pulse I do believe it is missing on latest version I have 9.0.4 and in "/dist/assets/css/styles.css" It does not seem to include "animate-pulse" is it included in another file?


user
Sean Author 1 year ago

Hi,

Please note that Tailwind CSS is dynamically generated based on the classes you use in your HTML. Please refer to Quick Setup guide to compile your CSS whenever you add a new class.

Regards.


user
Sean Author 1 year ago

Hi,

Metronic fully overrides default gray colors and uses custom gray colors.

Also, Metronic uses the CSS variables to map gray colors for light and dark modes swap automatically as you can check here: site-generator/themes/metronic-tailwind-html/tailwind.config.js

By right, bg-gray-200 class should look pretty well in the dark mode. For Metronic Tailwind you don't have to set dark mode colors since our custom gray color set works pretty well for both light and dark modes.

All animation classes should work as shown in the official Tailwind Docs. Metronic does not customize or override any animation classes.

If you need any further clarifications please do let us know.

Regards,
Sean


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(