data-cards are a way of previewing and adding metadata to table columns, in a browser friendly way. This repository contains a basic example of this design pattern,
Demo here.
In use
This demo is built with Lektor.
It has a few dependencies, so do npm install.
grunt will watch for changes to your SCSS files, and also icons (see svgstore).
lektor deploy will deploy to the gh-pages branch, putting changes live (if you have deploy permissions).