| // -------------------------------------------------------- | |
| // arrows | |
| // -------------------------------------------------------- | |
| // $direction: top, left, right, bottom, top-left, top-right, bottom-left, bottom-right | |
| // $color: hex, rgb or rbga | |
| // $size: px or em | |
| // @example | |
| // .element{ | |
| // @include arrow(top, #000, 50px); | |
| // } |
| // options for :class to handle different form layouts | |
| // horizontal-labels - default | |
| // vertical-lables | |
| // overlay-labels | |
| %form{:id => "", :name => "", :class => "", :action => "", :method => "post", "accept-charset" => "utf-8", "aria-role" => "form", "aria-live" => "polite", "aria-atomic" => "false"} | |
| %fieldset{:id => "", :class => ""} | |
| %legend | |
| %h3 Basic Input Fields |
| # Add commit messages with Sublime | |
| export EDITOR='subl -w' | |
| # GIT super shortcuts | |
| alias ga='git add' | |
| alias gp='git pull' | |
| alias gps='git push' | |
| alias gc='git commit -a' | |
| alias gcm='git commit -m' |
| .content{{css.id}} | |
| or | |
| %img{:src => "{{img.src}}", :alt => "{{img.alt}}"} |
| @import "compass"; | |
| // Math Operators | |
| // =, -, *, /, % | |
| // 5em + 5em; // 2em | |
| // 5em - 2em; // 3em | |
| // 1in + 72pt; // 2in | |
| // 6px * 100; // 600px | |
| // 18 & 5; // 3 |
| * Studio Banks | |
| * Skookum | |
| * Wray Ward | |
| * Boone Oakley | |
| * WebsiteBiz | |
| * Myjive |
| %fieldset | |
| %legend | |
| %label{:for => "checkbox-group"} Group of Checkboxes | |
| .fields.inline | |
| .field.checkbox | |
| %input{:type => "checkbox", :id => "checkbox-1", :name => "checkbox-group", :value => "", "aria-checked" => "false"} | |
| %label{:for => "checkbox-1"} First Checkbox | |
| .field.checkbox | |
| %input{:type => "checkbox", :id => "checkbox-2", :name => "checkbox-group", :value => "", "aria-checked" => "true", "aria-labeledby" => "l-checkbox-2"} | |
| %label{:for => "checkbox-2"} Second Checkbox |
The W3C has changed their approach a bit with CSS3. They've made things modular and each module is designed to be implemented separately and independently from each other.
This is good for us because it (hopefully) helps the spec move forward faster and allows browser makers to implement module by module.
It lets us play with lots of the new CSS3 properties that aren't 100% complete.
| Add a comment with with front-end, back-end or design so I can get you placed in the correct team. |