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
400

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
500

Other Decks in Design

See All in Design
root COMPANY DECK / We are hiring！
Avatar for 株式会社ルート root_recruit
PRO
1
24k
Marpで推しCSSスライドを作ろう！ / marp-with-favorite-css
Avatar for ふじえもん fujiemon
0
700
「自分の仕事はどこまで？」と問い続けたら。デザイナーの「視座」を考える
Avatar for Takeru Mukai mukai_takeru
0
210
不確実性の時代にみんなで試したFigma × MCP × Cursor ハンズオン
Avatar for PERSOL CAREER Dev | techtekt techtekt
PRO
7
1.1k
見過ごさない誠実さ_アクティブバイスタンダーとIntegrityが支えるアジャイル文化 / integrity-and-active-bystander
Avatar for Aki spring_aki
1
150
デザイナーがはばたく未来の入り口『hatch』が描く、新しいデザイナー育成のカタチ
Avatar for Goodpatch Inc. goodpatch
2
2.2k
Findyのプロデチームの 歩みとこれから
Avatar for Satty satty9556
0
320
What makes a great Director?
Avatar for _Limex_ _limex_
0
340
企業にデザインが融けたとき、デザイナーにできること。事業会社12年間の探究と葛藤 / Designship2025
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
0
820
アプリ360onWeb使い方と裏ワザ？紹介！
Avatar for ikejun360 ikejun360
0
320
decksh object reference
Avatar for Anthony Starks ajstarks
2
1.3k
Portfolio 齋藤明敏 Hiroyuki Saito_守秘義務あり
Avatar for HIROYUKI SAITO crearedesign
0
350

Featured

See All Featured
JavaScript: Past, Present, and Future - NDC Porto 2020
Avatar for David Neal reverentgeek
52
5.7k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
285
14k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
55
9.1k
Scaling GitHub
Avatar for Zach Holman holman
463
140k
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
31
2.7k
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
2.8k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
53k
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
49
51k
Gamification - CAS2011
Avatar for David Bonilla davidbonilla
81
5.5k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
8.9k
BBQ
Avatar for Matthew Crist matthewcrist
89
9.9k

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