nth-child magic to generate infinite CSS layout 🎩
TLDR: Below is the final solution which is based on this A List Apart article and uses a combinations of the nth:child pseudo selectors to generate a repeating layout for any number of images. As we weren’t able to use CSS Grid due to having to still support IE.
The breakdown
A recent project that I worked on had a requirement for a gallery of images that users were able to upload. This meant the number of images where unknown. However, the layout needed to remain the same.
Previously I’d have used masonry libraries to dynamically generate a layout. However, they…
My goal is to create a solid, flexible, React typography system that scales.
Below is a collection of tools and conventions put together to form a design system which is easy to use and scalable.
This is a breakdown of the process, examples, and how to implement it.
The objective
I love design systems. It is probably the German side of me that gets a warm fuzzy feeling when working with a solid design system and things just work. Previously, solutions like Atomic Design Patterns and ITCSS worked well but relied on the cascading nature of global CSS. …
Detailed documentation scalable selenium boilerplate set up
tldr;
If you just want to get up and going you can follow the README on Github:
Selenium journey testing example, enjoy 🚀
Still here?… Great, below is more detailed documentation, background and conventions I used in this set up.
