Having a good hero section is important for any site. Here is an example of a responsive hero section with a toolbar that also includes a gradient background.
The box-shadow property is complex and can be a little intimidating. Here I try to make it easier to understand with a brief explanation and a visual example that you can play with.
An attempt to explain what mobile first design is and how it relates to media queries in your css.
Getting spacing right is hard. Here is an example of how you can get consitent spacing in your top nav using Flexbox.
A tutorial on creating a stacked card from two divs.
An example of how to build a nice looking sidenav using flexbox.
An example of a produce price panel using just plain css and html.
An example of an easy to make toggle button using plain css, inspired by a TailwindUI toggle button.
A example of building a simple card without a library, just CSS and HTML.
Designing and visualizing layouts in CSS is hard. Here I'll discuss a trick I recently discovered for making things a little easier.
An example of TailwindUI's Simple justified CTA component written in plain old CSS.
An example of a Flex layout sidebar page using Tailwind CSS
After using Tailwind for a bit I have some thoughts...
Some thoughts and instructions on adding Tailwindcss to a Django project.
In the second part of the Django Small Project series I'll be working on some of the core features of the Workout Tracker application.
The first part in a series of posts on how I start and work on projects an hour at a time.
A bit of advice on how to manage urls in Django, especially as your project grows.