From 2c5460128820dd73babee14ccec981f61feacffe Mon Sep 17 00:00:00 2001 From: Matchu Date: Sat, 2 Jul 2011 13:40:01 -0400 Subject: [PATCH] include donation form right on the page --- app/helpers/static_helper.rb | 17 ++++- app/stylesheets/static/_donate.sass | 27 ++++---- app/views/static/donate.html.haml | 6 +- public/stylesheets/compiled/screen.css | 92 ++++++++++---------------- 4 files changed, 68 insertions(+), 74 deletions(-) diff --git a/app/helpers/static_helper.rb b/app/helpers/static_helper.rb index d63b5d2e..fa95751c 100644 --- a/app/helpers/static_helper.rb +++ b/app/helpers/static_helper.rb @@ -1,7 +1,18 @@ module StaticHelper - def pledgie_link(options={}) - options[:class] ||= "pledgie-link" - link_to 'Donate now!', pledgie_url, options + def pledgie_amount_label_tag(content) + label_tag 'pledge[amount]', content + 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 diff --git a/app/stylesheets/static/_donate.sass b/app/stylesheets/static/_donate.sass index e84ab8f2..ad81f172 100644 --- a/app/stylesheets/static/_donate.sass +++ b/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 diff --git a/app/views/static/donate.html.haml b/app/views/static/donate.html.haml index 486bac2c..8e2b79ec 100644 --- a/app/views/static/donate.html.haml +++ b/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 diff --git a/public/stylesheets/compiled/screen.css b/public/stylesheets/compiled/screen.css index 63feb4a8..be2fb6ac 100644 --- a/public/stylesheets/compiled/screen.css +++ b/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 */ -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 */ +/* line 30, ../../../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 */ -body.static-donate #image-mode-beta .pledgie-link { +/* line 97, ../../../app/stylesheets/static/_donate.sass */ +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; }