workaround for angular 1.x component styling

Task.js

// Angular 1.x components don't let you do a "replace:true", so they're always nested in another HTML tag.
// This nesting makes it so you can't use some really useful css pseudo-classes like ":last-of-type". 
// This workaround puts a CSS class on the actual root, so you can take adavantage of these CSS goodies.

export default class Task { 
  constructor($element){
    // add class to component root element for easier css styling 
    
    // using aphrodite
    $element.addClass(css(styles.container))
    
    // using plain CSS
    $element.addClass('task')
  }
}