Compare commits

...

1 Commits

Author SHA1 Message Date
John Bintz
e9c3ee34fa spelling updates 2012-03-23 15:55:41 -04:00
9 changed files with 28 additions and 32 deletions

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
.sass-cache/

View File

@ -3,7 +3,7 @@
!SLIDE
# What is Sass?
## Its a preprocesor
## It's a preprocesor
!SLIDE
# What does it do?
@ -13,7 +13,7 @@
* Functions
* Selector Inheritance `@extend, &`
* Control Directives `@if, @for, @each, @while`
* Its a language!
* It's a language!
!SLIDE variables
# Variables
@ -46,7 +46,7 @@
!SLIDE
# In ruby
# In Ruby
``` ruby
Sass::Script::List.new(['1px', 'solid', 'black'], ',')
@ -123,7 +123,7 @@ a:hover { color : red; }
```
!SLIDE
## Extending with ruby
## Extending with Ruby
``` ruby
def sprite(map, sprite, offset_x = ZERO, offset_y = ZERO)

View File

@ -43,10 +43,10 @@ $ancillary-compliment-color : rgb(150,150,150) !default;
```
!SLIDE pallet
# Pallets
# Palettes
``` scss
// _pallet.scss
// _palette.scss
$orange : rgb(138, 182, 225) !default;
$blue : rgb(33,89,167) !default;
$lighter-blue : rgb(138, 182, 225) !default;
@ -69,6 +69,6 @@ $ancillary-compliment-color : $lighter-gray;
!SLIDE important long
<img src="/assets/rage-face.png">
# Only use your pallet colors to define your more descriptive color variables!
# Only use your palette colors to define your more descriptive color variables!

View File

@ -1,9 +1,9 @@
!SLIDE
# Math
## Is your best friend
## is your best friend
!SLIDE long
# *Almost* every thing a designer does can be converted into some sort of mathmatical layout... *ALMOST*
# *Almost* everything a designer does can be converted into some sort of mathmatical layout... *ALMOST*
!SLIDE
@ -40,11 +40,11 @@ $main-content-width : $wrapper - $sidebar;
}
```
!SLIDE
# Image demensions
# Image dimensions
``` scss
.play {
left: ($width / 2) - (global-sprite-width(play_movie) / 2);
top: ($height / 2) - (global-sprite-height(play_movie) / 2);
}
```
<img src='/assets/play_button.png' >
<img src='/assets/play_button.png' >

View File

@ -2,7 +2,7 @@
# Inheritance
!SLIDE
# Inception rule!
# Inception Rule!
<img src="/assets/InceptionArch_Slusher.jpg" width='800px'>
!SLIDE
@ -48,4 +48,4 @@
color:$hover-color;
}
}
```
```

View File

@ -5,13 +5,13 @@
!SLIDE
* Stylesheet framework
* Considered sass standard library
* Considered Sass standard library
* Standalone application
* Has the ability to have application integrations (rails, django, etc.)
* Has the ability to have application integrations (Rails, Django, etc.)
!SLIDE
## Currently the only application integration supported by the core team is rails
## Currently the only application integration supported by the core team is Rails
!SLIDE big-list
@ -28,10 +28,10 @@
!SLIDE medium-list
* Fewer http requests.
* Fewer HTTP requests.
* You don't have a bunch of individual images to manage.
* Customizable
* ITS EASY!
* Customizable.
* IT'S EASY!
!SLIDE
@ -132,7 +132,7 @@ a:active, a.glossy-active {
!SLIDE
# We support most CSS3 properties with vendor prefix's.
# We support most CSS3 properties with vendor prefixes.
!SLIDE big-list
@ -228,9 +228,3 @@ http://coding.smashingmagazine.com/2009/04/03/8-simple-ways-to-improve-typograph
<img src='/assets/fancy-buttons.png' >

View File

@ -11,11 +11,11 @@
!SLIDE
## @content
``` scss
@mixin do-something {
@mixin do-something {
font-size : 12px;
color : red;
@content;
}
}
p {
@include do-something {
@ -35,5 +35,5 @@ p {
!SLIDE medium-list
# Compass
* Media query framework
* A css hacks library
* Extract blueprint from compass to a stand alone framework
* A CSS hacks library
* Extract Blueprint from Compass to a stand alone framework

View File

@ -4,7 +4,7 @@
https://github.com/chriseppstein/compass
* Documentation
* Stylesheet cleanup
* Stylesheet Cleanup
* Code Refactoring
!SLIDE small-list
@ -23,4 +23,5 @@ https://github.com/chriseppstein/compass
### Please donate - http://umdf.org/compass
!SLIDE
# Questions!
# Questions!