#jarsbe

[threemonths-dev]

Useful SASS tidbits

I've been working a lot lately with SASS (or SCSS whatever) and there are some pretty neat tricks that make writing CSS seem almost programatic (we all know it's not).

For example it's possible to check the lightness of an elements background, then dictate the text colour depending on that outcome (example sourced from Foundation).

@mixin button($bg:$default-bg) { $bg-lightness: lightness($bg); @if $bg-lightness > 70% { color: $button-font-color-dark; &:hover, &:focus { color: $button-font-color-dark; } } @else { color: $button-font-color-light; &:hover, &:focus { color: $button-font-color-light; } } }

Another useful tidbit is using the for loop.

@for $i from 0 through 2 { .item-#{$i} { border: 1px solid gold; } } @for $i from 3 through 5 { .item-#{$i} { border: 1px solid silver; } } @for $i from 6 through 8 { .item-#{$i} { border: 1px solid bronzw; } }

Which then compiles into:

.item-0, .item-1. .item-2 { border: 1px solid gold; } .item-3, .item-4. .item-5 { border: 1px solid silver; } .item-6, .item-7. .item-8 { border: 1px solid bronze; }

There are a lot more useful tools within the SASS DSL, I'd suggest spending 15 minutes or so just reading through the docs.

Written by Jack Callister

[threemonths-dev]

Method delegation

Here's a sweet trick avoid lengthy chaining in your method calls. An example of where this comes in handy is a product model I was working on recently. The relationships looked like this.

class ProductType < ActiveRecord::Base has_many :products has_many :fields, class_name: "Product::Field" end

class Product < ActiveRecord::Base has_many :properties belongs_to :product_type end

class Product::Property < ActiveRecord::Base belongs_to :product belongs_to :field, class_name: 'Product::Field' has_one :product_type, :through => :field end

class Product::Property < ActiveRecord::Base belongs_to :product_type end

Here's brief run down of the relationships starting at the top. A product type has many fields. Fields on a product type are like the blue print of the attributes that make up that product type. A product belongs to the product type and also has many properties. Properties are the model that actually hold the values for each field so it belongs to a field.

With such closely nit correlation between fields and properties this type of thing happens quite often.

property.field.datatype property.field.key property.field.label

By adding a few delegate methods on properties we can make life much easier!

class Product::Property < ActiveRecord::Base # Omitted model stuff with_options allow_nil: true do |field_delegate| field_delegate.delegate :datatype, to: :field field_delegate.delegate :key, to: :field field_delegate.delegate :label, to: :field end

Now I can call the fields methods with ease. A small but useful and clean change.

property.datatype property.key property.label

Written by Jack Callister