Currently, I am attempting to implement daisyUI styling in my django web application project, however, I am facing some confusion regarding the styling. The specific issue arises when I try to apply daisyUI styling to a dynamically generated input text field through a django form:
#forms.py
class ProductForm(forms.ModelForm):
class Meta:
model = Product
fields = '__all__'
widgets = {
'title': forms.TextInput(attrs={'class': 'form-control input input-primary w-full max-w-xs', 'placeholder':'Title'}),
'description': forms.Textarea(attrs={'class': 'textarea textarea-primary w-full'})
}
...
According to this daisyUI documentation page, I should have a rounded bordered input field (similar concept with the textarea).
After inserting {{form.title}} within a form tag in my template, This is the discrepancy between
what I currently have and the desired result.
The styling appears to be overridden from somewhere but pinpointing the source has been challenging...
I managed to replicate the "desired result" image by utilizing my code with this tailwind-play tool
Here are additional details that might be helpful:
- I have locally installed django-browser-reload on my machine.
- My tailwind.config.js file has the following structure :
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["../**/templates/**/*.html"],
theme: {
extend: {},
},
daisyui: {
themes: ['light', 'dark'],
},
plugins: [require("@tailwindcss/typography"), require("daisyui")],
}
I attempted to rerun
npm run tailwind-watch, refresh the webpage usingcmd+shift+R, and restart 'python manage.py runserver` each time I made modifications to verify if the styling would be correctly appliedI also experimented by incorporating this pre-made django project (which is a commendable effort!) and experiencing the same styling problem after adding a form to edit the template.
While researching similar issues (such as this one), it seems like their styling issues stem from the usage of tailwind form plugin. However, in my case, I am not using it..!
Any insights on where this issue may originate from?
(I hope my explanations were sufficiently clear, considering my non-developer background and limited experience beyond Python programming language)
Thank you in advance for any guidance and assistance provided 🙏