Compare commits

..

No commits in common. "5149a3e2eaaea2ba01c6b52e5e50dc8bd409c954" and "66ca4dca1efc167c4ac42d3ff92be1b1a7dd1846" have entirely different histories.

3 changed files with 95 additions and 20 deletions

View File

@ -5,7 +5,11 @@
<title>Amandine “Cryptie”</title>
</head>
<sidebar promo="support"/>
<sidebar promo="none">
<div style="margin: 3em 0 1em 0;">
<a class="big-donate" href="https://my.fsfe.org/support">Become a supporter</a>
</div>
</sidebar>
<body class="bio interview">
@ -16,21 +20,39 @@
<p>This page is part of a series of interviews with FSFE supporters and friends to help give a face to our community.
Get an overview about our interviews on the <a href="../testimonials.html">testimonials</a> page</p>
<blockquote>
<div class="with-image-right">
<img class="img-circle" src="/picturebase/people/2018-cryptie-300px.jpg" alt="Cryptie"/>
<div class="interview-quote-container">
<blockquote>
<p>
"I am Cryptie, I am living in Paris, France. I used to be a cryptographer
and now I am a privacy specialist. I consciously use Free Software for 15 years now. I discovered the FSFE
randomly, I found the FSFE website and just loved this idea of counter-lobbying. I am a supporter of the FSFE
for already 6 years now."
<em>
"I am Cryptie, I am living in Paris, France. I used to be a cryptographer
and now I am a privacy specialist. I consciously use Free Software for 15 years now. I discovered the FSFE
randomly, I found the FSFE website and just loved this idea of counter-lobbying. I am a supporter of the FSFE
for already 6 years now."
</em>
</p>
</div>
</blockquote>
</blockquote>
<div class="interview-portrait"
style="background-image: url('/picturebase/people/2018-cryptie-300px.jpg')"
title="Amandine “Cryptie“"></div>
</div>
<h2 id="video-30s-cryptie">
"The FSFE and me in 30 seconds"
</h2>
<div class="row text-center">
<div class="col-6 col-sm-6 col-md-4 col-lg-3 col-xl-3 mb-3">
<a href="#video-30s-cryptie"><img src="/graphics/video32.png"
alt="Watch The FSFE and me in 30 seconds with Cryptie"/></a>
</div>
<div class="col-6 col-sm-6 col-md-4 col-lg-3 col-xl-3 mb-3">
<a href="#interview"><img src="/graphics/mic32.png" alt="Read our short-interview with Cryptie"/></a>
</div>
</div>
<div class="interview-fsfe-divider">
<img src="/about/graphics/stars.png"/>
</div>
<h2 id="video-30s-cryptie">"The FSFE and me in 30 seconds"</h2>
<figure>
<video class="interview-video" crossorigin="crossorigin"
@ -59,9 +81,11 @@
</figure>
<h2 id="interview" class="clear">
Short Interview with Cryptie (2019)
</h2>
<div class="interview-fsfe-divider">
<img src="/about/graphics/stars.png"/>
</div>
<h2 id="interview" class="clear">Short Interview with Cryptie (2019)</h2>
<p class="question">FSFE: Beyond supporting the FSFE, you also engage as a volunteer. What are you doing for FSFE?</p>
@ -121,6 +145,10 @@
<p class="answer">I hope that more and more people will understand the importance of being ethical in their digital life
and thus consciously use Free Software and that we will have more and more volunteers from all over Europe.</p>
<div class="interview-fsfe-divider">
<img src="/about/graphics/stars.png"/>
</div>
<figure>
<img
src="/picturebase/people/201808-community-meeting-rmll-800px.jpg"

2
look/fsfe.min.css vendored

File diff suppressed because one or more lines are too long

View File

@ -3,14 +3,42 @@
padding-right: 0;
}
h2 {
margin-top: 8rem;
.interview-quote-container {
display: flex;
flex-direction: column;
margin-bottom: 3rem;
margin-top: 3rem;
blockquote {
flex: 1;
margin: 0;
order: 2;
}
.interview-portrait {
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
flex: 0 0 200px;
order: 1;
}
}
.interview-fsfe-divider {
margin-bottom: 3rem;
margin-top: 3rem;
text-align: center;
img {
transform: rotate(90deg);
height: 8rem;
}
}
.question {
font-size: 110%;
font-weight: bold;
margin-bottom: .5em;
margin-bottom: 1em;
margin-top: 2em;
}
@ -36,6 +64,25 @@
padding-right: 15px;
}
.interview-quote-container {
align-items: stretch;
flex-direction: row;
blockquote {
margin-left: -3em;
order: 1;
}
.interview-portrait {
flex: 0 0 200px;
order: 2;
img {
border-radius: 0;
}
}
}
#sidebar {
display: block;
}