Tweak some styles

This commit is contained in:
Alex Cabal 2022-06-20 14:31:07 -05:00
parent 70a80d0e02
commit 7fb985e0c4
3 changed files with 29 additions and 28 deletions

View file

@ -17,6 +17,7 @@ $ebooks = $ebooks ?? [];
<? if($collection !== null && $ebook->GetCollectionPosition($collection) !== null){ ?> <? if($collection !== null && $ebook->GetCollectionPosition($collection) !== null){ ?>
<meta property="schema:position" content="<?= $ebook->GetCollectionPosition($collection) ?>"/> <meta property="schema:position" content="<?= $ebook->GetCollectionPosition($collection) ?>"/>
<? } ?> <? } ?>
<div class="thumbnail-container"><? /* We need a container in case the thumb is shorter than the description, so that the focus outline doesn't take up the whole grid space */ ?>
<a href="<?= $ebook->Url ?>" tabindex="-1" property="schema:url"<? if($collection !== null && $ebook->GetCollectionPosition($collection) !== null){ ?> data-ordinal="<?= $ebook->GetCollectionPosition($collection) ?>"<? } ?>> <a href="<?= $ebook->Url ?>" tabindex="-1" property="schema:url"<? if($collection !== null && $ebook->GetCollectionPosition($collection) !== null){ ?> data-ordinal="<?= $ebook->GetCollectionPosition($collection) ?>"<? } ?>>
<picture> <picture>
<? if($ebook->CoverImage2xAvifUrl !== null){ ?><source srcset="<?= $ebook->CoverImage2xAvifUrl ?> 2x, <?= $ebook->CoverImageAvifUrl ?> 1x" type="image/avif"/><? } ?> <? if($ebook->CoverImage2xAvifUrl !== null){ ?><source srcset="<?= $ebook->CoverImage2xAvifUrl ?> 2x, <?= $ebook->CoverImageAvifUrl ?> 1x" type="image/avif"/><? } ?>
@ -24,6 +25,7 @@ $ebooks = $ebooks ?? [];
<img src="<?= $ebook->CoverImage2xUrl ?>" alt="The cover for the Standard Ebooks edition of <?= Formatter::ToPlainText(strip_tags($ebook->TitleWithCreditsHtml)) ?>" property="schema:image" height="335" width="224"/> <img src="<?= $ebook->CoverImage2xUrl ?>" alt="The cover for the Standard Ebooks edition of <?= Formatter::ToPlainText(strip_tags($ebook->TitleWithCreditsHtml)) ?>" property="schema:image" height="335" width="224"/>
</picture> </picture>
</a> </a>
</div>
<p><a href="<?= $ebook->Url ?>" property="schema:url"><span property="schema:name"><?= Formatter::ToPlainText($ebook->Title) ?></span></a></p> <p><a href="<?= $ebook->Url ?>" property="schema:url"><span property="schema:name"><?= Formatter::ToPlainText($ebook->Title) ?></span></a></p>
<? if($view == VIEW_GRID){ ?> <? if($view == VIEW_GRID){ ?>
<? foreach($ebook->Authors as $author){ ?> <? foreach($ebook->Authors as $author){ ?>

View file

@ -1236,11 +1236,11 @@ ol.ebooks-list.list > li + li {
margin-top: 2rem; margin-top: 2rem;
} }
ol.ebooks-list.list > li > a{ ol.ebooks-list.list > li .thumbnail-container{
grid-row: 1 / span 3; grid-row: 1 / span 3;
} }
.opds ol.ebooks-list.list > li > a{ .opds ol.ebooks-list.list > li .thumbnail-container{
grid-row: 1 / span 5; grid-row: 1 / span 5;
} }
@ -1326,7 +1326,7 @@ ol.ebooks-list.list > li > p:nth-of-type(1) > a{
display: inline; display: inline;
} }
ol.ebooks-list > li > a:first-child{ ol.ebooks-list > li .thumbnail-container > a:first-child{
font-size: 0; /* for correct focus outline */ font-size: 0; /* for correct focus outline */
} }
@ -1403,20 +1403,17 @@ ul.tags{
display: flex; display: flex;
justify-content: center; justify-content: center;
flex-wrap: wrap; flex-wrap: wrap;
margin-top: .5rem; gap: 1rem;
margin-top: 1rem;
} }
.rss ul.tags{ .rss ul.tags{
justify-content: flex-start; justify-content: flex-start;
margin: 0; margin: .5rem auto;
} }
ul.tags li{ ul.tags li{
margin: .5rem; margin: 0;
}
ul.tags li:first-child{
margin: .5rem;
} }
ul.tags li a, ul.tags li a,

View file

@ -33,6 +33,7 @@ print("<?xml version=\"1.0\" encoding=\"utf-8\"?>\n")
<ol class="ebooks-list list"> <ol class="ebooks-list list">
<xsl:for-each select="/atom:feed/atom:entry[./atom:link[@rel='http://opds-spec.org/acquisition/open-access']]"> <xsl:for-each select="/atom:feed/atom:entry[./atom:link[@rel='http://opds-spec.org/acquisition/open-access']]">
<li> <li>
<div class="thumbnail-container">
<a tabindex="-1"> <a tabindex="-1">
<xsl:attribute name="href"> <xsl:attribute name="href">
<xsl:value-of select="atom:link[@rel='related']/@href"/> <xsl:value-of select="atom:link[@rel='related']/@href"/>
@ -43,6 +44,7 @@ print("<?xml version=\"1.0\" encoding=\"utf-8\"?>\n")
</xsl:attribute> </xsl:attribute>
</img> </img>
</a> </a>
</div>
<p> <p>
<a> <a>
<xsl:attribute name="href"> <xsl:attribute name="href">
@ -68,7 +70,7 @@ print("<?xml version=\"1.0\" encoding=\"utf-8\"?>\n")
<xsl:value-of select="atom:summary"/> <xsl:value-of select="atom:summary"/>
</p> </p>
</div> </div>
<p class="download">Download</p> <p class="download">Read</p>
<ul> <ul>
<xsl:for-each select="atom:link[@rel='http://opds-spec.org/acquisition/open-access']"> <xsl:for-each select="atom:link[@rel='http://opds-spec.org/acquisition/open-access']">
<li> <li>