I saw WOW.js on Product Hunt today and thought, "neat, that looks like fun." I'd also had the thought to play around with the Hacker News FireBase API so why not merge the two?

It's quite easy to change the way a Bootstrap modal appears. The basic premise is to replace the .modal.fade and .modal.fade.in classes. You can use any number of transformations and transitions. For this example I'm growing and fading the modal in from below. This is all the CSS you need to modify your vanilla Bootstrap modals.

In my attempt to mimic Google's Material Design circular button I ran into some hardships dealing with cross browser compatibility. Centering a plain text "+" sign within a circle is much more difficult that it seems. Not because the CSS is complicated, but because each browser interprets the CSS differently. There is a particular discrepancy between Mozilla and Webkit. My first attempt used line-height..

This will allow you to style the Uploadify upload button. Normally this button is generated through the flash object, so it's a bit tricky replacing it with a CSS button. You have to use the proper parameters to make the flash object transparent and position a CSS button over your text while positioning the flash object over the CSS button. Here is the HTML:

I always need these for my CSS development. They're great for making your CSS more visible for debugging. You can include one or all in your main stylesheet and just apply the style to any div you're working on:

This can be used in conjunction with my Tagcloud Font Distributor snippet. The colors are what we use here at Hawkee, so please feel free to change them. If you find a scheme that works well post it as a snippet.