inline source code instead of a popup.

doc-src/content/stylesheets/_reference.scss

@@ -32,12 +32,25 @@ body.reference {
       margin-right: 15px; }
     dt:not(:first-child) {
       margin-top: 1em; } }
-  a.view-source {
+  span.view-source {
     float: right;
-    margin: 1.25em; }
+    margin: 1.25em;
+  }
   span.color + span.swatch { margin: 0 3px 3px; border: 1px solid #333333; width: 1em; height: 1em; @include inline-block; }
   .color-snippet { width: 100px; height: 20px; @include border-radius(3px); }
   a.help { font-size: 75%; }
+  .mixin-source {
+    pre {
+      @include transition;
+      @include transparent;
+      display: none;
+    }
+    pre.shown {
+      display: block;
+      @include opaque;
+    }
+  }
+  
 }
 
 body.docs {

doc-src/layouts/dialog.haml

@@ -1 +0,0 @@
-.ui-dialog{(@html || {}).merge(:style => "display: none;")}= yield

doc-src/layouts/partials/reference/mixins.haml

@@ -2,9 +2,16 @@
   %h2 Mixins
 
   - mixin_defs.each do |mixin|
-    %a.view-source{:href=>"#", :onclick => "$('#mixin-source-#{mixin.name}').dialog('open'); return false;"} View Source
+    %span.view-source
+      View Source:
+      %a.view-source{:href=>"#", :onclick => "$('#mixin-#{mixin.name}-source .scss').removeClass('shown');$('#mixin-#{mixin.name}-source .sass').addClass('shown'); return false;"} Sass
+      \|
+      %a.view-source{:href=>"#", :onclick => "$('#mixin-#{mixin.name}-source .sass').removeClass('shown');$('#mixin-#{mixin.name}-source .scss').addClass('shown'); return false;"} SCSS
     %h3.mixin{:id=>"mixin-#{mixin.name}"}
-      %a.permalink{:href => "#mixin-#{mixin.name}"}= mixin_signature mixin
+      %a.permalink{:href => "#mixin-#{mixin.name}"}= mixin_signature(mixin)
+    .mixin-source{:id=>"mixin-#{mixin.name}-source"}
+      %pre.sass= mixin.to_sass
+      %pre.scss= mixin.to_scss
 
     .source-documentation
       = format_doc(mixin.comment)
@@ -14,10 +21,3 @@
             %dt= link_to example.item[:title], example
             - if example.item[:description]
               %dd= example.item[:description]
-    = mixin_source_dialog(mixin) do
-      %pre.source-code.sass= mixin.to_sass
-
-    :javascript
-      $(function(){
-        $('.ui-dialog.mixin').dialog({hide: true, modal: true, autoOpen: false, width: 400});
-      });

doc-src/lib/stylesheets.rb

@@ -168,18 +168,6 @@ def examples(item, mixin = nil)
   examples.map{|i| i.reps.find{|r| r.name == :default}}
 end
 
-
-def mixin_source_dialog(mixin, &block)
-  vars = {
-    :html => {
-      :id => "mixin-source-#{mixin.name}",
-      :class => "mixin",
-      :title => "Source for +#{mixin.name}"
-    }
-  }
-  render 'dialog', vars, &block
-end
-
 def format_doc(docstring)
   if docstring
     RDiscount.new(docstring).to_html