{"id":1491,"date":"2012-03-11T13:33:22","date_gmt":"2012-03-11T20:33:22","guid":{"rendered":"http:\/\/www.techory.com\/blog\/?p=1491"},"modified":"2012-03-11T13:59:25","modified_gmt":"2012-03-11T20:59:25","slug":"simplify-css-development-with-sass-compass","status":"publish","type":"post","link":"https:\/\/www.techory.com\/blog\/simplify-css-development-with-sass-compass\/","title":{"rendered":"Simplify CSS Development with Sass &#038; Compass"},"content":{"rendered":"<p><strong>Sunday, March 11 &#8211; 3:30PM &#8211; 4:30PM<\/strong><br \/>Alex Lemanski Founder\/Web Craftsman Bitfyre<\/p>\n<p>Slides, Links, Examples: <\/p>\n<ul>\n<li>Saas allows for variables so you only have to replace elements in a single place in your style sheet.<\/li>\n<li>Nesting selectors so you don&#8217;t have to repeat multiple tags or divs<\/li>\n<li>Nesting Statements as well<\/li>\n<\/ul>\n<p><strong>Tools:<\/strong><\/p>\n<ul>\n<li>Web Workbench (Visual Studio Plugin)<\/li>\n<li>Compass.app (Mac\/Windows\/Linux)<\/li>\n<li>CodeKit (Mac)<\/li>\n<li>Scount<\/li>\n<\/ul>\n<p><strong>Commandline Tools:<\/strong><\/p>\n<ul>\n<li>Saas itself<\/li>\n<li>sass convert<\/li>\n<li>Middleman<\/li>\n<li>Compass<\/li>\n<\/ul>\n<p><strong>Debugging Tools:<\/strong><\/p>\n<ul>\n<li>Generated Line Comments<\/li>\n<li>FireSass for Firebug<\/li>\n<\/ul>\n<p><strong>Common Good Practices in CSS (same for Sass):<\/strong><\/p>\n<ul>\n<li>don&#8217;t nest more than 4 selectors deep<\/li>\n<li>break things down as much as possible<\/li>\n<li>work from the main area of content out<\/li>\n<\/ul>\n<p>Number conversions can be created to convert px to em or back.<\/p>\n<p>For the actual compiled CSS output, you can display it whatever way you&#8217;d like:<br \/>nested, expanded, compact<\/p>\n<p>Nice mixins for the various browser-specific syntax &#8211; Sass can just bring them all in.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Sunday, March 11 &#8211; 3:30PM &#8211; 4:30PMAlex Lemanski Founder\/Web Craftsman Bitfyre Slides, Links, Examples: Saas allows for variables so you only have to replace elements in a single place in your style sheet. Nesting selectors so you don&#8217;t have to repeat multiple tags or divs Nesting Statements as well Tools: Web Workbench (Visual Studio Plugin)&#8230;  <a class=\"excerpt-read-more\" href=\"https:\/\/www.techory.com\/blog\/simplify-css-development-with-sass-compass\/\" title=\"Read Simplify CSS Development with Sass &#038; Compass\">Read more &raquo;<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"activitypub_content_warning":"","activitypub_content_visibility":"","activitypub_max_image_attachments":4,"activitypub_interaction_policy_quote":"anyone","activitypub_status":"","footnotes":""},"categories":[16],"tags":[],"class_list":["post-1491","post","type-post","status-publish","format-standard","hentry","category-sxsw"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.techory.com\/blog\/wp-json\/wp\/v2\/posts\/1491","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.techory.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.techory.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.techory.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.techory.com\/blog\/wp-json\/wp\/v2\/comments?post=1491"}],"version-history":[{"count":1,"href":"https:\/\/www.techory.com\/blog\/wp-json\/wp\/v2\/posts\/1491\/revisions"}],"predecessor-version":[{"id":1492,"href":"https:\/\/www.techory.com\/blog\/wp-json\/wp\/v2\/posts\/1491\/revisions\/1492"}],"wp:attachment":[{"href":"https:\/\/www.techory.com\/blog\/wp-json\/wp\/v2\/media?parent=1491"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.techory.com\/blog\/wp-json\/wp\/v2\/categories?post=1491"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.techory.com\/blog\/wp-json\/wp\/v2\/tags?post=1491"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}