Move donation sidebar to pop out at bottom.
This commit is contained in:
		
							parent
							
								
									aa2219fc09
								
							
						
					
					
						commit
						204ca5e9de
					
				
					 4 changed files with 79 additions and 94 deletions
				
			
		|  | @ -131,17 +131,14 @@ text-decoration: none; color: #557733; | ||||||
| /* FIXME: We should do this:          */ | /* FIXME: We should do this:          */ | ||||||
| /* http://www.waypointarts.com/blog/2013/06/29/fixing-a-side-bar-while-scrolling-until-bottom */ | /* http://www.waypointarts.com/blog/2013/06/29/fixing-a-side-bar-while-scrolling-until-bottom */ | ||||||
| .donate-sidebar { | .donate-sidebar { | ||||||
|     position: fixed; |   background: var(--light-green) no-repeat; | ||||||
|     top: 180px; |   position: sticky; | ||||||
|     right: 2%; |   bottom: 0; | ||||||
|     width: 18%; |   width: auto; | ||||||
| } |   padding: 0.5rem 1rem; | ||||||
| @media all and (max-width: 725px) { |   margin: 2rem -1rem 0; | ||||||
|     .donate-sidebar { display: none; } |   border-radius: 8px 8px 0 0; | ||||||
|     .content-with-donate-sidebar { |   border: 1px solid #90d468; | ||||||
|         align: center; |  | ||||||
|         width: 100%; |  | ||||||
|     } |  | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| p.footnote { | p.footnote { | ||||||
|  | @ -279,10 +276,6 @@ body > header { | ||||||
|   margin-left: .5rem; |   margin-left: .5rem; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| 
 |  | ||||||
| #mainContent { |  | ||||||
|   overflow: auto; |  | ||||||
| } |  | ||||||
| #sidebar + #mainContent { | #sidebar + #mainContent { | ||||||
|     float: left; |     float: left; | ||||||
| } | } | ||||||
|  | @ -328,11 +321,6 @@ body > header { | ||||||
|     text-align: center; |     text-align: center; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| .content-with-donate-sidebar { |  | ||||||
|     align: left; |  | ||||||
|     width: 80%; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| #container #mainContent { | #container #mainContent { | ||||||
|     max-width: 50em; |     max-width: 50em; | ||||||
|     margin: 0; |     margin: 0; | ||||||
|  |  | ||||||
|  | @ -8,21 +8,6 @@ | ||||||
| {% endblock %} | {% endblock %} | ||||||
| 
 | 
 | ||||||
| {% block outercontent %} | {% block outercontent %} | ||||||
| <div class="donate-sidebar"> |  | ||||||
| <table style="background-color:#afe478;width:100%;"> |  | ||||||
| <tr><td style="text-align:center;padding:10px;padding-bottom:10px;"> |  | ||||||
| <div id="donate-box" class="toggle-unit"><h1 class="toggle-content">Support |  | ||||||
|     Now!</h1></div> |  | ||||||
| 
 |  | ||||||
| <h3>Support Copyleft Enforcement Now!</h3> |  | ||||||
| 
 |  | ||||||
| <p> |  | ||||||
|   To support our copyleft compliance & enforcement work, |  | ||||||
|   please <a href="/sustainer/#annual"><span class="donate-box-highlight">become a Conservancy |  | ||||||
|       Sustainer <strong>right now</strong></span></a>.  We can't sustain |  | ||||||
|   this work without ongoing support from donors like you!</p> |  | ||||||
| </td></tr></table> |  | ||||||
| </div> |  | ||||||
| <div class="content-with-donate-sidebar"> | <div class="content-with-donate-sidebar"> | ||||||
|     <div id="container"> |     <div id="container"> | ||||||
|          <div id="sidebar" class="{% block submenuselection %}other{% endblock %}"> |          <div id="sidebar" class="{% block submenuselection %}other{% endblock %}"> | ||||||
|  | @ -40,5 +25,18 @@ | ||||||
|          </div> |          </div> | ||||||
|                <div id="mainContent">{% block content %}{% endblock %} |                <div id="mainContent">{% block content %}{% endblock %} | ||||||
|                </div> |                </div> | ||||||
| </div></div> |     </div> | ||||||
|  |     <div class="donate-sidebar"> | ||||||
|  |   <details> | ||||||
|  |     <summary>Support Now!</summary> | ||||||
|  | 
 | ||||||
|  |     <h3>Support Copyleft Enforcement Now!</h3> | ||||||
|  | 
 | ||||||
|  |     <p> | ||||||
|  |       To support our copyleft compliance & enforcement work, | ||||||
|  |       please <a href="/sustainer/#annual"><span class="donate-box-highlight">become a Conservancy | ||||||
|  |       Sustainer <strong>right now</strong></span></a>.  We can't sustain | ||||||
|  |       this work without ongoing support from donors like you!</p> | ||||||
|  |   </details> | ||||||
|  | </div> | ||||||
| {% endblock %} | {% endblock %} | ||||||
|  |  | ||||||
|  | @ -8,21 +8,6 @@ | ||||||
| {% endblock %} | {% endblock %} | ||||||
| 
 | 
 | ||||||
| {% block outercontent %} | {% block outercontent %} | ||||||
| <div class="donate-sidebar"> |  | ||||||
| <table style="background-color:#afe478;width:100%;"> |  | ||||||
| <tr><td style="text-align:center;padding:10px;padding-bottom:10px;"> |  | ||||||
| <div id="donate-box" class="toggle-unit"><h1 class="toggle-content">Support |  | ||||||
|     Now!</h1></div> |  | ||||||
| 
 |  | ||||||
| <h3>Support Copyleft Enforcement Now!</h3> |  | ||||||
| 
 |  | ||||||
| <p> |  | ||||||
|   To support our copyleft compliance & enforcement work, |  | ||||||
|   please <a href="/sustainer/#annual"><span class="donate-box-highlight">become a Conservancy |  | ||||||
|       Sustainer <strong>right now</strong></span></a>.  We can't sustain |  | ||||||
|   this work without ongoing support from donors like you!</p> |  | ||||||
| </td></tr></table> |  | ||||||
| </div> |  | ||||||
| <div class="content-with-donate-sidebar"> | <div class="content-with-donate-sidebar"> | ||||||
|     <div id="container"> |     <div id="container"> | ||||||
|          <div id="sidebar" class="{% block submenuselection %}other{% endblock %}"> |          <div id="sidebar" class="{% block submenuselection %}other{% endblock %}"> | ||||||
|  | @ -39,4 +24,17 @@ | ||||||
|                <div id="mainContent">{% block content %}{% endblock %} |                <div id="mainContent">{% block content %}{% endblock %} | ||||||
|                </div> |                </div> | ||||||
| </div></div> | </div></div> | ||||||
|  | <div class="donate-sidebar"> | ||||||
|  |   <details> | ||||||
|  |     <summary>Support Now!</summary> | ||||||
|  | 
 | ||||||
|  |     <h3>Support Copyleft Enforcement Now!</h3> | ||||||
|  | 
 | ||||||
|  |     <p> | ||||||
|  |       To support our copyleft compliance & enforcement work, | ||||||
|  |       please <a href="/sustainer/#annual"><span class="donate-box-highlight">become a Conservancy | ||||||
|  |       Sustainer <strong>right now</strong></span></a>.  We can't sustain | ||||||
|  |       this work without ongoing support from donors like you!</p> | ||||||
|  |   </details> | ||||||
|  | </div> | ||||||
| {% endblock %} | {% endblock %} | ||||||
|  |  | ||||||
|  | @ -1,4 +1,5 @@ | ||||||
| {% extends "base_conservancy.html" %} | {% extends "base_conservancy.html" %} | ||||||
|  | {% load static %} | ||||||
| {% block subtitle %}Support Conservancy - {% endblock %} | {% block subtitle %}Support Conservancy - {% endblock %} | ||||||
| {% block category %}sustainer{% endblock %} | {% block category %}sustainer{% endblock %} | ||||||
| 
 | 
 | ||||||
|  | @ -14,51 +15,9 @@ | ||||||
|   <p><a href="/">Home</a> / <a href="#fixme">Who We Are</a></p> |   <p><a href="/">Home</a> / <a href="#fixme">Who We Are</a></p> | ||||||
| </div> | </div> | ||||||
| 
 | 
 | ||||||
| <div class="donate-sidebar"> |  | ||||||
| <table style="background-color:#afe478;width:100%;"> |  | ||||||
| <tr><td style="text-align:center;padding:10px;padding-bottom:10px;"> |  | ||||||
| <div id="donate-box" class="toggle-unit"><h1 class="toggle-content">Support |  | ||||||
|     Now!</h1></div> |  | ||||||
| 
 |  | ||||||
| <h3 class="donate-box-highlight">Become a Sustainer Now:</h3> |  | ||||||
| 
 |  | ||||||
| <p>Support us now!</p> |  | ||||||
| 
 |  | ||||||
| <h4><a href="#annual"><span class="donate-box-highlight">Annual sustainer</span> via PayPal, ACH, or credit card.</a></h4> |  | ||||||
| <h4><a href="#monthly"><span class="donate-box-highlight">Monthly sustainer</span> via PayPal, ACH, or credit card.</a></h4> |  | ||||||
| <h4><a href="#renewal"><span class="donate-box-highlight">Renewing Annual sustainer</span> via PayPal, ACH, or credit card.</a></h4> |  | ||||||
| 
 |  | ||||||
| <span class="donate-box-highlight">Other annual sustainers methods:</span> |  | ||||||
| <div class="toggle-unit"> |  | ||||||
|     <h4 class="toggle-control" data-text="Wire Transfer" |  | ||||||
|     data-expanded-text="Wire Transfer:">Wire Transfer</h4> |  | ||||||
|     <div class="toggle-content"> |  | ||||||
|        Contact <a href="mailto:donate@sfconservancy.org">Conservancy |  | ||||||
|             by email</a><br/> for wire transfer instructions.<br/> |  | ||||||
|             Include  currency & country.<br/> |  | ||||||
|     </div><!-- /.toggle-content --> |  | ||||||
| </div><!-- /.toggle.unit --> |  | ||||||
| 
 |  | ||||||
| <div class="toggle-unit"> |  | ||||||
|     <h4 class="toggle-control" data-text="Paper Check" |  | ||||||
|     data-expanded-text="Paper Check:">Paper Check</h4> |  | ||||||
|     <div class="toggle-content"> |  | ||||||
|     Send paper check for $120 to:<br/> |  | ||||||
|     Software Freedom Conservancy, Inc.<br/> |  | ||||||
|     137 MONTAGUE ST  STE 380<br/> |  | ||||||
|     BROOKLYN, NY 11201-3548   USA<br/> |  | ||||||
|     Please write <q>SUSTAINER</q>, t-shirt size, if you are renewing, and if |  | ||||||
|     you want public acknowledgment in memo line. |  | ||||||
|     </div><!-- /.toggle-content --> |  | ||||||
| </div><!-- /.toggle.unit --> |  | ||||||
| 
 |  | ||||||
| <p><a href="/donate">Even More Ways to Donate</a></p> |  | ||||||
| <!-- Flattr end --> |  | ||||||
| </td></tr></table> |  | ||||||
| </div> |  | ||||||
| <div class="content-with-donate-sidebar" id="formStart"> | <div class="content-with-donate-sidebar" id="formStart"> | ||||||
| 
 | 
 | ||||||
|    | 
 | ||||||
| {% if partial_amount > 0 %} | {% if partial_amount > 0 %} | ||||||
|   {% include "supporter/form_partial.html" with form_id="annual" min_amt=minimum_amount partial_amt=partial_amount article="an" only %} |   {% include "supporter/form_partial.html" with form_id="annual" min_amt=minimum_amount partial_amt=partial_amount article="an" only %} | ||||||
| {% else %} | {% else %} | ||||||
|  | @ -214,6 +173,7 @@ you products this end of year season, we offer you a chance to donate to somethi | ||||||
| your money to work fighting for the freedom and rights of all software | your money to work fighting for the freedom and rights of all software | ||||||
| users.</p> | users.</p> | ||||||
| 
 | 
 | ||||||
|  | <div style="overflow: auto"> | ||||||
| <div class="picture-small right"> | <div class="picture-small right"> | ||||||
|   <img src="/img/scaled-LLW-2015-Conservancy-Supporters-by-Carlo-Piana-CC-0.jpg" alt="Zack, Karen, John and Jim pose, mostly wearing the vintage t-shirt!" /> |   <img src="/img/scaled-LLW-2015-Conservancy-Supporters-by-Carlo-Piana-CC-0.jpg" alt="Zack, Karen, John and Jim pose, mostly wearing the vintage t-shirt!" /> | ||||||
|   <p>Vintage-shirt-wearing Sustainers pose with Karen! <br/>From left: Stefano “Zack” Zacchiroli, Karen M. Sandler, John Sullivan, and Jim Wright</p> |   <p>Vintage-shirt-wearing Sustainers pose with Karen! <br/>From left: Stefano “Zack” Zacchiroli, Karen M. Sandler, John Sullivan, and Jim Wright</p> | ||||||
|  | @ -270,10 +230,51 @@ $256 or more between 2020-01-15 and 2021-01-15 can receive one of these vintage | ||||||
| <p>You too can look cool in the vintage design.  Or maybe your original has faded and you're ready to spruce up with a new one?  As we said, | <p>You too can look cool in the vintage design.  Or maybe your original has faded and you're ready to spruce up with a new one?  As we said, | ||||||
| supplies are limited so make a big donation today, support Conservancy, and show you've always been old-school — or just | supplies are limited so make a big donation today, support Conservancy, and show you've always been old-school — or just | ||||||
| want to look that way!</p> | want to look that way!</p> | ||||||
|  | </div> | ||||||
| 
 | 
 | ||||||
| </div> | </div> | ||||||
| <a class="expander" data-expand-link-text="(Expand All Sections)"></a> | <a class="expander" data-expand-link-text="(Expand All Sections)"></a> | ||||||
| </div> | </div> | ||||||
| </div> | </div> | ||||||
| 
 | 
 | ||||||
|  | <div class="donate-sidebar"> | ||||||
|  |   <details> | ||||||
|  |     <summary>Support Now!</summary> | ||||||
|  | 
 | ||||||
|  |     <h3 class="donate-box-highlight">Become a Sustainer Now:</h3> | ||||||
|  | 
 | ||||||
|  |     <p>Support us now!</p> | ||||||
|  | 
 | ||||||
|  |     <h4><a href="#annual"><span class="donate-box-highlight">Annual sustainer</span> via PayPal, ACH, or credit card.</a></h4> | ||||||
|  |     <h4><a href="#monthly"><span class="donate-box-highlight">Monthly sustainer</span> via PayPal, ACH, or credit card.</a></h4> | ||||||
|  |     <h4><a href="#renewal"><span class="donate-box-highlight">Renewing Annual sustainer</span> via PayPal, ACH, or credit card.</a></h4> | ||||||
|  | 
 | ||||||
|  |     <span class="donate-box-highlight">Other annual sustainers methods:</span> | ||||||
|  |     <div class="toggle-unit"> | ||||||
|  |       <h4 class="toggle-control" data-text="Wire Transfer" | ||||||
|  |           data-expanded-text="Wire Transfer:">Wire Transfer</h4> | ||||||
|  |       <div class="toggle-content"> | ||||||
|  |         Contact <a href="mailto:donate@sfconservancy.org">Conservancy | ||||||
|  |         by email</a><br/> for wire transfer instructions.<br/> | ||||||
|  |         Include  currency & country.<br/> | ||||||
|  |       </div><!-- /.toggle-content --> | ||||||
|  |     </div><!-- /.toggle.unit --> | ||||||
|  | 
 | ||||||
|  |     <div class="toggle-unit"> | ||||||
|  |       <h4 class="toggle-control" data-text="Paper Check" | ||||||
|  |           data-expanded-text="Paper Check:">Paper Check</h4> | ||||||
|  |       <div class="toggle-content"> | ||||||
|  |         Send paper check for $120 to:<br/> | ||||||
|  |         Software Freedom Conservancy, Inc.<br/> | ||||||
|  |         137 MONTAGUE ST  STE 380<br/> | ||||||
|  |         BROOKLYN, NY 11201-3548   USA<br/> | ||||||
|  |         Please write <q>SUSTAINER</q>, t-shirt size, if you are renewing, and if | ||||||
|  |         you want public acknowledgment in memo line. | ||||||
|  |       </div><!-- /.toggle-content --> | ||||||
|  |     </div><!-- /.toggle.unit --> | ||||||
|  | 
 | ||||||
|  |     <p><a href="/donate">Even More Ways to Donate</a></p> | ||||||
|  |     <!-- Flattr end --> | ||||||
|  |   </details> | ||||||
|  | </div> | ||||||
| {% endblock %} | {% endblock %} | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		
		Reference in a new issue