Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Living Style Guides In Sass

Avatar for canarymason canarymason
October 16, 2012
Design
430
3

Living Style Guides In Sass

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

Avatar for canarymason

canarymason

October 16, 2012

More Decks by canarymason

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

Other Decks in Design

See All in Design
Webブラウザで動く
VJツールをつくる
Avatar for akirafukuoka akirafukuoka
0
120
2026/6/26 第6回韓日リビングラボネットワークフォーラムin世宗　ー未来を作るリビングラボー アジアの社会システム転換に向けたリビングラボの可能性
Avatar for Kimura Atsunobu a2k
2
120
RawrXD: The Sword
Avatar for Sean Natarajan seanvraj_arts
0
170
The ISO 25964 standard on Information and documentation — Thesauri and interoperability with other vocabularies
Avatar for AccessInnovations accessinnovations
0
250
インターンから2年 新卒フロントエンドエンジニアから見た サイボウズのアクセシビリティ
Avatar for tak taku10101
0
180
泥臭く語るUIデザイン会｜ホワイトボードチャレンジ【RAMEN TECH 2026】
Avatar for @Garyuten garyuten
1
150
20260802東京都市大学オープンキャンパス授業
Avatar for Kimura Atsunobu a2k
0
110
noteらしさを織り込むハーネスエンジニアリング
Avatar for uto usui uto
0
2.2k
SERVICE PAMPHLET
Avatar for M-HAND,Inc. mhand01
0
5k
トランジションの冒険 自分と世界を変える冒険の書 / Transition Adventure
Avatar for 松村 大貴｜Butterfly Lab株式会社 dmattsun
2
750
個人理念（自分の言葉）の言語化ワークショップ
Avatar for 加来幸樹 SIGNCOSIGN kakukoki
1
400
デザインツールを開く前に その画面は誰に何と言わせたい？受託UIデザイナーが顧客解像度を高める 「打ち合わせの場での確かめ方」
Avatar for @Garyuten garyuten
1
270

Featured

See All Featured
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
Avatar for David Neal reverentgeek
1
630
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
Avatar for Ines Montani inesmontani
PRO
0
740
It's Worth the Effort
Avatar for 3n 3n
188
29k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
239
140k
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
378
71k
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
6.3k
Applied NLP in the Age of Generative AI
Avatar for Ines Montani inesmontani
PRO
4
2.5k
Odyssey Design
Avatar for Ryan Kendrick rkendrick25
PRO
2
870
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
232
55k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
6
1.3k
New Earth Scene 8
Avatar for Sydney Stone popppiees
4
2.7k
The Impact of AI in SEO - AI Overviews June 2024 Edition
Avatar for Aleyda Solis aleyda
6
1.2k

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