Baby Kick Counter

This weekend I made a Baby Kick Counter for Dav. After watching her struggle with a combination of Notes and the stop watch on her phone, I cracked out the HTML, JavaScript and CSS to whip up a basic kick counter. I really should have made this little app a long time ago (Beanie is due […]

Dealing with a meetup organisers worst nightmare

On Thursday 4th February we held our 17th SydCSS. It was going to be an easy event for us. Speakers were lined up, the venue was booked, we had people at the venue prepped ready to set up the space as we needed it. We even had a little extra sparkle lined up in the […]

Make your own progressively enhanced share buttons

Ah, social buttons… they’re just like modern day hit counters… At their worst they slow your site down and show how little your pages are shared on social media, at their best they make it easier for people to promote your pages to their friends and followers. When faced with the task of implementing share buttons […]

Confidently removing CSS selectors with Google Analytics

As time goes by CSS builds up as we add features, but more often than not we don’t remove the CSS that’s no longer needed. The reason we leave things lying around could be: Cleaning up old CSS is not seen as important as adding new features. We are never 100% confident that the CSS […]

16 rules to help your meetup run more smoothly

When you go to a meet up you probably think that the organisers book a room, ask a few people to come and off you go, super easy. Well it’s not, and I’m glad it isn’t because I take great joy in the logistics of running a meetup. With SydCSS people sometimes hear me say […]

Game built with CSS and no JavaScript

Based on the previous carousel code I wrote, I had an idea on how a form could be used to drive the classic game of “Pick up Sticks”, so I spent a few hours seeing if it could be done:

Animating a SVG image for the first time

Last week I made the smallest website I’ve ever developed. Draw Inspiration is a single page website that allows users to print a random phrase for them draw. Phrases such as “icy pear”, “jealous butter” and “creepy popcorn”. In making this website, part of the challenge was to keep it free of JavaScript but still […]

CSS Keyframe animation example

An experiment using CSS keyframes, -webkit-mask and a little bit of easing on the keyframes. The browser you’re using may affect what you see. For example, Firefox doesn’t support the masking effect that’s used. Take a look at how it’s built for your self.