So far I have pretty much only placed CSS styling classes in templates (.html files). This makes maintaining the styles somewhat manageable in that to apply sytles changes, one must check/update all the template files.
I currently use a slightly modified version of the github CSS framework (its like tailwind CSS).
There are a few exceptions where I need to dynamically add certain class names as required to objects, so there already is a little bit of CSS bleed into the python codebase.
I have been reading the docs and come across topics like styling-widget-instances and form media (ran out of links… docs /topics/forms/media/ )
To me this is like mixing the logic and view layer. It does sound appealing to pushing styling to a higher level, but it seems to me like the styling can quickly get fragmented all over the place.
Another thought I have is dropping SASS and using a python variant, since I find SASS very limiting. This would be like fully embracing CSS into the python code.
Have looked at Django pipeline and friends many times, and spent many nights drifting off to sleep how best to tie CSS into Django.
At the moment I have custom template tag, that during dev it links to uncompressed CSS/JS files, and during production it uses the minified CSS/JS files. As mentioned before almost all the CSS is in the templates, and I code form fields manually as I am very comfortable writing HTML manually.
What are your guys thoughts on the matter?
It’s not clear to me if you’re scattering CSS among the different files or if you’re talking about assigning CSS class names in different locations. I’m assuming you’re actually referring to the latter, in which case I think there may be different “mindsets” possible here.
We don’t think of class name attributes as being “styles”, but as an indication of which style to apply to an element. To that end, yes, we have attributes being set in multiple places. There are some that are applied directly on html elements in the templates, some that are set on widgets in forms, some set in Crispy forms, and some dynamically applied in JavaScript.
The CSS defining how those class names cause html elements to be styled resides strictly in our CSS files. There is no actual CSS anywhere else.
Thanks for the reply Ken. Yes you are correct, I was trying to refer to just the attaching of CSS class names (not defining, defining only should happen in CSS file). Does it not make it harder to keep track of the styles with them being applied “directly on html elements in the templates, some that are set on widgets in forms, some set in Crispy forms, and some dynamically applied in JavaScript”? Like makes it harder to implement stylesheet changes?
I can certainly see where it’s possible that such confusion can occur, or be created - but it hasn’t been an issue for us. (Pretty much everything we do is built on top of bootstrap, so what little CSS we actually create ourselves is generally targeted at a specific set of page elements on well-defined pages. I won’t deny that the granularity we use with classes mean that many elements have three or four classes assigned to them.)
I am not finding that I need to use CSS names outside of templates, or occasionally in settings.py – for defaults with particular modules. I think that, if I could not solve a styling problem on the template and it somehow needed to be tied closer to the code, then I’d probably call the data I needed from a settings file.
My usage may not be typical.