WIP: Align items of service badges

This commit is contained in:
Benjamin Bach 2023-03-06 09:43:17 +01:00
parent 3c04c24be2
commit 6a940401dd
Signed by untrusted user: benjaoming
GPG key ID: 7D49441634585664
2 changed files with 52 additions and 8 deletions

View file

@ -205,9 +205,13 @@ aside > footer img:hover {
}
.badge-icon {
width: 30px;
width: 75px;
height: auto;
svg{fill:#4b3aba;}
svg{
fill:#4b3aba;
width: 100%;
height: auto;
}
}
.principles-list {
@ -232,7 +236,8 @@ aside > footer img:hover {
}
}
dl.dl-services {
dl.dl-services,
{
display : grid;
column-gap : 2rem;
dt {
@ -246,6 +251,29 @@ dl.dl-services {
}
}
dl.badge-definitions,
dl.status-definitions,
{
display : grid;
column-gap : 2rem;
dt {
grid-column-start : 1;
grid-column-end : 2;
font-weight : bold;
.badge-icon {
display: inline-block;
vertical-align: middle;
margin-right: 10px;
}
.badge-name {
}
}
dd {
grid-column-start : 2;
grid-column-end : 3;
}
}
@media(max-width:1000px) {
:root {
--base-grid : 40px;

View file

@ -1,25 +1,41 @@
<h2>{{ i18n "badges_headline" }}</h2>
<dl class="badge-definitions">
{{ range $badge_key, $badge := $.Site.Data.badges.da.badges.badges }}
<h3>
{{ title .name }}
<dt>
<span class="badge-icon">
{{$svg := printf "static/static/img/badges/%s" .icon}}
{{ $svg | readFile | safeHTML }}
</span>
</h3>
<span class="badge-name">{{ title .name }}</span>
</dt>
{{ markdownify .description }}
<dd>
{{/* 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 }}
<dd>
{{ end }}
</dl>
<h2>{{ i18n "status_headline" }}</h2>
<dl class="status-definitions">
{{ range $.Site.Data.badges.da.status.status }}
<h3>{{ title .name }}</h3>
<dt>{{ title .name }}</dt>
<dd>
{{ markdownify .description }}
</dd>
{{ end }}
</dl>