Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Living Style Guides In Sass

Avatar for canarymason canarymason
October 16, 2012
Design
3
390

Living Style Guides In Sass

Presented at the NYC Sass Meetup (October 2012) at Pivotal Labs.

Avatar for canarymason

canarymason

October 16, 2012
Tweet

More Decks by canarymason

See All by canarymason
Mobile and Responsive Design with Sass
Avatar for canarymason canarymason
3
250
The Coding Designer's Survival Kit
Avatar for canarymason canarymason
8
490

Other Decks in Design

See All in Design
Social Anxiety
Avatar for Kayla Smith ksmith2024
0
230
An Early Spring | Storyboard | Scenes 1-18
Avatar for Gio Fortunato giofortuna_story
0
250
オリジナルのデザイン地図を作ってみた！〜OpenMapTilesとMaputnikを活用した地図スタイル〜
Avatar for Hajime Kato hjmkth
1
540
Kid Cowboy 103
Avatar for Marilu Molina marilutwin
0
240
札幌の雪を観光資源に変える：デザインプログラムSESSAの挑戦
Avatar for Ittyanm ittyann
0
240
富山デザイン勉強会_デザイントレンド2025.pdf
Avatar for keita keita_yoshikawa
0
300
Les petites aventures de CSS, saison 2025
Avatar for Raphael Goetter goetter
3
4k
線で考える画面構成
Avatar for natsuume natsuume
1
870
Haley's adventure chase
Avatar for Ivette Molina ivettetwin
0
210
freee + Product Design FY25Q4
Avatar for freee freee
4
14k
共通認識のためのユーザビリティテスト by AIエージェント - Accelerating Value Delivery
Avatar for Gaku Oyanagi gakuoya
1
660
なぜ今必要？Figma×SmartHR×DMM.com×一休 エンジニア視点で考えるデザインシステム
Avatar for Hiroki Tani hilokifigma
1
1.1k

Featured

See All Featured
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
54
13k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
30
990
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
524
40k
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
7
480
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
35
2.3k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
46
9.6k
BBQ
Avatar for Matthew Crist matthewcrist
89
9.7k
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
94
14k
KATA
Avatar for Megan Lloyd mclloyd
29
14k
The Art of Delivering Value - GDevCon NA Keynote
Avatar for David Neal reverentgeek
14
1.5k
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1031
460k

Transcript

  1. Living Style Guides & Sass Wednesday, October 17, 12

  2. Hi, I’m Mason @codingdesigner I design and make websites. I

    love CSS and Sass. Probably too much. Wednesday, October 17, 12

  3. I Make Sass Extensions github.com/canarymason Wednesday, October 17, 12

  4. Crazy things sassy mother effing text shadow sassymothereffingtextshadow.com Wednesday, October

    17, 12

  5. Modular Scale Calculate typographic scales github.com/scottkellum/modular-scale with @scottkellum Wednesday, October

    17, 12

  6. Breakpoint Really simple media queries in Sass breakpoint-sass.com with @snugug

    Wednesday, October 17, 12

  7. Survival Kit A Toolset for Designing Web Sites in the

    Browser thecodingdesigner.com/survivalkit Wednesday, October 17, 12

  8. Contact Me Zivtech zivtech.com Mason Wendell - Creative Director Twitter,

    Dribbble & Drupal: codingdesigner github: canarymason Wednesday, October 17, 12

  9. I Wednesday, October 17, 12

  10. Living Style Guides Wednesday, October 17, 12

  11. BBC GEL Wednesday, October 17, 12

  12. OLI.JP Wednesday, October 17, 12

  13. Zivtech.com Wednesday, October 17, 12

  14. What’s so great? Wednesday, October 17, 12

  15. Your style guide is a: Design Cop Wednesday, October 17,

    12

  16. Your style guide is a: Design Catalog Wednesday, October 17,

    12

  17. Your style guide is a: Design Sherpa Wednesday, October 17,

    12

  18. And Also: Code Teacher Responsive Ready Client Pleasing Institutional Memory

    Wednesday, October 17, 12

  19. II Wednesday, October 17, 12

  20. What’s Sass got to do with it? Wednesday, October 17,

    12

  21. Variables Define colors, dimensions, etc Wednesday, October 17, 12

  22. Mixins Abstract your design ideas into reusable formulas Wednesday, October

    17, 12

  23. Extend Put reused code into reusable silent selectors Wednesday, October

    17, 12

  24. Partials and Nesting Compartmentalize design modules Encourage more flexible and

    future-friendly styles Wednesday, October 17, 12

  25. Use Creativly Wednesday, October 17, 12

  26. Always be Refactoring Wednesday, October 17, 12

  27. What is a Sass, and How Will I Know if

    I’m Shaking it? Wednesday, October 17, 12

  28. Ship. Wednesday, October 17, 12

  29. Questions & Contact Zivtech zivtech.com Mason Wendell - Creative Director

    Twitter, Dribbble & Drupal: codingdesigner github: canarymason Wednesday, October 17, 12