website Changeset - 6b649e2f48e0 · Conservancy Kallithea

Changeset - 6b649e2f48e0

Parent rev.

Child rev.

[Not reviewed]

0 3 0

Bradley M. Kuhn - 3 years ago 2020-11-26 03:27:53
bkuhn@sfconservancy.org

Supporter page: Support a “Expand All” link for collapsible sections

I wrap the entire section that has material that can be expanded in a
div with class `expandable-section`. Once doing so, if you provide an
anchor with the class of `expander`, that anchor will be created with
text in the `data-expand-link-text` attribute.

I've also added some CSS to make the link look a certain way, for
good measure.

3 files changed with 23 insertions and 2 deletions:

www/conservancy/static/css/forms.css

www/conservancy/static/js/supporter-page.js

www/conservancy/templates/supporter/index.html

0 comments (0 inline, 0 general)

www/conservancy/static/css/forms.css

➞

Show inline comments

@@ ... / @@ -109,6 +109,11 @@ img.appeal-match { @@
+}
 p.appeal-match-text  {
     width: 100%;
     border: 1px solid #fff;
     background: #eee;
+}
 a.expander {
     font-size: 75%;
     font-style: italic;
     text-align: center;
+}

www/conservancy/static/js/supporter-page.js

➞

Show inline comments

 /* Copyright (C) 2012-2013 Denver Gingerich,
 ** Copyright (C) 2013-2014 Bradley M. Kuhn,
+** Copyright (C) 2013-2014, 2020 Bradley M. Kuhn,
 ** Copyright (C) 2016, 2020 Brett Smith.
 ** License: GPLv3-or-later
 **  Find a copy of GPL at https://sfconservancy.org/GPLv3
 */
 var NEW_AMOUNT_EVENT = 'conservancy:newamount';
@@ ... / @@ -125,7 +125,20 @@ $(document).ready(function() { @@
                 $linkpara.replaceWith($readmore);
                 $readmore.fadeIn('fast');
             });
             $readmore.hide().replaceWith($linkpara);
+        }
     });
     $('a[data-expand-link-text]').each(function(index, element) {
         var $element = $(element);
         $element.append($element.data('expand-link-text'));
         $element.removeAttr('data-expand-link-text');
     });
     $('.expandable-section').each(function(index) {
         var $expandlink = $(this).children('.expander');
         var $ourexpandablesection = $(this);
         $expandlink.addClass('active').trigger('click');
         $expandlink.on('click', function(event) {
             $expandlink.fadeOut('slow');
             $ourexpandablesection.find('.read-more').each(function(index) { $(this).click(); }); });
     });
 });

www/conservancy/templates/supporter/index.html

➞

Show inline comments

@@ ... / @@ -74,12 +74,13 @@ @@
   {% include "supporter/form_partial.html" with form_id="renewal" min_amt=120 verb="renew" article="an" supptype="annual" only %}
 {% endif %}
 <span id="form-correction-needed" class="form-error">Please ensure all form data above is correct.</span>
 <hr style="clear: both;"/>
 <div class="expandable-section">
 <div class="picture right" style="clear: right;">
   <img src="/img/2020_Sebro-Tony_CopyleftConf.jpg" alt="Tony Sebro speaks on stage in front of a slide comparing 1800&rsquo;s Eschatology and Golden Era Hip Hop">
   <p>Tony Sebro, delivering the keynote address at Copyleft Conf 2020. Photo copyright &copy; by Remy DeCausemaker, licensed <a href="https://creativecommons.org/licenses/by-sa/4.0/">CC BY-SA</a></p>
 </div>
@@ ... @@
 software freedom. We keep working to grow and support FOSS
 communities to plan for ethical technology down the road, so that software
 freedom can be in the service of human freedom.</p>
 <p>We&rsquo;re proud of how much we&rsquo;ve been able to accomplish in the last year,
 even in the face of so many obstacles.</p>
 <a class="expander" data-expand-link-text="(Expand All Sections)"/>
 <h3 id="StayingConnected">Staying Connected</h3>
 <div data-read-more="Read more about staying connected&hellip;">
 <p>We helped folks stay connected, even when travel
 and in-person meetings could not happen. We gathered digitally every
 Thursday with all who wanted to join since early March to discuss
 important issues or just reach out to other people who care about software freedom. The topics of these chats varied widely from
@@ ... @@
 non-profit management team in FOSS.  We couldn&rsquo;t have predicted the
 pandemic, but we did plan for the worst.  We&rsquo;re frugal, careful, and we plan ahead, so you can know that every
 dollar you give to Conservancy is used to support critical work.  While companies sell
 you products this end of year season, we offer you a chance to donate to something much bigger. By becoming a Conservancy Supporter, you can put
 your money to work fighting for the freedom and rights of all software
 users.</p>
+</div>
 {% endblock %}

0 comments (0 inline, 0 general)