include donation form right on the page

app/helpers/static_helper.rb

@@ -1,7 +1,18 @@
 module StaticHelper
-  def pledgie_link(options={})
+  def pledgie_amount_label_tag(content)
-    options[:class] ||= "pledgie-link"
+    label_tag 'pledge[amount]', content
-    link_to 'Donate now!', pledgie_url, options
+  end
+
+  def pledgie_amount_field_tag
+    text_field_tag 'pledge[amount]', '0.00', :id => 'pledge_amount'
+  end
+
+  def pledgie_confirm_url
+    "http://pledgie.com/campaigns/#{PLEDGIE_CAMPAIGN_ID}/pledge/confirm"
+  end
+
+  def pledgie_form_tag(*args, &block)
+    form_tag(pledgie_confirm_url, *args, &block)
   end
 
   def pledgie_url

app/stylesheets/static/_donate.sass

@@ -19,16 +19,6 @@ body.static-donate
   h2
     margin-bottom: .25em
 
-  .pledgie-link
-    +awesome-button
-    +loud-awesome-button-color
-
-  #pledgie-link-with-title
-    float: right
-    font-size: 150%
-    margin-top: .5em
-    padding: .75em
-
   $image-mode-preview-image-width: 300px
   $image-mode-preview-image-border-width: 1px
   $image-mode-preview-h-padding: 20px
@@ -104,10 +94,23 @@ body.static-donate
       font-size: 75%
       margin: 0
 
-    .pledgie-link
+    form
       margin: .75em 0
 
+      label
+        font-size: 85%
+        font-weight: bold
+
+        &:after
+          content: ":"
+
+      input
+        width: 5em
+
+      button
+        +loud-awesome-button-color
+
   #image-mode-description, #image-mode-comments
-    float: left
+    float: right
     width: $image-mode-description-width
 

app/views/static/donate.html.haml

@@ -1,5 +1,4 @@
 - title "Support Dress to Impress"
-= pledgie_link :id => 'pledgie-link-with-title'
 %h2 Image Mode is almost here, but we need your help!
 
 = campaign_progress do
@@ -24,7 +23,10 @@
   %header
     As a Thank You gift, those who donate at least $5 will receive early
     beta access to Image Mode
-  = pledgie_link
+  = pledgie_form_tag do
+    = pledgie_amount_label_tag 'Amount'
+    = pledgie_amount_field_tag
+    %button{:type => 'submit'} Donate now!
   %p
     Include your
     = link_to 'Dress to Impress username', login_path_with_return_to

public/stylesheets/compiled/screen.css

@@ -2568,50 +2568,7 @@ body.static-donate #title, body.static-donate h2 {
 body.static-donate h2 {
   margin-bottom: 0.25em;
 }
