Commit e149e2d6 authored by Rowan Goemans's avatar Rowan Goemans
Browse files

-- Implemented language switcher as a dropdown in addition to hamburger menu....

-- Implemented language switcher as a dropdown in addition to hamburger menu. Removed JS as a dependency.
-- Fixed various small errors in the text.
-- Added animation for language and hamburger dropdown.
-- Added german as a language.
parent ae56898f
Pipeline #34038 passed with stage
in 33 seconds
......@@ -4,7 +4,7 @@ GEM
addressable (2.7.0)
public_suffix (>= 2.0.2, < 5.0)
colorator (1.1.0)
ffi (1.11.1)
ffi (1.11.3)
forwardable-extended (2.6.0)
jekyll (3.6.3)
addressable (~> 2.4)
......@@ -58,4 +58,4 @@ DEPENDENCIES
tzinfo-data
BUNDLED WITH
1.17.2
1.17.3
This diff is collapsed.
......@@ -9,9 +9,6 @@ nav:
faq_text: FAQs
links_link: "#links"
links_text: Links
flag_src: "/uploads/flags/nl.png"
flag_alt: NL
flag_link: nl
banner:
headline: Choose IRMA. <br><strong>Put a digital passport on your own mobile.</strong>
......@@ -23,33 +20,33 @@ banner:
product_shot_alt: Product Shot
usage:
id: gebruik
id: usage
login_headline: Logging in
login_alt: Login
login_content: With IRMA it is easy to log in and make yourself known, by disclosing only relevant attributes of yourself. For instance, in order to watch a certain movie online, you prove that you are older than 16, and nothing else.
sign_headline: Signing digitally
sign_alt: Signing
sign_content: With IRMA you can also sign documents digitally. You use only relevant attributes of yourselves in a digital stamp. In this way you can sign with IRMA as a medical doctor, or as citizen, or in some other role.
trust_headline: Trust
trust_alt: Trust
trust_headline: Certainty
trust_alt: Certainty
trust_content: Data in IRMA come from trusted sources and are cryptographically protected. Thus, the attributes that you disclose to make yourself known are genuine and are really about you.
slogan:
id: start
heading: With IRMA you have your data <strong>in front of you</strong>.
heading: With IRMA your data lies <strong>in your hands.</strong>
explanation:
id: explanation
getstarted_headline: Get to work yourself with IRMA
getstarted_alt: Get to work yourself with IRMA
getstarted_headline: Get started with IRMA
getstarted_alt: Get started with IRMA
getstarted_content: Everyone can freely download the IRMA app (<a href="https://play.google.com/store/apps/details?id=org.irmacard.cardemu">Android</a>
and <a href="https://itunes.apple.com/us/app/irma-authentication/id1294092994">iOS</a>) and fill it with their own data. For instance, store your email address and possibly mobile number as attribute in your IRMA app. At municipalities in The Netherlands you can log in and collect basic attributes (name, address etc) about yourself. With such attributes people can make him/herself known online.
tool_headline: IRMA is a means, not a goal in itself
tool_alt: IRMA is a means, not a goal
tool_content: Having to use many passwords is a hassle for everyone. Yet, websites need to know who they are dealing with. IRMA provides certainty. With IRMA you can do what you wish to do online, with ease and trust. For instance, watching a movie, buying, or selling.
tool_content: Having to use many passwords is a hassle for everyone. Yet, websites need to know who they are dealing with. IRMA provides certainty. With IRMA you can do what you wish to do online, with ease and certainty. For instance, watching or buying a movie.
usecases_headline: What can I do with it now?
usecases_alt: What can I do with it now?
usecases_content: Websites are now appearing where users can log in with IRMA. In The Netherlands, medical doctors log in to access patient files at the website <a href="https://www.helder.health" target="_blank">helder</a>. In local government and healthcare in particular, IRMA usage is growing. In order to get an impression of possibilities, you can try out some IRMA <a href="https://privacybydesign.foundation/demo-en/" target="_blank">demo's</a> yourself.
usecases_content: Websites are now appearing where users can log in with IRMA. In The Netherlands, medical doctors log in to access patient files at the website <a href="https://www.helder.health" target="_blank">helder</a>. In local government and healthcare in particular, IRMA usage is growing. In order to get an impression of possibilities, you can try out some IRMA <a href="https://privacybydesign.foundation/demo-en/" target="_blank">demos</a> yourself.
faq:
id: faqs
......@@ -74,22 +71,22 @@ faq:
answer: Your personal attributes are stored exclusively in the IRMA app on your phone and nowhere else. They are protected via the PIN of the IRMA app. You disclose only those attributes that are relevant and required in a particular situation (data minimalisation, as required by the General Data Protection Regulation). For instance, in order to get a certain discount, you may have to prove that you are a student; with IRMA you can do so without disclosing your name or your field of study.<br><br>Your attributes in the IRMA app are digitally signed by the source (issuer) of these attributes. A website receiving attributes can cryptographically check that they are authentic (really coming from the source). This exchange of personal attributes happens directly, between your phone and the website. No-one else can register that you make yourself known there. This is completely different from the (privacy-unfriendly) login mechanism of Facebook (and others), used for instance at an online store. In that case the data exchange happens differently<span>:</span> you first have to log in at Facebook, and then Facebook tells the store who you are. In this way Facebook can build up detailed profiles of who logs in where and when.
item6:
question: Where are my IRMA attributes stored?
answer: The attributes about yourself that you collect in the IRMA app on your phone are stored in the IRMA app only, and nowhere else. In particular, they are not stored somewhere in the cloud. When you remove attributes from your IRMA app, they are really gone. You are asked to give permission explicitly before any of these attributes in your phone are diclosed, from the app to a website.
answer: The attributes about yourself that you collect in the IRMA app on your phone are stored in the IRMA app only, and nowhere else. In particular, they are not stored somewhere in the cloud. When you remove attributes from your IRMA app, they are really gone. You are asked to give permission explicitly before any of these attributes in your phone are disclosed, from the app to a website.
item7:
question: For how long are IRMA attributes valid, and how can I refresh them?
answer: Within the IRMA app you can see on each card with attributes when they expire. The validity period depends on the stability of the attributes at hand. For instance, in The Netherlands, your name and date-of-birth attributes are valid for five years, whereas your address attribute is valid for only one year. The issuer (source) of attributes decides about expiry times. The validity of IRMA attributes may thus run out. The app warns you about this. You can always renew (refresh) them, even without warning, by reloading them from the source, just like you did the first time. For instance, after your 18th birthday you can renew your attributes from your (Dutch) municipality and then obtain an older-than-18 attribute.
item8:
question: What should I do when I buy a new phone?
answer: On a new phone you can install a new IRMA app, open a new (empyt) account, and reload your attributes from the various sources onto your new phone. Currently, there is no possibility to transfer attributes from one phone to another. This is work in progress, which involves some delicate security issues. Fortunately, it is not so difficult to load your attributes again onto your new phone. It does take a bit of time.
answer: On a new phone you can install a new IRMA app, open a new (empty) account, and reload your attributes from the various sources onto your new phone. Currently, there is no possibility to transfer attributes from one phone to another. This is work in progress, which involves some delicate security issues. Fortunately, it is not so difficult to load your attributes again onto your new phone. It does take a bit of time.
item9:
question: What should I do when I loose my phone?
answer: <span>The IRMA app on your phone is protected with a PIN, just like internet banking apps. Therefore, when you loose your phone, someone else can not abuse your IRMA app and pretend to be you (commit identity fraud). So you do not need to worry, assuming your PIN is non-trivial.<br><br>There are still better ways to protect yourself<span>:</span> upon opening your IRMA account, you had the option to register an email address. If you have done this, you can block your old IRMA account via the <a href="https://privacybydesign.foundation/myirma/" target="_blank">MyIRMA</a> environment. Then it really cannot be used anymore. If you have not registered an email address, you can still do so via <a href="https://privacybydesign.foundation/myirma/" target="_blank">MyIRMA</a>. This is recommended.
question: What should I do when I lose my phone?
answer: <span>The IRMA app on your phone is protected with a PIN, just like internet banking apps. Therefore, when you lose your phone, someone else cannot abuse your IRMA app and pretend to be you (commit identity fraud). So you do not need to worry, assuming your PIN is non-trivial.<br><br>There are still better ways to protect yourself<span>:</span> upon opening your IRMA account, you had the option to register an email address. If you have done this, you can block your old IRMA account via the <a href="https://privacybydesign.foundation/myirma/" target="_blank">MyIRMA</a> environment. Then it really cannot be used anymore. If you have not registered an email address, you can still do so via <a href="https://privacybydesign.foundation/myirma/" target="_blank">MyIRMA</a>. This is recommended.
item10:
question: I have a question about IRMA; where should I go?
answer: When you have a question about logging in with IRMA at webshop The Trendy Chicken, you can best address your question at The Trendy Chicken itself. Also when that website asks you to install the IRMA app and that fails, you can best talk to them. Often such pages contain additional info and allow you to ask questions.<br><br>If, in the end, you have a question about IRMA itself, you can send an email to the address <a href="mailto:irma@privacybydesign.foundation">irma@privacybydesign.foundation</a>. Please explain clearly what your point is, and provide your phon's model and supply screen shots if possible when something goes wrong.
answer: When you have a question about logging in with IRMA at webshop The Trendy Chicken, you can best address your question at The Trendy Chicken itself. Also when that website asks you to install the IRMA app and that fails, you can best talk to them. Often such pages contain additional info and allow you to ask questions.<br><br>If, in the end, you have a question about IRMA itself, you can send an email to the address <a href="mailto:irma@privacybydesign.foundation">irma@privacybydesign.foundation</a>. Please explain clearly what your point is, and provide your phone's model and supply screen shots if possible when something goes wrong.
item11:
question: What happens to my data when I log in with IRMA?
answer: When you log in with IRMA at a website your phone talks directly to that website. No-one is inbetween, monitoring that exchange. The IRMA organisation cannot see your attributes — because they are exclusively on your phone — and can also not see which attributes you disclose to which website.
answer: When you log in with IRMA at a website your phone talks directly to that website. No-one is in between, monitoring that exchange. The IRMA organisation cannot see your attributes — because they are exclusively on your phone — and can also not see which attributes you disclose to which website.
item12:
question: Who is behind IRMA?
answer: IRMA is produced and run by the <a href="https://privacybydesign.foundation/en" target="_blank">Privacy by Design</a> Foundation. In 2016 this foundation grew out of the Digital Security research group from Radboud University at Nijmegen, The Netherlands. It is an independent non-profit foundation. Since 2019 it has a strategic cooperation with (<a href="https://www.sidn.nl/en" target="_blank">SIDN</a>), the foundation that runs the .nl domain. This cooperation contributes to IRMA's stability and continuity.
......@@ -98,7 +95,7 @@ faq:
answer: IRMA is free for users and also free for websites that use IRMA for login<span>:</span> everyone can request attributes from the IRMA app, and will receive them after the user has given consent. But it is <em>not free</em> to issue attributes. Not everyone can put attributes in other people's phones, since that would quickly become a mess.<br><br>Issuing involves a fee and also a contract, in which the issuer commits itself to put only accurate (authentic) data in the IRMA app of the right person.<br><br>Additionally, a contract is available, both for verifiers and issuers, that gives availability guarantees (an "SLA") via SIDN. Since IRMA is a decentralised system, in which attributes are stored only on user's phones, the organisation behind IRMA has a relatively light task. Because, in addition, this organisation has no profit goals, IRMA as a whole is a cheap system.
item14:
question: IRMA is <em>open source</em>; what does that mean?
answer: The IRMA software is deliberately open source. This means that the way that IRMA works can be inspected by anyone<span>:</span> the software is available online, see <a href="https://github.com/privacybydesign" target="_blank">GitHub</a>. This also means that people outside the foundation can contribute. Indeed, several other organisations are contributing software and designs to the IRMA ecosystem. Of course, you do have to know a bit about computer programs in order to really understand IRMA's software, but the principle is important<span>:</span> IRMA has no secrets and works in a transparant manner. This contributes to trust in IRMA. There are no uneasy discussions about hidden backdoors in IRMA, like for instance in 5G telecommunications. The Privacy by Design foundation is of the opinion that all software in infrastructure with a public role should be open source.
answer: The IRMA software is deliberately open source. This means that the way that IRMA works can be inspected by anyone<span>:</span> the software is available online, see <a href="https://github.com/privacybydesign" target="_blank">GitHub</a>. This also means that people outside the foundation can contribute. Indeed, several other organisations are contributing software and designs to the IRMA ecosystem. Of course, you do have to know a bit about computer programs in order to really understand IRMA's software, but the principle is important<span>:</span> IRMA has no secrets and works in a transparent manner. This contributes to trust in IRMA. There are no uneasy discussions about hidden backdoors in IRMA, like for instance in 5G telecommunications. The Privacy by Design foundation is of the opinion that all software in infrastructure with a public role should be open source.
item15:
question: I like to know more about IRMA; where can I go?
answer: Extensive background information about how IRMA works is described by the Privacy by Design foundation at this <a href="https://privacybydesign.foundation/irma-explanation/" target="_blank">page</a>. People who wish to understand the real technicalities can check out IRMA's <a href="https://irma.app/docs" target="_blank">documentation</a> page and <a href="https://github.com/privacybydesign" target="_blank">GitHub</a> repository.<br><br>The big picture behind IRMA is described in a <a href="https://privacybydesign.foundation/pdf/IRMA-manifest-2019.pdf" target="_blank">IRMA Manifest</a> which is available only in Dutch, so far.
......@@ -113,4 +110,4 @@ footer:
doc_headline: Docs
doc_content: Developers who wish to work with IRMA can check out IRMA's technical <a href="https://irma.app/docs" target="_blank">documentation</a>.
github_headline: GitHub
github_content: People who wish to inspect IRMA's software or wish to contribte to IRMA development can go to IRMA's <a href="https://github.com/privacybydesign" target="_blank">GitHub</a> page.
\ No newline at end of file
github_content: People who wish to inspect IRMA's software or wish to contribute to IRMA development can go to IRMA's <a href="https://github.com/privacybydesign" target="_blank">GitHub</a> page.
\ No newline at end of file
......@@ -9,9 +9,6 @@ nav:
faq_text: FAQs
links_link: "#links"
links_text: Links
flag_src: "/uploads/flags/en.png"
flag_alt: EN
flag_link: en
banner:
headline: Kies IRMA. <br><strong>Zet een digitaal paspoort op je eigen mobiel.</strong>
......@@ -27,15 +24,15 @@ usage:
login_headline: Inloggen
login_alt: Login
login_content: Met IRMA kun je makkelijk inloggen en jezelf bekend maken. Je laat alleen
die kenmerken van jezelf zien die relevant zijn. Bijvoorbeeld om een bepaalde
die kenmerken van jezelf zien die nodig zijn. Om bijvoorbeeld een bepaalde
film te kijken, bewijs je dat je ouder dan 16 bent, en verder niets.
sign_headline: Ondertekenen
sign_alt: Ondertekenen
sign_content: Ook kun je met IRMA documenten digitaal ondertekenen. Je gebruikt alleen
relevante kenmerken van jezelf, in een soort digitaal stempel. Zo kun je met
IRMA ondertekenen als arts, als burger of vanuit een andere rol.
trust_headline: Vertrouwen
trust_alt: Vertrouwen
trust_headline: Zeker weten
trust_alt: Zeker weten
trust_content: Gegevens in een IRMA app komen uit betrouwbare bronnen en zijn cryptografisch
beschermd. De kenmerken die jij met IRMA bekend maakt zijn daarmee echt, en
echt van jou.
......@@ -50,9 +47,9 @@ explanation:
getstarted_alt: Zelf aan de slag met IRMA
getstarted_content: Iedereen kan de IRMA app gratis downloaden (<a href="https://play.google.com/store/apps/details?id=org.irmacard.cardemu">Android</a>
en <a href="https://itunes.apple.com/us/app/irma-authentication/id1294092994">iOS</a>)
en vullen met eigen gegevens. Bijvoorbeeld bij de gemeente kun je inlogggen
en basisgegevens (naam, adres, etc.) over jezelf ophalen. Maar ook kun je jouw
emailadres of 06-nummer in je IRMA app opslaan. Met zulke gegevens kan iedereen
en vullen met je eigen gegevens. Bijvoorbeeld bij de gemeente kun je inlogggen
en je basisgegevens (naam, adres, etc.) over jezelf ophalen. Maar ook kun je jouw
e-mailadres of 06-nummer in je IRMA app opslaan. Met zulke gegevens kan iedereen
zichzelf online bekend maken.
tool_headline: IRMA is een middel, geen doel op zich
tool_alt: IRMA is een middel, geen doel op zich
......@@ -60,12 +57,11 @@ explanation:
moeten websites weten met wie ze te maken hebben. IRMA geeft zekerheid. Met
IRMA kun je op een makkelijke en veilige manier online doen wat je wil doen.
Bijvoorbeeld een film kijken of iets (ver)kopen.
usecases_headline: Wat kan ik er al mee?
usecases_alt: Wat kan ik er al mee?
usecases_content: Er komen steeds meer websites waar je met IRMA in kan loggen. Artsen,
bijvoorbeeld, kunnen via IRMA bij medische dossiers op de website <a href="https://www.helder.health"
target="_blank">helder</a>. Vooral bij gemeenten en in de zorg wordt aan verder
gebruik van IRMA gewerkt. Om een indruk te krijgen van de mogelijkheden kun
usecases_headline: Wat kan ik nu met IRMA?
usecases_alt: Wat kan ik nu met IRMA?
usecases_content: Er komen steeds meer websites waarop je met IRMA in kan loggen. Artsen kunnen bijvoorbeeld met IRMA bij medische dossiers op de website <a href="https://www.helder.health"
target="_blank">helder</a>. Vooral bij gemeenten en in de zorg wordt nu aan verder
gebruik van IRMA gewerkt zodat je daar met IRMA kunt inloggen. Om een indruk te krijgen van de mogelijkheden kun
je zelf een aantal IRMA <a href="https://privacybydesign.foundation/demo/" target="_blank">demo's</a>
uitproberen.
......@@ -90,12 +86,12 @@ faq:
OK hebt gedrukt ga je terug naar de website en ben je ingelogd. Als het goed
is gaat je telefoon automatisch terug, maar soms moet je dat met de hand doen.</li></ul><br>Het
kan zijn dat de website vraagt om kenmerken die je nog niet in je IRMA app geladen
hebt. Dan moet je dat eerst nog even doen voordat je in kunt loggen.
hebt. Dan moet je die eerst voordat je in kunt loggen.
item2:
question: Welke kenmerken kan ik nu (en later) in de IRMA app zetten?
answer: Vanuit gemeenten kun je zelf kenmerken zoals je naam, adres, geboortedatum,
BSN in je IRMA app zetten, maar ook of je bijvoorbeeld ouder dan 18 of 65 bent.
Daarnaast kun je een of meer email adressen en mobiele telefoonnummers, na controle, toevoegen.
Daarnaast kun je een of meer e-mail adressen en mobiele telefoonnummers, na controle, toevoegen.
Studenten en medewerkers in het (hoger) onderwijs kunnen ook hun registratie
toevoegen. Medewerkers in de zorg kunnen zogenaamde AGB registraties
toevoegen. Ook vanuit sociale media (LinkedIn, Twitter, Facebook) kun je gegevens
......@@ -144,23 +140,22 @@ faq:
Bijvoorbeeld, na je 18e verjaardag kun je opnieuw je gegevens bij je gemeente
ophalen en heb je als nieuw kenmerk dat je ouder dan 18 bent.
item7:
question: Wat doe ik als ik een nieuwe telefoon koop?
question: Ik heb een nieuwe mobiele telefoon en nu?
answer: Op een nieuwe telefoon kun je de IRMA app opnieuw installeren, een nieuw
account openen, en je kenmerken opnieuw ophalen. Er is op dit moment geen mogelijkheid
om je kenmerken van je oude telefoon over te zetten naar je nieuwe telefoon.
Daarbij komen subtiele beveiligseisen kijken, maar daar wordt aan gewerkt. Gelukkig is het niet heel moeilijk om je gegevens
opnieuw op te halen. Het kost wel een klein beetje tijd.
item8:
question: Wat doe ik als ik mijn telefoon verlies?
answer: <span>De IRMA app op je telefoon is beschermd met een PIN, net als je
app voor internetbankieren. Wanneer je je telefoon verliest kan een ander dus
geen gebruik maken van je IRMA app en zich als jou voordoen (en identiteitsfraude plegen). Als je dus een
question: Ik ben mijn telefoon kwijt en nu?
answer: <span>De IRMA app op je telefoon is beschermd met een persoonlijk PIN-code, net als je
app voor internetbankieren. Zo kan niemand jouw gegevens gebruiken. Als je dus een
goede PIN gekozen hebt, hoef je je geen zorgen te maken. <br><br> Je kunt jezelf
echter nog beter beschermen<span>:</span> bij het openen van een IRMA account heb je de
optie gekregen om een email adres toe te voegen. Als je dat gedaan hebt, kun
optie gekregen om een e-mail adres toe te voegen. Als je dat gedaan hebt, kun
je via de <a href="https://privacybydesign.foundation/mijnirma/" target="_blank">MijnIRMA</a>
omgeving je oude IRMA account blokkeren. Dan kan er echt helemaal niks meer met de
IRMA app op je oude, verloren telefoon gebeuren. Als je nog geen email adres
IRMA app op je oude, verloren telefoon gebeuren. Als je nog geen e-mail adres
toegevoegd hebt in MijnIRMA kun je dat alsnog doen, door <a href="https://privacybydesign.foundation/mijnirma/" target="_blank">daar</a>
met IRMA zelf in te loggen. Het is verstandig dat te doen.
item9:
......@@ -177,8 +172,8 @@ faq:
answer: Als je inlogt bij een website maakt je telefoon rechtstreeks contact met
de website. Nadat jij toestemming gegeven hebt worden de gevraagde kenmerken
vanuit jouw telefoon direct aan de website getoond. Daar zit niemand tussen.
De IRMA organistie kan jouw kenmerken niet zien omdat ze alleen op jouw telefoon
staan en kan ook niet zien welke attributen je aan welke website vrijgeeft.
De organisatie achter IRMA kan jouw kenmerken niet zien, omdat ze alleen op jouw telefoon
staan, en kan ook niet zien welke attributen je aan welke website vrijgeeft.
item11:
question: Kan ik IRMA ook buiten Nederland gebruiken?
answer: Jazeker, IRMA is internationaal beschikbaar. Voor mensen buiten Nederland zijn echter nog niet zoveel attributen beschikbaar
......@@ -191,10 +186,10 @@ faq:
answer: IRMA wordt gemaakt door de stichting <a href="https://privacybydesign.foundation/" target="_blank">Privacy
by Design</a>. Deze stichting is in 2016 voortgekomen uit de <em>Digital Security</em>
onderzoeksgroep van de Radboud Universiteit in Nijmegen. De stichting is onafhankelijk
en heeft geen doelstelling om winst te maken. Sinds 2019 heeft de stichting
Privacy by Design een strategische samenwerking met de stichting Internet Domeinregistratie
en maakt geen winst. Sinds 2019 werkt de stichting
Privacy by Design samen met de stichting Internet Domeinregistratie
Nederland (<a href="https://www.sidn.nl/" target="_blank">SIDN</a>). Mede door deze samenwerking wordt de stabiliteit
en continuiteit van IRMA gegarandeerd.
en continuïteit van IRMA gegarandeerd.
item13:
question: Hoezo kan IRMA gratis zijn?
answer: IRMA is gratis voor gebruikers. IRMA is ook gratis voor websites die
......@@ -207,10 +202,10 @@ faq:
persoon te zetten. <br><br>Ook kan een contract afgesloten worden voor support garanties (een "SLA") via SIDN, zowel door uitgevers als ontvangers (controleurs) van attributen. Omdat IRMA een decentraal systeem is, waarbij gegevens alleen
op telefoons staan en rechtstreeks met websites uitgewisseld worden, heeft de
organisatie achter IRMA relatief weinig te doen. Omdat die organisatie bovendien
geen winstoogmerk heeft is IRMA als geheel een goedkoop systeem.
geen winst maakt is IRMA een goedkoop systeem.
item14:
question: IRMA is <em>open source</em>; wat betekent dat?
answer: De software van IRMA is open source. Dat betekent dat de manier waarop IRMA werkt door iedereen bekeken kan worden <span>:</span> de software staat gewoon online, namelijk op <a href="https://github.com/privacybydesign" target="_blank">GitHub</a>. Dit betekent dat mensen van buiten de stichting ook kunnen bijdragen, wat daadwerkelijk gebeurt<span>:</span> verschillende andere organisaties dragen bij met software en designs aan het IRMA ecosysteem. Natuurlijk moet je wel wat van computerprogramma's weten om de software echt te kunnen begrijpen, maar het principe is belangrijk<span>:</span> IRMA kent geen geheimen en werkt op een transparante manier. Dit draagt bij aan het vertrouwen in IRMA. Er zijn daarom met IRMA geen discussies over verborgen achterdoortjes van
answer: De software van IRMA is open source. Dat betekent dat de manier waarop IRMA werkt door iedereen bekeken kan worden <span>:</span> de software staat gewoon online, namelijk op <a href="https://github.com/privacybydesign" target="_blank">GitHub</a>. Dit betekent dat mensen van buiten de stichting ook kunnen bijdragen, wat daadwerkelijk gebeurt<span>:</span> verschillende andere organisaties dragen bij met software en designs aan het IRMA ecosysteem. Natuurlijk moet je wel wat van computerprogramma's weten om de software echt te kunnen begrijpen, maar het principe is belangrijk<span>:</span> IRMA kent geen geheimen en werkt op een open manier. Dit draagt bij aan het vertrouwen in IRMA. Er zijn daarom met IRMA geen discussies over verborgen achterdoortjes van
leveranciers met een eigen agenda, zoals bijvoorbeeld met 5G telecommunicatie. De stichting Privacy by Design achter IRMA vindt dat
alle software die gebruikt wordt in infrastructuur met een publieke rol open source moet zijn.
item15:
......@@ -233,7 +228,7 @@ footer:
haar eigen <a href="https://privacybydesign.foundation/irma-uitleg/" target="_blank">website</a>.
doc_headline: Docs
doc_content: Ontwikkelaars die met IRMA willen werken kunnen terecht op de technische
<a href="https://irma.app/docs" target="_blank">documentatie</a>.
<a href="https://irma.app/docs" target="_blank">documentatie</a> pagina.
github_headline: GitHub
github_content: Mensen die de software van IRMA willen bekijken of willen bijdragen aan IRMA kunnen
terecht op <a href="https://github.com/privacybydesign" target="_blank">GitHub</a>.
\ No newline at end of file
<div class="topnav" id="myTopnav">
<div class="block-header-1--logo">
<a id="logo" href="{{ section.url | prepend: site.baseurl_root }}">
<img src="{{ section.logo | prepend: site.baseurl_root }}" alt="{{ site.title }}">
</a>
</div>
<div id="menu">
{% for nav_item in section.navigation %}
<a class="refs" href="{% t nav_item.link %}">{% t nav_item.link_text %}</a>
{% endfor %}
<!-- <a style="float: right; padding-right: 20px; margin-top: 5px;" class="langicons" href="{% t section.image.link %}"><img src="{{site.baseurl_root}}{% t section.image.image %}" alt="{% t section.image.alt_text %}"></a></li> -->
<a {% if site.lang == lang %} id="selected-lang" {% endif %} style="float: right; padding-right: 20px; margin-top: 5px;" class="langicons refs" href="{{ site.baseurl_root }}{{ page.url}}?lang={% t section.image.link %}"><img src="{{site.baseurl_root}}{% t section.image.image %}" alt="{% t section.image.alt_text %}"></a>
<a id="toggle" href="javascript:void(0);" class="icon" onclick="myFunction()">
<img id="hamburger" src="{{ section.menu | prepend: site.baseurl_root }}" alt="Menu">
</a>
</div>
</div>
<header class="header">
<a id="logo" href="{{ section.url | prepend: site.baseurl_root }}">
<img src="{{ section.logo | prepend: site.baseurl_root }}" alt="{{ site.title }}">
</a>
<input class="lang-btn" type="checkbox" id="lang-btn" />
<label class="lang-icon" for="lang-btn">
<span class="selected-lang refs">
<img src="{{site.baseurl_root}}/uploads/flags/{{ site.lang }}.png" alt="{{ site.lang }}">
</span>
</label>
<input class="menu-btn" type="checkbox" id="menu-btn" />
<label class="menu-icon" for="menu-btn"><span class="navicon"></span></label>
<script>
function myFunction() {
var x = document.getElementById("myTopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
x.className = "topnav";
}
}
</script>
\ No newline at end of file
<ul class="menu">
{% for nav_item in section.navigation %}
<li><a class="refs" href="{% t nav_item.link %}">{% t nav_item.link_text %}</a></li>
{% endfor %}
</ul>
<ul class="langmenu">
{% assign uniq_langs = site.languages | where_exp:"l", "l != site.lang" | uniq %}
{% for lang in uniq_langs %}
<li class="lang">
<a class="lang-icon refs" href="{{ site.baseurl_root }}{{ page.url}}?lang={{ lang }}">
<img src="{{site.baseurl_root}}/uploads/flags/{{ lang }}.png" alt="{{ lang }}">
</a>
</li>
{% endfor %}
</ul>
</header>
\ No newline at end of file
......@@ -13,12 +13,6 @@
list-style-type: none;
}
.langicons img {
max-height: 2rem;
}
/* Scrolling to elements*/
html {
......@@ -32,102 +26,205 @@ html {
}
}
/* header */
/* Changing header */
.block-header-1--logo img {
max-height: 4.0rem;
}
/* Responsive navigation from: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_topnav */
.topnav {
overflow: hidden;
.header {
background-color: #fff;
border-bottom: 1px solid #000;
-webkit-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.6);
box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.6);
background-color: #fff;
box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1);
width: 100%;
height: 6rem;
z-index: 3;
position: sticky;
top: 0;
z-index: 999999;
}
.topnav a {
float: left;
.header li {
border-right: 1px solid #f4f4f4;
}
.header a {
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
.menu-icon {
border-right: 1px solid #f4f4f4;
}
#logo {
height: 100%;
display: block;
float: left;
}
.topnav .icon {
display: none;
.header img {
max-height: 100%;
max-width: 100%;
width: auto;
}
.header ul {
margin: 0;
padding: 0;
list-style: none;
overflow: hidden;
background-color: #fff;
}
.header .menu li {
padding-top: 16px;
padding-bottom: 16px;
}
#menu {
margin-top: 4px;
/* todo */
.header .menu li:hover,
.header .menu-btn:hover,
.header .menu-icon:hover,
.header .lang-icon:hover {
background-color: #f4f4f4;
}
.header .lang-icon:hover
#hamburger {
max-height: 22px;
/* todo */
.header .logo {
display: block;
float: left;
font-size: 2em;
padding: 10px 20px;
text-decoration: none;
}
/* menu */
@media screen and (min-width: 600px) {
#menu {
float: right;
display: flex;
min-height: 90px;
align-items: center;
}
.header .menu {
clear: both;
max-height: 0;
transition: max-height .2s ease-out;
}
/* langmenu */
@media screen and (max-width: 600px) {
.topnav {
position: static;
}
.header .langmenu {
clear: both;
max-height: 0;
transition: max-height .2s ease-out;
}
.topnav .refs {
display: none;
}
.topnav a.icon {
float: right;
display: block;
margin-top: 22px;
/* todo */
}
/* menu icon */
.header .menu-icon {
cursor: pointer;
float: right;
padding-right: 20px;
padding-left: 20px;
height: 100%;
position: relative;
user-select: none;
}
@media screen and (max-width: 600px) {
.topnav.responsive {
position: relative;
}
.header .menu-icon .navicon {
background: #333;
display: block;
height: 2px;
position: relative;
width: 22px;
top: 50%;
transform: translateY(-50%);
}
.topnav.responsive .icon {
position: absolute;
right: 0;
top: 0;
}
.header .menu-icon .navicon:before,
.header .menu-icon .navicon:after {
background: #333;
content: '';
display: block;
height: 100%;
position: absolute;
width: 100%;
}
.topnav.responsive a {
float: none;
display: block;
text-align: left;
}
.header .menu-icon .navicon:before {
top: 7px;
}
#menu a:not(#toggle):hover {
background-color: #ddd;
}
.header .menu-icon .navicon:after {
top: -7px;
}
/* lang icon */
.header .lang-icon {
cursor: pointer;
float: right;
padding-right: 20px;
padding-left: 20px;
height: 100%;
position: relative;
user-select: none;
}
.header .lang {
float: right;
}
.header .selected-lang img {
position: relative;
top: 50%;
transform: translateY(-50%);
}
.header .lang-icon img {
max-height: 2rem;
}
/* menu btn */
.header .menu-btn {
display: none;
}
.header .menu-btn:checked ~ .menu {
max-height: 500px;
}
/* lang btn */
.header .lang-btn {
display: none;
}
.header .lang-btn:checked ~ .langmenu {
max-height: 240px;
}
@media (min-width: 700px) {
.header li {
float: left;
}
.header li a {
padding: 10px 20px;
}
.header .menu {
clear: none;
height: 100%;
float: right;
max-height: none;
}
.header .menu li {
height: 100%;
}
.header .menu li a {
position: relative;
top: 50%;
transform: translateY(-50%);
display: inline-block
}
.header .menu-icon {
display: none;
}
}
/* Scroll adjustment to make up for sticky header */
.destination {
......@@ -341,9 +438,8 @@ column.text p {
}
.block-hero-2 {
padding: 3rem 4rem;
padding: 5rem 4rem;
}
}
......
......@@ -10,10 +10,6 @@ page_sections:
- template: navigation-header
block: irma-header
logo: "/uploads/non-free/irma_logo@1x.png"
image:
image: nav.flag_src
alt_text: nav.flag_alt
link: nav.flag_link
menu: "/uploads/non-free/navigation-menu.png"
url: "/"
navigation:
......
uploads/flags/de.png

20 KB | W: | H:

uploads/flags/de.png

5.83 KB | W: | H:

uploads/flags/de.png
uploads/flags/de.png
uploads/flags/de.png
uploads/flags/de.png
  • 2-up
  • Swipe
  • Onion skin
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment