Turn subscribe and become-supporter banners into modules
continuous-integration/drone/push Build is passing Details

Fixes #1337
This commit is contained in:
Reinhard Müller 2020-05-25 22:22:22 +02:00
parent bb8715201e
commit 821ebf2a72
17 changed files with 255 additions and 150 deletions

34
build/xslt/fsfe-cd.xsl Normal file
View File

@ -0,0 +1,34 @@
<?xml version="1.0" encoding="UTF-8"?>
<!-- ====================================================================== -->
<!-- Helper stylesheets to include referrer for fsfe-cd -->
<!-- ====================================================================== -->
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<!-- Hidden input field with referrer for https://my.fsfe.org/subscribe -->
<xsl:template match="fsfe-cd-referrer-input">
<xsl:element name="input">
<xsl:attribute name="type">hidden</xsl:attribute>
<xsl:attribute name="name">referrer</xsl:attribute>
<xsl:attribute name="value">
<xsl:text>https://fsfe.org</xsl:text>
<xsl:value-of select="/buildinfo/@filename"/>
<xsl:text>.html</xsl:text>
</xsl:attribute>
</xsl:element>
</xsl:template>
<!-- Button with referrer for https://my.fsfe.org/donate -->
<xsl:template match="fsfe-cd-donate-link">
<xsl:element name="a">
<xsl:attribute name="href">
<xsl:text>https://my.fsfe.org/donate?referrer=https://fsfe.org</xsl:text>
<xsl:value-of select="/buildinfo/@filename"/>
<xsl:text>.html</xsl:text>
</xsl:attribute>
<xsl:apply-templates select="@*|node()"/>
</xsl:element>
</xsl:template>
</xsl:stylesheet>

View File

@ -15,6 +15,7 @@
<xsl:include href="build/xslt/fsfe_body.xsl" />
<xsl:include href="build/xslt/gettext.xsl" />
<xsl:include href="build/xslt/static-elements.xsl" />
<xsl:include href="build/xslt/fsfe-cd.xsl" />
<xsl:include href="build/xslt/module.xsl" />
<xsl:include href="build/xslt/related.xsl" />

View File

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<data>
<version>1</version>
<module>
<div class="banner-become-supporter">
<p>
Ihr finanzieller Beitrag ist wichtig für eine freie
Informationsgesellschaft.
</p>
<fsfe-cd-donate-link class="btn btn-default">Jetzt Unterstützer werden</fsfe-cd-donate-link>
</div>
</module>
</data>

View File

@ -0,0 +1,14 @@
<?xml version="1.0" encoding="UTF-8"?>
<data>
<version>1</version>
<module>
<div class="banner-become-supporter">
<p>
Freedom in the information society needs your financial contribution.
</p>
<fsfe-cd-donate-link class="btn btn-default">Become a supporter now</fsfe-cd-donate-link>
</div>
</module>
</data>

View File

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<data>
<version>1</version>
<module>
<div class="banner-become-supporter">
<p>
La libertà nella società dell'informazione ha bisogno del tuo
contributo finanziario.
</p>
<fsfe-cd-donate-link class="btn btn-default">Diventa ora un sostenitore</fsfe-cd-donate-link>
</div>
</module>
</data>

View File

@ -0,0 +1,16 @@
<?xml version="1.0" encoding="UTF-8"?>
<data>
<version>1</version>
<module>
<div class="banner-become-supporter">
<p>
Uw financiële bijdrage is belangrijk voor de vrijheid in de
informatiesamenleving.
</p>
<fsfe-cd-donate-link class="btn btn-default">Word nu een supporter</fsfe-cd-donate-link>
</div>
</module>
</data>

View File

