CSS

Update: A chrome extension made using the same technique is available on Google web store now. Like a lot of people working in this industry, I prefer dark themes. If you were to ever look at my iTerm or Sublime Text windows, you would understand how pretty dark theme can be. My iTerm 2 Screenshot A few weeks ago, I came across an blog written by Heydon Pickering (https://inclusive-components.club/a-theme-switcher/), which describes a simple tweak to overwrite the current styles to get a dark theme and provides instructions for a React component to switch it on or off. The idea is neat and requires little time to implement and maintain. As a side note, I am also reading one of Heydon’s books entitled Inclusive Design Patterns, which is worthy of any front-end developer’s time. ...

Naming things and vertically centering things There are only two hard things in Computer Science: cache invalidation and naming things.> — Phil Karlton Without any doubt, the tasks of vertically aligning UI components and creating a good CSS naming scheme are a challenge. In front-end development, there are some unique restrictions which make things even more difficult. In order to develop more reusable and widely supported UI components, the Peapod team has had to devise their own development practices and naming strategies. In this article, I detail the various approaches to controlling vertical alignment and their respective advantages and disadvantages. I then briefly discuss the Peapod development group’s approach to naming elements. ...