Change styling for badges

Don't hide the content of them, allowing everyone to know what the badge
is about.
This commit is contained in:
Mikkel Munch Mortensen 2019-02-14 12:07:21 +01:00
parent 2ae64d7672
commit 6b3e633383
Signed by untrusted user: decibyte
GPG key ID: 261C257C74AA764B
2 changed files with 22 additions and 21 deletions

View file

@ -17,23 +17,23 @@ tilfælde vil dette blive særdeklareret under listen af badges ved en tjeneste.
Et badge kan have 3 forskellige statuser:
<h3><span class="badge badge-positive badge-dummy">+</span> Positiv</h3>
<h3 class="badge badge-positive badge-dummy">Positiv</h3>
Tjenesten lever op til kravene til det badget dækker over.
<h3><span class="badge badge-partial badge-dummy">/</span> Delvis</h3>
<h3 class="badge badge-partial badge-dummy">Delvis</h3>
Tjenesten lever delvist op til det badget dækker over. Dog i en sådan grad at
vi mener det er værd at fremhæve.
<h3><span class="badge badge-negative badge-dummy">-</span> Negativ</h3>
<h3 class="badge badge-negative badge-dummy">Negativ</h3>
Tjenesten lever _ikke_ op til det badget dækker over.
## Detaljer om de forskellige badges
<h3 id="stabilitet"><span class="badge badge-stable"></span> Stabilitet</h3>
<h3 id="stabilitet" class="badge badge-stable">Stabilitet</h3>
Det første badge er som sådan ikke relateret til hvorvidt tjenesten lever op
til vores formålsparagraf. Det angiver i stedet hvorvidt tjenesten er stabil
@ -47,7 +47,7 @@ indforstået med dette forbehold for stabiliteten.
<p class="badge-credits">Grafikken er <a href="https://thenounproject.com/term/traffic-light/1925528/"><em>Traffic Light</em></a> af icon 54 fra the Noun Project.</p>
<h3 id="sikker-forbindelse"><span class="badge badge-secure-connection"></span> Sikker forbindelse</h3>
<h3 id="sikker-forbindelse" class="badge badge-secure-connection">Sikker forbindelse</h3>
Sikker forbindelse angiver at trafikken over internettet mellem dig og
tjenesten er krypteret. Du kender det som regel som en hængelås foran
@ -57,7 +57,7 @@ kan se hvad der bliver sendt frem og tilbage mellem dig og tjenesten.
<p class="badge-credits">Grafikken er <a href="https://thenounproject.com/search/?q=transfer&i=37030"><em>transfer</em></a> af Gonzalo Bravo fra the Noun Project.</p>
<h3 id="krypteret-opbevaring-af-data"><span class="badge badge-encrypted-data-storage"></span> Krypteret opbevaring af data</h3>
<h3 id="krypteret-opbevaring-af-data" class="badge badge-encrypted-data-storage">Krypteret opbevaring af data</h3>
Tjenestens data gemmes krypteret, og er dermed ikke umiddelbart læsbare for
andre end tjenesten selv og data.coops systemadministratorer. I tilfælde af at
@ -67,7 +67,7 @@ data lækkes (fx ved virtuelt eller fysisk indbrud), kræver det en særlig
<p class="badge-credits">Grafikken er <a href="https://thenounproject.com/search/?q=safe&i=821403"><em>safe</em></a> af Maxim Kulikov fra the Noun Project.</p>
<h3 id="zero-knowledge"><span class="badge badge-zero-knowledge"></span> Zero knowledge</h3>
<h3 id="zero-knowledge" class="badge badge-zero-knowledge">Zero knowledge</h3>
Data gemmes krypteret, og tjenesten er konstrueret på en måde, så selv ikke
data.coops systemadministratorer har mulighed for at tilgå og læse brugernes
@ -79,7 +79,7 @@ datatyven også har stjålet hovednøglen, da der ingen hovednøgle er.
<p class="badge-credits">Grafikken er <a href="https://thenounproject.com/search/?q=shrug&i=1221199"><em>Shrug</em></a> af Andrew Doane fra the Noun Project.</p>
<h3 id="backup"><span class="badge badge-backup"></span> Backup</h3>
<h3 id="backup" class="badge badge-backup">Backup</h3>
Der tages løbende backup af tjenestens data, for at minimere skadens omfang i
tilfælde af tekniske nedbrud.
@ -90,7 +90,7 @@ højt på vores prioritetsliste.
<p class="badge-credits">Grafikken er <a href="https://thenounproject.com/search/?q=backup&i=2120922"><em>backup</em></a> af Adrien Coquet fra the Noun Project.</p>
<h3 id="logging"><span class="badge badge-logging"></span> Logning</h3>
<h3 id="logging" class="badge badge-logging">Logning</h3>
Dette badge er lidt omvendt: Det positive badge tildeles tjenester der _ikke_
foretager logning.
@ -105,7 +105,7 @@ overfører filen.
<p class="badge-credits">Grafikken er <a href="https://thenounproject.com/search/?q=foot%20print&i=1677273"><em>Dog Paws</em></a> af iejank fra the Noun Project.</p>
<h3 id="anonym-adgang"><span class="badge badge-anonymous-access"></span> Anonym adgang</h3>
<h3 id="anonym-adgang" class="badge badge-anonymous-access">Anonym adgang</h3>
Tjenester med anonym adgang kan benyttes helt uden at man skal være registreret
ved tjenesten. De fleste tjenester kræver en form for registrering af brugerne,

View file

@ -1,4 +1,4 @@
.badge {
.badge:before {
font-family: monospace;
border: .1em solid #000;
border-radius: 1.1em;
@ -11,45 +11,46 @@
text-indent: 10em;
background: #ccc center center;
background-size: contain;
content: "";
}
.badge-positive {
.badge-positive:before {
background-color: #4c4;
}
.badge-partial {
.badge-partial:before {
background-color: #fd4;
}
.badge-negative {
.badge-negative:before {
background-color: #f44;
}
.badge-stable{
.badge-stable:before {
background-image: url(/images/badges/stable.svg);
}
.badge-secure-connection{
.badge-secure-connection:before {
background-image: url(/images/badges/secure-connection.svg);
}
.badge-encrypted-data-storage{
.badge-encrypted-data-storage:before {
background-image: url(/images/badges/encrypted-data-storage.svg);
}
.badge-zero-knowledge{
.badge-zero-knowledge:before {
background-image: url(/images/badges/zero-knowledge.svg);
}
.badge-backup{
.badge-backup:before {
background-image: url(/images/badges/backup.svg);
}
.badge-logging{
.badge-logging:before {
background-image: url(/images/badges/logging.svg);
}
.badge-anonymous-access {
.badge-anonymous-access:before {
background-image: url(/images/badges/anonymous-access.svg);
}