@ -0,0 +1,28 @@
<?xml version="1.0" encoding="UTF-8"?>
<data>
<version>1</version>
<module>
<div class="banner-subscribe">
<p>
Über unseren E-Mail-Verteiler informieren unsere Experten zu aktuellen
Neuigkeiten, Veranstaltungen, Aktivitäten und wie Sie dazu beitragen
können.
</p>
<form class="form-inline" method="post" action="https://my.fsfe.org/subscribe">
<input type="hidden" name="language" value="de"/>
<div class="form-group">
<input type="text" class="form-control" name="name" placeholder="Ihr name" required="yes"/>
</div>
<div class="form-group">
<input type="email" class="form-control" name="email1" placeholder="Ihre E-Mail-Adresse" required="yes"/>
</div>
<fsfe-cd-referrer-input/>
<input type="hidden" name="wants_info" value="yes"/>
<button class="btn btn-default" type="submit">Auf dem Laufenden bleiben</button>
</form>
</div>
</module>
</data>

View File

@ -0,0 +1,27 @@
<?xml version="1.0" encoding="UTF-8"?>
<data>
<version>1</version>
<module>
<div class="banner-subscribe">
<p>
Subscribe to our email updates. Our experts inform you about current
news, events, activities, and how you can contribute.
</p>
<form class="form-inline" method="post" action="https://my.fsfe.org/subscribe">
<input type="hidden" name="language" value="en"/>
<div class="form-group">
<input type="text" class="form-control" name="name" placeholder="Your name" required="yes"/>
</div>
<div class="form-group">
<input type="email" class="form-control" name="email1" placeholder="Your email address" required="yes"/>
</div>
<fsfe-cd-referrer-input/>
<input type="hidden" name="wants_info" value="yes"/>
<button class="btn btn-default" type="submit">Stay informed</button>
</form>
</div>
</module>
</data>

View File

@ -0,0 +1,28 @@
<?xml version="1.0" encoding="UTF-8"?>
<data>
<version>1</version>
<module>
<div class="banner-subscribe">
<p>
Iscriviti ai nostri aggiornamenti per email. I nostri esperti ti
informeranno sulle notizie più recenti, gli eventi, le attività e su
come partecipare.
</p>
<form class="form-inline" method="post" action="https://my.fsfe.org/subscribe">
<input type="hidden" name="language" value="it"/>
<div class="form-group">
<input type="text" class="form-control" name="name" placeholder="Il tuo nome" required="yes"/>
</div>
<div class="form-group">
<input type="email" class="form-control" name="email1" placeholder="Il tuo indirizzo email" required="yes"/>
</div>
<fsfe-cd-referrer-input/>
<input type="hidden" name="wants_info" value="yes"/>
<button class="btn btn-default" type="submit">Voglio rimanere informato/a</button>
</form>
</div>
</module>
</data>

View File

@ -0,0 +1,28 @@
<?xml version="1.0" encoding="UTF-8"?>
<data>
<version>1</version>
<module>
<div class="banner-subscribe">
<p>
Abonneer u op onze nieuwsbrief en laat onze experts u informeren over
het laatste nieuws, activiteiten en hoe u kunt bijdragen.
</p>
<form class="form-inline" method="post" action="https://my.fsfe.org/subscribe">
<input type="hidden" name="language" value="nl"/>
<div class="form-group">
<input type="text" class="form-control" name="name" placeholder="Uw naam" required="yes"/>
</div>
<div class="form-group">
<input type="email" class="form-control" name="email1" placeholder="Uw e-mailadres" required="yes"/>
</div>
<fsfe-cd-referrer-input/>
<input type="hidden" name="wants_info" value="yes"/>
<button class="btn btn-default" type="submit">Blijf op de hoogte</button>
</form>
</div>
</module>
</data>

View File

