diff --git a/source/guide.html.haml b/source/guide.html.haml
index 70b9147d0..73b167d16 100644
--- a/source/guide.html.haml
+++ b/source/guide.html.haml
@@ -239,19 +239,36 @@ introduction: >
- example do
:plain
- @mixin transform($property) {
- -webkit-transform: $property;
- -ms-transform: $property;
- transform: $property;
+ @mixin theme($theme: DarkGray) {
+ background: $theme;
+ box-shadow: 0 0 1px rgba($theme, .25);
+ color: #fff;
+ }
+
+ .info {
+ @include theme;
+ }
+ .alert {
+ @include theme($theme: DarkRed);
+ }
+ .success {
+ @include theme($theme: DarkGreen);
}
- .box { @include transform(rotate(30deg)); }
===
- =transform($property)
- -webkit-transform: $property
- -ms-transform: $property
- transform: $property
- .box
- +transform(rotate(30deg))
+ @mixin theme($theme: DarkGray)
+ background: $theme
+ box-shadow: 0 0 1px rgba($theme, .25)
+ color: #fff
+
+
+ .info
+ @include theme
+
+ .alert
+ @include theme($theme: DarkRed)
+
+ .success
+ @include theme($theme: DarkGreen)
:markdown
To create a mixin you use the `@mixin` directive and give it a name. We've