PNW Drupal Summit: Breakpoints

October 17
blog author

Appno Blogger

Appnovation Coop

After a night of fun courtesy Appnovation, I woke up to a text from a co-worker; we had decided the night before to sync up and attend a few seminars at the PWN Drupal Summit together.

As I walked into the Summit to check-in, the nice check-in lady informed me that I'd already checked-in. I'm more confuzzled when she asks me of the possibility that I checked-in earlier. Trying to trace back my footsteps, I slowly remembered that after that night of "FUN" a couple of co-workers and I decided to check-in for the Summit at the office next door to ours. As I face palmed myself in embarrasment, the check-in lady smiled and handed me the schedule for the PNW Drupal Summit. I then immediately checked the schedule to figure out which sessions would help me out.

I decided to see a session about Sass-y Theming, which I believed would help me out greatly. After sitting through my dizzy spells and a few topics on Sass and Compass (thanks to the front end team for the mixins and extensive knowledge on this btw), they started to discuss a compass extension which caught my interest and I felt it would be beneficial to my current projects. The extension is called Breakpoint.

Breakpoint allows you to name your css media queries for responsive development. What a breakthrough, I thought, since one of the challenges of responsive development is deciphering what actions are happening on certain responsive breakpoints of a website. Normally it's easy to read these breakpoints, but as the site gets bigger and client requests become more specific on certain breakpoints, you start to realize that you've written a series of puzzle pieces which at times are a pain to decipher and understand.

Giving your media queries a meaningful name allows you to understand your stylesheets better without having to consult or resize your browser so often. It provides a clear picture of the site just by reading through your stylesheets. And since you are able to call your breakpoints and apply them as a variable, it opens a lot of doors for better management of media queries, which in turn increases productivity and decreases hair-pulling moments when dealing with responsive development.

I felt like I'd added yet another weapon to my arsenal for conquering Drupal theming after attending just one session. I only hoped I could've stayed more to check out the other useful Drupal sessions.

Thanks to the help of the front-end team, I've begun to love Sass and Compass. With the introduction of Breakpoints for me, I might not ever go back to writing CSS regularly anymore.

For more information on Breakpoints visit this site: http://breakpoint-sass.com.