@ -44,27 +44,7 @@
<dynamic-content-news/>
</div>
<div class="subscribe">
<p>
Über unseren E-Mail-Verteiler informieren unsere Experten zu aktuellen
Neuigkeiten, Veranstaltungen, Aktivitäten und wie Sie dazu beitragen
können.
</p>
<form class="form-inline" method="post" action="https://my.fsfe.org/subscribe">
<input type="hidden" name="language" value="en"/>
<div class="form-group">
<input type="text" class="form-control" name="name" placeholder="Ihr name" required="yes"/>
</div>
<div class="form-group">
<input type="email" class="form-control" name="email1" placeholder="Ihre E-Mail-Adresse" required="yes"/>
</div>
<input type="hidden" name="referrer" value="https://fsfe.org/index.html"/>
<input type="hidden" name="wants_info" value="yes"/>
<input type="hidden" name="return_to" value="https://fsfe.org/index.html"/>
<button class="btn btn-default" type="submit">Auf dem Laufenden bleiben</button>
</form>
</div>
<module id="banner-subscribe"/>
<h2>
Unsere Gemeinschaft
@ -75,15 +55,7 @@
<dynamic-content-testimonials/>
</div>
<h2 class="hidden">Spenden</h2>
<div class="become-supporter">
<p>
Ihr finanzieller Beitrag ist wichtig für eine freie
Informationsgesellschaft.
</p>
<a class="btn btn-default" href="https://my.fsfe.org/donate">Jetzt Unterstützer werden</a>
</div>
<module id="banner-become-supporter"/>
<h2>Ihre nächsten Schritte</h2>

View File

@ -43,26 +43,7 @@
<dynamic-content-news/>
</div>
<div class="subscribe">
<p>
Subscribe to our email updates. Our experts inform you about current
news, events, activities, and how you can contribute.
</p>
<form class="form-inline" method="post" action="https://my.fsfe.org/subscribe">
<input type="hidden" name="language" value="en"/>
<div class="form-group">
<input type="text" class="form-control" name="name" placeholder="Your name" required="yes"/>
</div>
<div class="form-group">
<input type="email" class="form-control" name="email1" placeholder="Your email address" required="yes"/>
</div>
<input type="hidden" name="referrer" value="https://fsfe.org/index.html"/>
<input type="hidden" name="wants_info" value="yes"/>
<input type="hidden" name="return_to" value="https://fsfe.org/index.html"/>
<button class="btn btn-default" type="submit">Stay informed</button>
</form>
</div>
<module id="banner-subscribe"/>
<h2>
Our Community
@ -73,14 +54,7 @@
<dynamic-content-testimonials/>
</div>
<h2 class="hidden">Donate</h2>
<div class="become-supporter">
<p>
Freedom in the information society needs your financial contribution.
</p>
<a class="btn btn-default" href="https://my.fsfe.org/donate">Become a supporter now</a>
</div>
<module id="banner-become-supporter"/>
<h2>Your Next Steps</h2>

View File

@ -43,26 +43,7 @@
<dynamic-content-news/>
</div>
<div class="subscribe">
<p>
Iscriviti ai nostri aggiornamenti per email. I nostri esperti ti informeranno
sulle notizie più recenti, gli eventi, le attività e su come partecipare.
</p>
<form class="form-inline" method="post" action="https://my.fsfe.org/subscribe">
<input type="hidden" name="language" value="it"/>
<div class="form-group">
<input type="text" class="form-control" name="name" placeholder="Il tuo nome" required="yes"/>
</div>
<div class="form-group">
<input type="email" class="form-control" name="email1" placeholder="Il tuo indirizzo email" required="yes"/>
</div>
<input type="hidden" name="referrer" value="https://fsfe.org/index.html"/>
<input type="hidden" name="wants_info" value="yes"/>
<input type="hidden" name="return_to" value="https://fsfe.org/index.html"/>
<button class="btn btn-default" type="submit">Voglio rimanere informato/a</button>
</form>
</div>
<module id="banner-subscribe"/>
<h2>
La nostra comunità
@ -73,14 +54,7 @@
<dynamic-content-testimonials/>
</div>
<h2 class="hidden">Donate</h2>
<div class="become-supporter">
<p>
La libertà nella società dell'informazione ha bisogno del tuo contributo finanziario.
</p>
<a class="btn btn-default" href="https://my.fsfe.org/donate">Diventa ora un sostenitore</a>
</div>
<module id="banner-become-supporter"/>
<h2>Passi successivi</h2>

