First Pass at Styling

I added some CSS to my new Django site.

I made my first pass at styling the new website. I mostly focused on the basic styling for mobile and older browsers, so no new fun stuff like flexbox, grid, etc. I'm certainly still tweaking it and will try to enhance as I go, but it doesn't look as raw as it did with just plain browser styling.

From a design perspective, I had a hard time picking some fonts. It's been a long time since I've built something and been able to make all the design decisions from scratch. I thought I'd go in the direction of more modern and geometric, but I didn't like how bland it looked, so I tried out Libre Baskerville, which I really like, but wanted to have the option for a bold italic. I settled on EB Garamond and really like the print-inspired humanism of it. Pairing it with another font proved to be difficult, but I'm trying out Open Sans and, so far, don't feel like it's fighting with the Garamond, but swap for something different later.

I wanted to keep the orange color I had used in my previous Orange Gnome site, but it didn't pass accessibility muster without a dark background, and I wanted to keep the default color scheme light. So I ended up darkening it a bit to get it to WCAG AA for normal text. I hope to implement “dark mode” styles at some point and will revive the original orange for that.

I also always liked the gnome head I created for my original site, so put that in the footer as a fun element.

From a technical perspective, I did a bit of hem and hawing on how best to implement styles for a Django site. At first I thought maybe each App would have its own styles, but I didn't want to have so many stylesheets on the same page, nor did I want to have a build dependency to concatenate them into a single file. And even then, where should that file go?

I ended up adding another App, Base, to the Project and refactored the base templates there. Then housed all the styles there too. This made sense to me: Base has a dependency on the other Apps as a kind of “presentation App”, but the other Apps don't care about Base

I added the django-sass project to handle SASS compilation and after that things were pretty smooth sailing. I was unsure how deployment would work with the new static files, but everything worked fine.