Merge pull request 'Align items of service badges' (#63) from benjaoming/website:badges-service-list into new
Reviewed-on: #63
This commit is contained in:
commit
964896b5f1
|
@ -3,12 +3,15 @@ status:
|
||||||
positive:
|
positive:
|
||||||
name: positiv
|
name: positiv
|
||||||
description: Tjenesten lever op til kravene til det badget dækker over.
|
description: Tjenesten lever op til kravene til det badget dækker over.
|
||||||
color: "#4c4"
|
css_class: "positive"
|
||||||
|
|
||||||
partial:
|
partial:
|
||||||
name: Delvis
|
name: Delvis
|
||||||
description: 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.
|
description: 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.
|
||||||
|
css_class: "partial"
|
||||||
|
|
||||||
negative:
|
negative:
|
||||||
name: negativ
|
name: negativ
|
||||||
description: Tjenesten lever ikke op til det badget dækker over.
|
description: Tjenesten lever ikke op til det badget dækker over.
|
||||||
|
css_class: "negative"
|
||||||
|
|
||||||
|
|
|
@ -205,9 +205,13 @@ aside > footer img:hover {
|
||||||
}
|
}
|
||||||
|
|
||||||
.badge-icon {
|
.badge-icon {
|
||||||
width: 30px;
|
width: 75px;
|
||||||
height: auto;
|
height: auto;
|
||||||
svg{fill:#4b3aba;}
|
svg{
|
||||||
|
fill:#4b3aba;
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.principles-list {
|
.principles-list {
|
||||||
|
@ -232,7 +236,8 @@ aside > footer img:hover {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
dl.dl-services {
|
dl.dl-services,
|
||||||
|
{
|
||||||
display : grid;
|
display : grid;
|
||||||
column-gap : 2rem;
|
column-gap : 2rem;
|
||||||
dt {
|
dt {
|
||||||
|
@ -246,6 +251,55 @@ dl.dl-services {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.badge-definitions,
|
||||||
|
.status-definitions,
|
||||||
|
{
|
||||||
|
display : grid;
|
||||||
|
column-gap : 2rem;
|
||||||
|
.badge-icon {
|
||||||
|
grid-column-start : 1;
|
||||||
|
grid-column-end : 2;
|
||||||
|
}
|
||||||
|
.badge-name {
|
||||||
|
grid-column-start : 2;
|
||||||
|
grid-column-end : 3;
|
||||||
|
font-weight : bold;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
.badge-description {
|
||||||
|
grid-column-start : 3;
|
||||||
|
grid-column-end : 4;
|
||||||
|
p {
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.badge-status {
|
||||||
|
margin-bottom: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.badge-status {
|
||||||
|
width: 75px;
|
||||||
|
height: 75px;
|
||||||
|
border-radius: 75px;
|
||||||
|
}
|
||||||
|
.badge-status-positive {
|
||||||
|
@extend .badge-status;
|
||||||
|
border: 5px solid #4c4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.badge-status-negative {
|
||||||
|
@extend .badge-status;
|
||||||
|
border: 5px solid #c44;
|
||||||
|
}
|
||||||
|
|
||||||
|
.badge-status-partial {
|
||||||
|
@extend .badge-status;
|
||||||
|
border: 5px solid #cc4;
|
||||||
|
}
|
||||||
|
|
||||||
@media(max-width:1000px) {
|
@media(max-width:1000px) {
|
||||||
:root {
|
:root {
|
||||||
--base-grid : 40px;
|
--base-grid : 40px;
|
||||||
|
|
|
@ -1,25 +1,47 @@
|
||||||
<h2>{{ i18n "badges_headline" }}</h2>
|
<h2>{{ i18n "badges_headline" }}</h2>
|
||||||
|
|
||||||
|
<section class="badge-definitions">
|
||||||
{{ range $badge_key, $badge := $.Site.Data.badges.da.badges.badges }}
|
{{ range $badge_key, $badge := $.Site.Data.badges.da.badges.badges }}
|
||||||
|
|
||||||
<h3>
|
<div class="badge-icon">
|
||||||
{{ title .name }}
|
|
||||||
<span class="badge-icon">
|
|
||||||
{{$svg := printf "static/static/img/badges/%s" .icon}}
|
{{$svg := printf "static/static/img/badges/%s" .icon}}
|
||||||
{{ $svg | readFile | safeHTML }}
|
{{ $svg | readFile | safeHTML }}
|
||||||
</span>
|
</div>
|
||||||
</h3>
|
<div class="badge-name">{{ title .name }}</div>
|
||||||
|
|
||||||
{{ markdownify .description }}
|
<div class="badge-description">
|
||||||
|
{{/* Hugo is insane some times: https://github.com/gohugoio/hugo/issues/3040 */}}
|
||||||
|
{{- $markdown := .description | markdownify -}}
|
||||||
|
|
||||||
|
{{ if not ( findRE "<[h|p][^>]*>" $markdown ) }}
|
||||||
|
<p>{{ $markdown }}</p>
|
||||||
|
{{ else }}
|
||||||
|
{{ $markdown }}
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
<h2>{{ i18n "status_headline" }}</h2>
|
<h2>{{ i18n "status_headline" }}</h2>
|
||||||
|
|
||||||
|
<section class="status-definitions">
|
||||||
{{ range $.Site.Data.badges.da.status.status }}
|
{{ range $.Site.Data.badges.da.status.status }}
|
||||||
|
|
||||||
<h3>{{ title .name }}</h3>
|
|
||||||
|
|
||||||
{{ markdownify .description }}
|
<div class="badge-icon badge-status badge-status-{{ .css_class }}"></div>
|
||||||
|
<div class="badge-name">{{ title .name }}</div>
|
||||||
|
|
||||||
|
<div class="badge-description">
|
||||||
|
{{- $markdown := .description | markdownify -}}
|
||||||
|
|
||||||
|
{{ if not ( findRE "<[h|p][^>]*>" $markdown ) }}
|
||||||
|
<p>{{ $markdown }}</p>
|
||||||
|
{{ else }}
|
||||||
|
{{ $markdown }}
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
</section>
|
||||||
|
|
Loading…
Reference in a new issue