website Changeset - af5d12f7a1d6 · Conservancy Kallithea

Changeset - af5d12f7a1d6

Parent rev.

Child rev.

[Not reviewed]

0 2 0

Bradley Kuhn (bkuhn) - 9 years ago 2014-12-08 22:14:52
bkuhn@ebb.org

Rework CSS for "Big News" & add image.

This image now is displayed with the same background and to the left of
the "Big News". I spent extensive time researching how best to present
a larger <div> with the grey background and have the image properly
scale beside it. Ultimately, I couldn't find a better way than this,
and this is hardly optimal.

For example, I looked into wrapping the whole thing in a div, with two
div's inside, and applying various CSS to each to get the image to
properly stay right next to the text and scale in size when resizing of
media made paragraph longer. This generated even more problems, so I
went with the simpler solution herein, which probably isn't correct and
may well do odd things on different types of media.

2 files changed with 21 insertions and 4 deletions:

www/conservancy/static/forms.css

www/conservancy/static/supporter/index.html

0 comments (0 inline, 0 general)

www/conservancy/static/forms.css

➞

Show inline comments

@@ ... / @@ -61,12 +61,27 @@ img.appeal { @@
 img.appeal-header {
     max-width: 100%;
     height: auto;
+}
 img.appeal-footer {
     max-width: 40%;
     float: right;
     width: 10%;
     min-width: 1%;
     height: auto;
+}
 img.appeal-match {
     float: left;
     height: auto;
     border: 1px solid #fff;
     width: 10%;
     margin-top: .25em;
     margin-bottom: .25em;
     margin-right: 1em;
     background: #eee;
+}
 p.appeal-match-text  {
     width: 100%;
     border: 1px solid #fff;
     background: #eee;
+}

www/conservancy/static/supporter/index.html

➞

Show inline comments

@@ ... / @@ -54,30 +54,32 @@ Other payment methods to become an annual supporter: @@
     </div><!-- /.toggle-content -->
 </div><!-- /.toggle.unit -->
 <p><a href="/donate">Other Ways to Donate</a></p>
 <!-- Flattr end -->
 </td></tr></table>
 </div>
 <div style="align:left;width:80%;">
   <h1><img class="appeal-header" alt="Become a Conservancy Supporter!" src="/img/conservancy-supporter-header.png"/></h1>
 <blockquote>
 <p><strong>Big News:</strong> A generous anonymous donor has agreed to donate
  <img class="appeal-match" alt="*"
       src="/img/conservancy-supporter-heart-3x.png"/>
 <p class="appeal-match-text"><strong>Big News:</strong> A generous anonymous donor has agreed to donate
         $2 of every $1 in supporter donations (up to $5k total)!  You can
         effectively triple your donation if you
         <a href="#donate-box" class="donate-now">just support us now!</a></p>
 </blockquote><br/><hr/>
         <a href="#donate-box" class="donate-now">just support us now!</a>
 </p>
 <br/> <hr/>
 <p>Software Freedom Conservancy is an essential organization to free and
 open source software. We are the home of over
 <a href="/members/current/">30 projects</a> like
 <a href="http://git-scm.org">Git</a>,
 <a href="http://inkscape.org">Inkscape</a>, <a href="http://samba.org">Samba</a>,
 <a href="http://winehq.org">Wine</a>, <a href="http://www.seleniumhq.org/">Selenium</a>, the <a href="/linux-compliance/">GPL Compliance Project for Linux
 Developers</a>, <a href="http://pypy.org">PyPy</a> and
 <a href="http://sugarlabs.org/">Sugar Labs</a> just to name a few. Conservancy is a "fiscal sponsor plus",
 providing everything that our projects need in a nonprofit. We help our
 projects defend their trademarks, manage their assets, handle donations,
 improve their community management, manage risk and assist them with all
 legal needs they may have. While we do receive a portion of the revenue

0 comments (0 inline, 0 general)