View File

@ -37,25 +37,7 @@
<dynamic-content-news/>
</div>
<div class="subscribe">
<p>
Abonneer u op onze nieuwsbrief en laat onze experts u informeren over het laatste nieuws, activiteiten en hoe u kunt bijdragen.
</p>
<form class="form-inline" method="post" action="https://my.fsfe.org/subscribe">
<input type="hidden" name="language" value="nl"/>
<div class="form-group">
<input type="text" class="form-control" name="name" placeholder="Uw naam" required="yes"/>
</div>
<div class="form-group">
<input type="email" class="form-control" name="email1" placeholder="Uw e-mailadres" required="yes"/>
</div>
<input type="hidden" name="referrer" value="https://fsfe.org/index.html"/>
<input type="hidden" name="wants_info" value="yes"/>
<input type="hidden" name="return_to" value="https://fsfe.org/index.html"/>
<button class="btn btn-default" type="submit">Blijf op de hoogte</button>
</form>
</div>
<module id="banner-subscribe"/>
<h2>
Onze Gemeenschap
@ -66,14 +48,7 @@
<dynamic-content-testimonials/>
</div>
<h2 class="hidden">Doneer</h2>
<div class="become-supporter">
<p>
Uw financiële bijdrage is belangrijk voor de vrijheid in de informatiesamenleving.
</p>
<a class="btn btn-default" href="https://my.fsfe.org/donate">Word nu een supporter</a>
</div>
<module id="banner-become-supporter"/>
<h2>Uw volgende stappen</h2>

View File

@ -0,0 +1,40 @@
// ============================================================================
// Styles for advertising banners
// ============================================================================
// ----------------------------------------------------------------------------
// General settings for banners
// ----------------------------------------------------------------------------
.banner() {
font-weight: 500;
text-align: center;
padding: 15px;
margin-top: 30px;
margin-bottom: 30px;
p {
.hyphens(manual);
}
}
// ----------------------------------------------------------------------------
// Banner asking to subscribe to news updates
// ----------------------------------------------------------------------------
.banner-subscribe {
.banner();
color: white;
background-color: @brand-primary;
}
// ----------------------------------------------------------------------------
// Banner asking to become a supporter
// ----------------------------------------------------------------------------
.banner-become-supporter {
.banner();
color: white;
font-size: 125%;
background-color: @brand-mix;
}

View File

@ -1,5 +1,6 @@
@import "style";
@import "elements/figure";
@import "elements/banners";
@import "elements/podcast";
@import "elements/sharebuttons";
@import "elements/people";

View File

@ -73,22 +73,6 @@ body.frontpage #main {
}
}
// ------------------------------------------------------------------------
// Wide block (used 2 times)
// ------------------------------------------------------------------------
.wide-block {
font-weight: 500;
.text-center;
padding: 15px;
margin-top: 30px;
margin-bottom: 30px;
p {
.hyphens(manual);
}
}
// ------------------------------------------------------------------------
// News section
// ------------------------------------------------------------------------
@ -144,16 +128,6 @@ body.frontpage #main {
}
}
// ------------------------------------------------------------------------
// Block asking to subscribe to news updates
// ------------------------------------------------------------------------
.subscribe {
.wide-block;
color: white;
background-color: @brand-primary;
}
// ------------------------------------------------------------------------
// Testimonials section
// ------------------------------------------------------------------------
@ -206,17 +180,6 @@ body.frontpage #main {
}
}
// ------------------------------------------------------------------------
// Block asking to become a supporter
// ------------------------------------------------------------------------
.become-supporter {
.wide-block;
color: white;
font-size: 125%;
background-color: @brand-mix;
}
// ------------------------------------------------------------------------
// Next steps section
// ------------------------------------------------------------------------