Questions tagged [tailwind-in-js]

120 questions
15
votes
2 answers

Fade/transition tailwind class to something else over certain amount of time?

Is there a way to set bg-red-300 and fade/transition it to bg-transparent or different bg class over 2 seconds or do I need javascript for this? I want an element to highlight and then return to normal after 2 secs. Thank you!
SeaBass
  • 1,584
  • 4
  • 20
  • 46
15
votes
4 answers

TailwindCSS Missing Colors in Production vs Development - Laravel Jetstream

I am using Laravel Jetstream with TailwindCSS. I have modified some of the config.js files (webpack, tailwind, etc.) with some of my requirements for the project. For some reason, when I compile running npm run dev, it will have all the colors…
Brian Logan
  • 812
  • 2
  • 6
  • 20
11
votes
3 answers

How to apply background image with linear gradient in Tailwind CSS?

I want to apply a linear gradient to my background image. on tailwind config file I wrote a custom rule like this: theme: { extend: { backgroundImage: (theme) => ({ 'hero-pattern': "url('../src/images/icon-bg.jpg')", }), …
Ashik
  • 2,888
  • 8
  • 28
  • 53
8
votes
3 answers

Could not find a declaration file for module 'flowbite/plugin'

So I am using flowbite and tailwind css for developing my react app. I followed all standard installation procedures as mentioned in their website for setting up flowbite with react, please ref docs here:…
7
votes
1 answer

What does it mean by 'Requires js' when using TailwindCSS?

I am completely new to Vue and Tailwind. I was just looking at https://tailwindui.com/components/marketing/elements/headers and saw the Requires JS tag. When I copy-paste the code to my project, it gives a blank page. Where do I configure this part…
Rooney Mara
  • 145
  • 1
  • 7
7
votes
3 answers

TailwindCSS bg-opacity not working in React

I am trying to set my Login section's background opacity using bg-opacity-75, but when I add that to my className, background color will just disappear. And if I use opacity-75, all child-div will be transparent as it should, if I use opacity-100,…
Elshir Stan
  • 71
  • 1
  • 4
6
votes
3 answers

how to integrate tailwindui JS in rails app

i'm on rails 7 with esbuild. I'm using tailwindUI. It works properly when using only css components. When a component uses JS it does not work anymore. For example the dropdown menu is open by default and i can't close it. I added…
6
votes
1 answer

How to split tailwind css generated code into different directories?

im new to tailwind-css and what i want to achieve is that lets say im using few classes of tailwindcss in component/index.js and i want to generate index.css file of tailwindcss in component directory for eg: component/index.css. so like that i'll…
5
votes
3 answers

Color classes of Tailwind CSS not working when appended

There is a login page that is built with Tailwind CSS v3, all the styles for nice and fine. But on the login page, I want to have timer alerts that will display if any error occurs like invalid email, email already in use like that way. What is…
Sohel Shekh
  • 241
  • 3
  • 9
5
votes
4 answers

Tailswind css - "list-disc" is not styling
  • bullets correctly (double bullet symbols)
  • How does one use the list-disc class to style bullets, using Tailwindscss? My package.json includes: "@tailwindcss/aspect-ratio": "^0.2.0", "@tailwindcss/forms": "^0.3.2", "@tailwindcss/line-clamp": "^0.2.0", …
    jpw
    • 18,697
    • 25
    • 111
    • 187
    3
    votes
    0 answers

    Dynamic Tailwind Elements datepicker component not working in React

    I am trying to get the Datepicker tailwind elements component to work in React, but for some reason it is not triggering: https://tailwind-elements.com/docs/standard/forms/datepicker/ I have followed the steps in the tailwind elements quick start…
    buckeyeguyy
    • 121
    • 8
    3
    votes
    0 answers

    using jQuery with Tailwindcss?

    I started using Tailwind recently and I ran into a problem that I had to write jquery code to show the elements for example or make some effects, etc... So I wonder if there is, for example, a library or a specific add-on or anything that can save…
    khaled amoudi
    • 53
    • 1
    • 6
    3
    votes
    2 answers

    Adding a class (related to tailwind) using javascript doens't work

    I have a button with a PLUS svg image in it. On click, I what that Plus svg to disappear. I checked in console and the function works fine, the class "visible" is removed and the class "invisible" is added. But in the UI the Plus svg doesn't…
    Yamyyuky
    • 31
    • 1
    • 3
    3
    votes
    3 answers

    Setting custom dark mode theme in Tailwind CSS config?

    I'd like to use custom themes in Tailwind config to set primary/secondary colors for light and dark mode. The Tailwind docs only go over using classes in an html/jsx element like so:
    user12457151
    • 853
    • 2
    • 12
    • 25
    3
    votes
    3 answers

    tailwind css showing warnings about generated css file missing styles

    This is my first time installing and running tailwind CSS. I follow the instructions and did everything accordingly but then it started showing some warnings like below Can you tell me why I am getting these warnings and anyway for me to fix them?…
    1
    2 3 4 5 6 7 8