How to integrate custom statuses in a workflow style custom element type? I made a lot of progress on my custom element type from this post and with the help of @selvinortiz:

Best way to implement my own statuses on my custom element type?

I know have custom statuses that look like this:



However, there are a few things I'm stuck on:


How do you assign colors to the statuses? I could target them with CSS but I feel there may be a way with Craft itself.
When listing entries in my templates, the default status is "green" for enabled. So how do I correlate my custom statuses with the enabled/disabled featured thats all ready in place?




I feel like Craft is the perfect tool for developing a workflow style plugin but I am having a few issues with statuses specifically. Does anyone have personal experience with creating a workflow, using native functionality, with Craft?
I looked into this a little bit... It looks like the color of the circles is dependent on one of these CSS classes by default:


.status.live - Green
.status.pending - Orange
.status.expired - Red
.status.disabled - White


I'm assuming (haven't checked this) that the status gets applied to the color dot as a lowercased version of the name. So for example, if you have a status called "Awesome", you would end up with a dot with the class .status.awesome.*

* If I'm mistaken about how this works, anyone is welcome to correct me.

Now that you've got your .status.awesome classes applied to the &lt;span&gt; which produces the color dots, you get to make your own dot! The default versions are pulling from two sprite files... You'll be served up the version which best matches your display:

/app/resources/images/status.png
/app/resources/images/status_2x.png


Since you're not going to be changing anything in the app folder, you'll need to make your own image to represent your dot. One great bonus of this: Your dot doesn't have to be dot shaped! You could just as easily make a star, question mark icon, etc. I'd suggest making both a "regular" and "2x" versions, to stay compliant with the native Craft handling.

Put your new image files into your plugin's resources folder:

/myplugin/resources/images/customstatus.png
/myplugin/resources/images/customstatus_2x.png


Then, you'd reference those in your plugin's CSS:

.status.awesome {
    background: url(/myplugin/resources/images/customstatus.png);
}


The default .status class handles a lot of the generic positioning, so you shouldn't have to override much.

Anyway, most of this is speculative and untested... But let us know if it works out for you!