Frontend Development

Linking patterns allows us to give our users a real feeling for how the website is going to work, on real devices, which things like InVision can never do. Here's some simple approaches.

When using the flex shorthand, you cannot use % for flex-basis if using calc.

A simple request: we need an 'Add to Calendar' widget to add our events to Google Calendar, iCal, and Outlook. Simple (once I had completed it!).

Not exhaustive, not fully-fleshed out, but here's a braindump on what I believe helps sustainable front-end development. Oh, and there's 12 tips, so you can ignore the two controversial ones if you want!

Sketch file complaining that it is missing fonts? Need to have Ionicons installed on your system so you can see what icons are being used in Sketch? Read on my friends...

I have a card component with a title, image, text, and link. How come all my card variants are inheriting all the values from the default one? Short answer, you don't. It's a feature, not a bug.

What would make for a first-class, enterprise-ready, front-end development team?

Yes, I know, there's more than one way to integrate PatternLab with Drupal. Here's how I create a card component and map it to Drupal.

To the future or to the past, to a time when thought is free, to the next time when I need to get the value of file field to use as a variable in Drupal 8 with Twig.

I'm sometimes asked for an overview of my general approach to PatternLab. Simple: put everything for each component in the same directory!