search

bexodim / ProgressArc

Circular progress bar using CoffeeScript, AngularJS and D3JS
0 stars 0 forks source link

style information such as fill, font-size, etc.. should be inside the css file #2

Open diwu1989 opened 10 years ago

diwu1989 commented 10 years ago

The directive right now has hardcoded styles for color, text size, etc...

For better separation of concern and ease of use by designers, it's better to name elements with different css classes and then define the style for those classes in the css file.

It also makes it easier for people to re-use the directive in different places and re-skin it via CSS, vs being tied to one color scheme.

diwu1989 commented 10 years ago

The getColor function still returns hex values for the color. If you instead returned css class names like progress-yellow, progress-green, progress-red, you can keep the hex in the CSS.

bexodim commented 10 years ago

Hi Di, I actually had it using classes before, but I wanted to be able to tween the colors. I couldn't see a way to tween the two classes.

diwu1989 commented 10 years ago

In the old days of ghetto CSS, you wouldn't be able to transition the color, but with CSS3 being supported in all modern browsers nowadays, you can push that tweening over to the CSS engine.

http://everhooddesign.com/node/39