I am not a designer. Though the design of this site is built largely from scratch, I’ve done my best to acknowledge others whose work has greatly influenced this site and from whom I’ve borrowed heavily.
Link to headingLayout
The design leans heavily into CSS grid I’m a relatively new student of CSS grid so I’m sure the approach could be improved. I built a 12 column layout from using https://utopia.fyi to generate based grid, layout, and type settings as CSS variables. Utopia allows designers and developers to generate a mathematically consistent
Link to headingColors
Speaking of, the color theme of the site is also driven by CSS variables. I liked the idea of building the color theme off a monochromatic scale similar to Tailwind’s color palettes. This led me to uicolors.app, a Tailwind color generator. I had so much fun playing with different colors for the site, I decided to recreate that experience for you the reader. You can now visit the color scheme settings to swap out the color theme of the site. It’s currently hard-coded but a future release will allow readers to swap out the color themselves.
Link to headingUI Frameworks?
Joy of Rails does not currently use a UI framework, like Material or Bootstrap. The first iteration of this site’s design was built with Tailwind which I have removed. I have copied over a number of Tailwind utility classes I used in that first iteration as well as the generated Utopia CSS variables for layout, spacing, and typography. I want to Joy of Rails to "own more" of its dependencies—part of why I implemented Authentication from Scratch. I love Tailwind, it was empowering to embrace the idea that I don’t need a UI framework. . This does mean a more work is required in HTML and CSS to make styles and accessibility work better for readers.