Beautiful UI components, crafted with Tailwind CSS. By the makers of Tailwind CSS.
Questions tagged [tailwind-ui]
249 questions
0
votes
1 answer
Tailwind dark mode not work whith "important" settings
In Docusaurus not working Tailwind 3 dark mode if i set in
tailwind.config.js
module.exports = {
important: "#tailwind",
content: ["./src/pages/**/*.{html,js}", "./src/components/**/*.{html,js}"],
darkMode: ["class",…
Arseniy
- 1
0
votes
0 answers
How to do min() in tailwind CSS
How to do I use the min() function like the following in tailwind
width: min(50vw, 200px);
I have tried min-w-[200px], but it does not work as intended. Is it possible in tailwind CSS?
Thanks
jeff
- 910
- 2
- 6
- 25
0
votes
0 answers
Tailwind UI components not rendering correctly?
So I'm new to React so I apologize in advance for the dumb question but I can't figure out why my Header component doesn't look like the example on tailwindUI.
It should looks like this : Example component
But it looks like this : My Example
I've…
1stup_
- 1
0
votes
1 answer
Tailwind css is not working in vercel after depoly
I have created a website that works well on local hosts but in vercel deployment output.css is empty.
here is code of package json
{
"devDependencies": {
"tailwindcss": "^3.1.8"
},
"scripts":{
"build":"npx tailwindcss -i ./src/input.css -o…
Abu
- 3
- 2
0
votes
3 answers
Usage of `block` and `hidden` in Tailwind UI code
Looking at the Tailwind UI example source code for the Navbar component at https://tailwindui.com/components/application-ui/navigation/navbars, I see there is this part:
![]()
Zizheng Tai
- 6,170
- 28
- 79
0
votes
0 answers
Display modal only once (do not reset state on page refresh/redirect)
I am trying to implement a simple age verification modal in a react app that I would like to launch only once; when a user first accesses my app. However, currently the modal pops up every time the page is refreshed or a redirect to a new page is…
Milo Welch
- 1
- 1
0
votes
2 answers
Is it possible to have flex-direction: row text wrap as if it were one sentence?
I have a component that has a label and a sub-label. We are using Tailwind-ui. Normally it displays like so:
Label
Sublabel
I am using flexbox to stack it as a column:
.label {
display: flex;
…
movac
- 1,576
- 3
- 21
- 45
0
votes
0 answers
React Headless UI Spin Transition Night Theme Toggle
I've been trying to make a spin animation for my night and sun icon when toggled but I just can't figure it out. I'm using Nextjs, Tailwind, and Headless UI for the animation library. I feel like I'm close any help would be very much appreciated.…
xilaluna
- 47
- 5
0
votes
0 answers
TailwindCSS Sign-in and Registration Form Formatting Issue
I am new to TailwindCSS. I have taken the form code from https://tailwindui.com/components/application-ui/forms/sign-in-forms and there is no error in the console. But my form is too large and there is a vertical scroll on the page. The width and…
Uzair
- 11
- 3
0
votes
1 answer
button_to in Ruby on Rails with custom html_options (here alpine.js x-show)
For some cases, Ruby on Rails needs a button_to to enable some actions like user logout (devise). My frontend uses Tailwind with alpine.js, latter one using inline attributes like x-show. Unfortunately, I cannot make button_to to output x-show. I'm…
Frowin
- 13
- 1
- 3
0
votes
2 answers
How to use FontAwesome icons as component within a const using Tailwind in Vue?
I've been using Heroicons but due to it's lack of icons, I decided to switch to FontAwesome. I set it up and am able to use it like so
Marry Jane
- 305
- 2
- 15
0
votes
0 answers
Rendering a linear gradient for an entire component in React?
I am trying to create a component in React in which the component fades from clear to blurry, and the remainder of the component is cut off / hidden without expanding the width of the actual page. I have tried stacking two div's on top of each other…
Tom
- 1
- 1
0
votes
0 answers
How to know if a project uses Tailwind CSS?
I have been using Clojure, ClojureScript, lein, shadow-cljs, Emacs, and CIDER to work on a Clojure/ClojureScript dynamic web app project.
The CSS part of the project needs serious refactoring and represents a big technical debt right now... There…
Pedro Delfino
- 2,421
- 1
- 15
- 30
0
votes
0 answers
Make DIV expand to the size of parent div with Flexbox in tailwind
This seems to be a simple problem, but for some reason, its not working and IDK why.
I am using TailwindCSS, most of the classes are in tailwind, the only classes that are not within tailwind and that are used here are full-image, and limit-lines…
Skrrubs
- 83
- 8
0
votes
1 answer