fix text layout for the image description stuff

This commit is contained in:
Rhiannon Morris 2021-03-08 00:13:22 +01:00
parent d40fe2a617
commit e046171999
2 changed files with 13 additions and 7 deletions

View file

@ -178,10 +178,7 @@ makeDesc (TextDesc desc) = [b|@0
|] |]
makeDesc (LongDesc fs) = [b|@0 makeDesc (LongDesc fs) = [b|@0
<section id=desc class=info-section> <section id=desc class=info-section>
<h2>about</h2> $2.fields
<div>
$4.fields
</div>
</section> </section>
|] |]
where where

View file

@ -110,13 +110,22 @@
margin: auto; margin: auto;
} }
.info-section { #info {
display: grid; display: grid;
grid-template-columns: 10% auto; grid-template-columns: min-content auto;
grid-gap: 2em; column-gap: 1em;
align-items: baseline; align-items: baseline;
} }
/* 'display: contents' removes things from the accessibility tree
* which is probably only a problem for screen readers?
*/
@media not speech {
.info-section {
display: contents;
}
}
#info figure { #info figure {
width: min-content; width: min-content;
margin: 0.25em auto; margin: 0.25em auto;