With more action buttons being needed in the table, it starts cluttering the table, so I've created a more elegant solution.
Things to keep in mind
- Some tables will and some won't need the overflow "more" button and dropdown
- Pull SVGs from https://material.io/icons/ and keep bounding box !important
- Icons ares 24px x 24px
- Use padding on <a>'s so entire height and width is clickable
- I used a :before pseudo-element to the right of the action buttons to fade out background. Theres probably a better way of doing this.
- Ignore new weather icons for the moment
- Add titles to anchors for accessibility
Don't look too closely at the code , more so the spacing, interactions, timing, full height target area, etc.
Codepen – https://codepen.io/brody/pen/rwEVKZ