-/* line 22, ../../../app/stylesheets/static/_donate.sass */
+/* line 30, ../../../app/stylesheets/static/_donate.sass */
-body.static-donate .pledgie-link {
-  /* http://www.zurb.com/blog_uploads/0000/0617/buttons-03.html */
-  -moz-border-radius: 5px;
-  -webkit-border-radius: 5px;
-  background: #006400 url('/images/alert-overlay.png?1296599919') repeat-x;
-  border: 0;
-  display: inline-block;
-  padding: 0.5em 0.75em 0.45em;
-  color: white;
-  text-decoration: none;
-  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
-  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
-  text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
-  border-bottom: 1px solid rgba(0, 0, 0, 0.25);
-  position: relative;
-  font-weight: bold;
-  line-height: 1;
-  background: #ff5c00 url('/images/alert-overlay.png?1296599919') repeat-x;
-}
-/* line 34, ../../../app/stylesheets/partials/clean/_mixins.sass */
-body.static-donate .pledgie-link:hover {
-  background-color: #005300;
-}
-/* line 53, ../../../app/stylesheets/partials/clean/_mixins.sass */
-body.static-donate .pledgie-link:hover {
-  color: white;
-}
-/* line 55, ../../../app/stylesheets/partials/clean/_mixins.sass */
-body.static-donate .pledgie-link:active {
-  top: 1px;
-}
-/* line 34, ../../../app/stylesheets/partials/clean/_mixins.sass */
-body.static-donate .pledgie-link:hover {
-  background-color: #ee4b00;
-}
-/* line 26, ../../../app/stylesheets/static/_donate.sass */
-body.static-donate #pledgie-link-with-title {
-  float: right;
-  font-size: 150%;
-  margin-top: 0.5em;
-  padding: 0.75em;
-}
-/* line 40, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #image-mode-data {
   clear: both;
   display: block;
@@ -2619,7 +2576,7 @@ body.static-donate #image-mode-data {
   margin-right: 20px;
   width: 344px;
 }
-/* line 47, ../../../app/stylesheets/static/_donate.sass */
+/* line 37, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #image-mode-preview {
   border: 1px solid #006600;
   margin: 0 0 2em 0;
@@ -2628,39 +2585,39 @@ body.static-donate #image-mode-preview {
   padding-bottom: 13.333px;
   padding-left: 20px;
 }
-/* line 56, ../../../app/stylesheets/static/_donate.sass */
+/* line 46, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #image-mode-preview img {
   border: 1px solid #006600;
   margin-bottom: 0.5em;
 }
-/* line 60, ../../../app/stylesheets/static/_donate.sass */
+/* line 50, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #image-mode-preview figcaption {
   display: block;
   font-family: Calligraffitti;
   font-size: 250%;
   text-align: center;
 }
-/* line 66, ../../../app/stylesheets/static/_donate.sass */
+/* line 56, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #campaign-donors {
   display: none;
   margin-right: 20px;
   width: 344px;
 }
-/* line 71, ../../../app/stylesheets/static/_donate.sass */
+/* line 61, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #campaign-donors ol {
   font-size: 85%;
   padding-left: 2em;
 }
-/* line 75, ../../../app/stylesheets/static/_donate.sass */
+/* line 65, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #campaign-donors ol span {
   color: #448844;
   float: right;
 }
-/* line 79, ../../../app/stylesheets/static/_donate.sass */
+/* line 69, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #campaign-donors.has-donors {
   display: block;
 }
-/* line 88, ../../../app/stylesheets/static/_donate.sass */
+/* line 78, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #image-mode-beta {
   background: #eeffee;
   border: 1px solid #006600;
@@ -2673,24 +2630,45 @@ body.static-donate #image-mode-beta {
   text-align: center;
   width: 404px;
 }
-/* line 98, ../../../app/stylesheets/static/_donate.sass */
+/* line 88, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #image-mode-beta header {
   display: block;
   font-weight: bold;
 }
-/* line 102, ../../../app/stylesheets/static/_donate.sass */
+/* line 92, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #image-mode-beta p {
   font-family: "Droid Sans", Helvetica, Arial, Verdana, sans-serif;
   font-size: 75%;
   margin: 0;
 }
-/* line 107, ../../../app/stylesheets/static/_donate.sass */
+/* line 97, ../../../app/stylesheets/static/_donate.sass */
-body.static-donate #image-mode-beta .pledgie-link {
+body.static-donate #image-mode-beta form {
   margin: 0.75em 0;
 }
+/* line 100, ../../../app/stylesheets/static/_donate.sass */
+body.static-donate #image-mode-beta form label {
+  font-size: 85%;
+  font-weight: bold;
+}
+/* line 104, ../../../app/stylesheets/static/_donate.sass */
+body.static-donate #image-mode-beta form label:after {
+  content: ":";
+}
+/* line 107, ../../../app/stylesheets/static/_donate.sass */
+body.static-donate #image-mode-beta form input {
+  width: 5em;
+}
 /* line 110, ../../../app/stylesheets/static/_donate.sass */
+body.static-donate #image-mode-beta form button {
+  background: #ff5c00 url('/images/alert-overlay.png?1296599919') repeat-x;
+}
+/* line 34, ../../../app/stylesheets/partials/clean/_mixins.sass */
+body.static-donate #image-mode-beta form button:hover {
+  background-color: #ee4b00;
+}
+/* line 113, ../../../app/stylesheets/static/_donate.sass */
 body.static-donate #image-mode-description, body.static-donate #image-mode-comments {
-  float: left;
+  float: right;
   width: 436px;
 }