Replace <div> with <hgroup> in ebook pages

This commit is contained in:
Alex Cabal 2020-08-09 16:22:46 -05:00
parent ea7c91b94b
commit fa5af7ae84
2 changed files with 11 additions and 10 deletions

View file

@ -658,7 +658,7 @@ article.ebook > header{
box-sizing: border-box;
}
article.ebook > header > div{
article.ebook > header > hgroup{
color: #fff;
position: relative;
z-index: 1;
@ -673,16 +673,17 @@ article.ebook > header > div{
margin: 2rem; /* for responsive */
}
article.ebook > header > div > p{
article.ebook > header > hgroup > h2{
font-size: 1.4rem;
font-family: 'League Spartan', sans-serif;
line-height: 1;
margin-top: 1rem;
margin-left: 0;
}
article.ebook > header > div a,
article.ebook > header > div a:link,
article.ebook > header > div a:visited{
article.ebook > header > hgroup a,
article.ebook > header > hgroup a:link,
article.ebook > header > hgroup a:visited{
color: inherit;
text-decoration: none;
}
@ -1521,7 +1522,7 @@ main.ebooks nav ol li.highlighted:nth-last-child(2)::after{
margin: 0;
}
article.ebook > header > div{
article.ebook > header > hgroup{
margin: 1rem;
padding: 1rem;
max-width: 85%;
@ -1531,7 +1532,7 @@ main.ebooks nav ol li.highlighted:nth-last-child(2)::after{
font-size: 1.5rem;
}
article.ebook > header > div > p{
article.ebook > header > hgroup > h2{
font-size: 1.2rem;
}

View file

@ -72,12 +72,12 @@ catch(\Exception $ex){
<main>
<article class="ebook">
<header>
<div>
<hgroup>
<h1><?= Formatter::ToPlainText($ebook->Title) ?></h1>
<? foreach($ebook->Authors as $author){ ?>
<p><a href="<?= Formatter::ToPlainText($ebook->AuthorsUrl) ?>"><?= Formatter::ToPlainText($author->Name) ?></a></p>
<h2><a href="<?= Formatter::ToPlainText($ebook->AuthorsUrl) ?>"><?= Formatter::ToPlainText($author->Name) ?></a></h2>
<? } ?>
</div>
</hgroup>
<picture>
<? if($ebook->HeroImage2xAvifUrl !== null){ ?><source srcset="<?= $ebook->HeroImage2xAvifUrl ?> 2x, <?= $ebook->HeroImageAvifUrl ?> 1x" type="image/avif"><? } ?>
<source srcset="<?= $ebook->HeroImage2xUrl ?> 2x, <?= $ebook->HeroImageUrl ?> 1x" type="image/jpg">