search

tailwindlabs / tailwindcss-custom-forms

A better base for styling form elements with Tailwind CSS.
https://tailwindcss-custom-forms.netlify.app/
MIT License
1.55k stars 72 forks source link

Custom Forms not recompiling when making changes in tailwind config #82

Closed tomerds closed 4 years ago

tomerds commented 4 years ago

I cant figure out why but changing customForms (or anything in the tailwind config file for that matter) will result in a recompile but no actual changes being seen on the tailwind-custom-form components. They do however get picked up by other components using the updated config themes.

I am using next and removing the .next folder which has the build in it and running again will result in the changes being picked up.

Why are the changes reflected in everything other than the custom-forms and how do I make customForms update without having to delete the build folder every time I make a change?

tomerds commented 4 years ago

Found out "twin.macro": "^1.7.0", was the problem

Needed to use like this 

export const TextInput = styled.input.attrs({
  className: 'form-input w-full',
})`
  ${(props) => props.pad && tw`pt-5`};
  ${(props) => props.error && tw`border-error border-0 border-b`};
`

rather than like this 

export const TextInput = styled.input`
  ${tw`form-input w-full`}
  ${(props) => props.pad && tw`pt-5`};
  ${(props) => props.error && tw`border-error border-0 border-b`};
`