Support styling checkbox/radiobutton label based on state

[GregKass]

There is no guarantee in receiving a response in GitHub Issue Tracker, If you'd like to secure our response, you may consider PrimeNG PRO Support where support is provided within 4 business hours

I'm submitting a ... (check one with "x")

[x] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Plunkr Case (Bug Reports)
Please fork the plunkr below and create a case demonstrating your bug report. Issues without a plunkr have much less possibility to be reviewed.

http://plnkr.co/edit/Qi2Nw2imLpDUF8NJinYw?p=preview
Behavior can be observed on the primefaces page.

Current behavior

Cannot assign CSS to <label> such that the label is styled based on the state of the checkbox being checked. I'm calling this a bug because labels should be stylable to their corresponding input.

Expected behavior

Should be able to change color, font, etc on the label when checking checkbox with appropriate CSS styles

Minimal reproduction of the problem with instructions

Look at dev tools on primeng#checkbox On checking the checkbox the styles of the children of the previous sibling <div> of the label update, but nothing else. Either the <label> tag should be located adjacent to these children, or a check state class should be added to their parent so that the <label> styling can access this state change. Other labelled inputs should also be examined for this behavior.

What is the motivation / use case for changing the behavior?

We want to change the text color of the label to the background color of the checkbox when the checkbox is checked.

Please tell us about your environment:

• Angular version: 2.0.X

• PrimeNG version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =