website Changeset - efe90bd2d04e · Conservancy Kallithea

Changeset - efe90bd2d04e

Parent rev.

Child rev.

[Not reviewed]

0 3 0

Bradley Kuhn (bkuhn) - 9 years ago 2015-03-09 15:46:16
bkuhn@ebb.org

Better animation effects when donate link clicked.

The banner always faded in/out, but now other texts can be designated
with the class 'donate-box-highlight' and those will fade out and fade
back in with bold and slightly larger font.

3 files changed with 17 insertions and 9 deletions:

www/conservancy/static/npoacct/index.html

www/conservancy/static/supporter-page.js

www/conservancy/templates/base_compliance.html

0 comments (0 inline, 0 general)

www/conservancy/static/npoacct/index.html

➞

Show inline comments

@@ ... @@
 <p style="font-size: 75%">(Progress bar updated daily.)</p>
 <a id="donate" style="text-decoration:none"></a>
 <h3>Help us reach our goal:</h3>
+<h3 class="donate-box-highlight">Help us reach our goal:</h3>
 <!-- PayPal start -->
@@ ... @@
 <p>
 Other donation methods:
+  <span class="donate-box-highlight">Other donation methods:</span>
 <div class="toggle-unit">
     <h4 class="toggle-control" data-text="Wire Transfer"

www/conservancy/static/supporter-page.js

➞

Show inline comments

@@ ... / @@ -60,8 +60,16 @@ $(document).ready(function() { @@
       .bind('click', function() {
         var $control = $('#donate-box');
         var $otherTextControl = $('.donate-sidebar');
         $control.toggleClass('expanded');
         $control.find('.toggle-content').slideUp("slow");
         $control.find('.toggle-content').slideDown("slow");
         setTimeout(function() { $control.find('.toggle-content').slideUp(100);
                                 $control.toggleClass('expanded');
                                 $control.find('.toggle-content').slideDown(800).fadeOut(10);
                                 $otherTextControl.find('.donate-box-highlight').fadeOut(100);
                               }, 300);
           setTimeout(function() { $control.find('.toggle-content').fadeIn(2000);
                                   $otherTextControl.find('.donate-box-highlight')
                                   .css({'font-weight': 'bold', 'font-size' : '110%' });
                                   $otherTextControl.find('.donate-box-highlight').fadeIn(10000);
                                 }, 500);
     });
     $(".t-shirt-size-selector").hide();

www/conservancy/templates/base_compliance.html

➞

Show inline comments

@@ ... / @@ -20,5 +20,5 @@ @@
 <h3>Support GPL Compliance Now!</h3>
-<p>Support our GPL compliance work now &amp; <strong>donations count double!</strong></p>
+<p>Support our GPL compliance work now &amp; <span class="donate-box-highlight">donations count double!</span></p>
 {% cache 3600 compliancedonation fundgoal.fundraiser_so_far_amount %}
@@ ... @@
 {% endcache %}
 <p>Donate now via PayPal:
+<p><span class="donate-box-highlight">Donate now via PayPal:</span>
 </p>
 <!-- PayPal start -->
@@ ... @@
 <!-- PayPal end -->
 <p>Or, <a href="/supporter/#annual"><strong>become a Conservancy
       Supporter</strong></a> (&mdash; a better option if you're donating more
 <p>Or, <a href="/supporter/#annual"><span class="donate-box-highlight">become a Conservancy
       Supporter</span></a> (&mdash; a better option if you're donating more
       than $120, since you'll get a t-shirt!).</p>
 </td></tr></table>

0 comments (0 inline, 0 general)