Re: Proposal to use SASS for writing our CSS

[John Locke <..hidden..>]

Hi, Erik,


On 06/21/2015 01:27 PM, Erik Huelsmann wrote:
> Hi,
>
> In my previous mail, I highlight how it's necessary to create per-page 
> CSS by enclosing the page in a DIV with a globally unique 'id' 
> attribute and scoping any CSS declarations within that.
>

Use the Body tag. Don't need another div for this. (Ok, that is, unless 
this is an Ajax response...)

<snip>
> Or even shorter (and more comprehensible):
>
> #account-tabs {

... Can do multiple parents at once:

#account-tabs, #contact-tabs, #part-tabs {

... this takes Sass to a much more succinct level, at least in the files 
we actually want to edit...

>   @mixin account-tabs-mixin($selector) {
>     #{$selector} {
>    <snip>
>       }
>      }
>    }

... we organize all the mixins into their own files. In Drupal's Omega4 
theme, it provides an organization of Sass into partials, each of which 
gets loaded in order, so later partials can rely on earlier-defined 
mixins, variables, etc. Main Sass file looks like this:

@import "compass";
@import "breakpoint";
@import "singularitygs";
@import "toolkit";

@import "variables/**/*";
@import "abstractions/**/*";
@import "base/**/*";
@import "components/**/*";

... So first it includes a lot of really useful mixins/Sass functions, 
and then it loads our partials, in a specific sequence.

Variables contain all the stuff we might consider the "theme" : colors, 
fonts, font sizes, etc.

Abstractions would contain your mixins for commonly used things.

Base includes general UI elements: forms, tables, lists, buttons, etc.

Components are where you put your individual page-specific CSS. It can 
use anything that was defined before...

>
> Unless there are objections, I'm going to create a new directory, next 
> to the css directory, called 'scss' in  which we'll store SASS files. 
> Next to that, I'll make sure to write documentation on how to compile 
> sass files into css files. There are even tools to compile sass files 
> to css files immediately when they are being saved ('compass watch' 
> from http://compass-style.org/help/documentation/command-line/).
>

Ah, that's where things get fun. We've had tons of issues with 
version/dependency hell with Sass libraries and Compass.

My best recommendation is to use RVM to manage ruby environments, and 
Bundler to install the necessary gems into the environment. Otherwise we 
get on a conveyor belt of a constantly moving Ruby Gem version target, 
and far too much upkeep...

Cheers,
John Locke
http://www.freelock.com

------------------------------------------------------------------------------
Monitor 25 network devices or servers for free with OpManager!
OpManager is web-based network management software that monitors 
network devices and physical & virtual servers, alerts via email & sms 
for fault. Monitor 25 devices for free with no restriction. Download now
http://ad.doubleclick.net/ddm/clk/292181274;119417398;o
_______________________________________________
Ledger-smb-devel mailing list
..hidden..
https://lists.sourceforge.net/lists/listinfo/ledger-smb-devel