SVG & CSS Grayscale Filter: Retina Bug

Way back in the time machine of dreams I was reworking my blog in CodePen, until I ported my work to a local machine. During that time on CodePen I was playing with CSS Filters as I was writing about them for the CSS-Tricks Almanac. Of course like the good little developer I am I decided to try a grayscale filter on my SVG logo and the following are the results as I began my cross-device testing. Read More →

WordPress Plugin Directory Tips

I wrote a WordPress plugin recently called Admin Stylur and I thought this would be a good time as any to explain the process a bit and share some inside knowledge I gained while submitting to the WordPress plugin directory. This won’t be one of those posts where I tell you each facet about making a plugin or how to generate that awesome plugin idea. I’m simply saying “here are a few things I caught along the way and here is a post about said things.” Hopefully all that will help to make the process more simplistic, and less stressful as you begin. Read More →

Deploying a Jekyll site with a Rakefile

So, you have an awesome website built with Jekyll, but you need an easy way to publish it. For those unaware, Jekyll is a static site generator written in Ruby. With that in mind let’s talk about a little utility called Rake. It’s a Make-like program implemented in Ruby. This means you can create a Rakefile that contains a set of build rules. Simply put, it’s a file that you write some tasks in. The main task we want to achieve is publishing our site from a local machine to a server. Read More →

Orbit Button Glow

Maybe you’ve seen this type of interaction already if you’ve taken a glance at Polymer’s paper components. The idea is that when a click event is triggered an orb like glow appears and then vanishes at the end of the event. It’s a nice and subtle way to provide user feedback when they interact with an element on your page, but also doesn’t break layout if it sits next to other items. We achieve the effect through the use of keyframe animations, class toggling with JavaScript and using the animationend listener made available via JavaScript. Read More →

Emmet Hot Key: Open & Closing Tag

Quick keys are the best thing since sliced bread when you have a firm grasp of them and use the ones you care about the most. I’ve been doing some research to discover a few favorite quick keys with my editor of choice and wanted to share one that I think is pretty hawt! Read More →