First cut at navigation button style
This commit is contained in:
@@ -730,6 +730,34 @@ fieldset > table td input[type="radio"] {
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
nav.episodes {
|
||||
color: var(--background-primary);
|
||||
}
|
||||
nav.episodes span {
|
||||
color: var(--text-primary);
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
border: inset thin var(--text-primary);
|
||||
}
|
||||
nav.episodes span:nth-child(-n+2) {
|
||||
border-top-left-radius: 2rem;
|
||||
border-bottom-left-radius: 2rem;
|
||||
}
|
||||
nav.episodes span:nth-child(n+3) {
|
||||
border-top-right-radius: 2rem;
|
||||
border-bottom-right-radius: 2rem;
|
||||
}
|
||||
nav.episodes span.no-link,
|
||||
nav.episodes span a {
|
||||
padding: 0.5rem;
|
||||
display: inline-block;
|
||||
min-width: 5.5rem;
|
||||
}
|
||||
nav.episodes object {
|
||||
margin: 0 0.2rem;
|
||||
heigth: 0.85rem;
|
||||
vertical-align: middle;
|
||||
}
|
||||
@media (min-width: 600px) {
|
||||
body > header .bounding-box {
|
||||
justify-content: space-between;
|
||||
|
||||
@@ -117,16 +117,16 @@
|
||||
<!--% IF folder %-->
|
||||
<!--% folder = folder %--><!--% ELSE %--><!--% folder = "hpr" %-->
|
||||
<!--% END %-->
|
||||
<small><a href="<!--% absolute_path(baseurl) %-->eps/<!--% folder %--><!--% zero_pad_left(links.earliest) %-->/index.html" rel="first"><< First</a>,
|
||||
<nav class="episodes"><span><a href="<!--% absolute_path(baseurl) %-->eps/<!--% folder %--><!--% zero_pad_left(links.earliest) %-->/index.html" rel="first"><object href="/images/icons/arrow-first-plain.svg"><<</object>First</a></span>,
|
||||
<!--% IF links.previous %-->
|
||||
<a href="<!--% absolute_path(baseurl) %-->eps/<!--% folder %--><!--% zero_pad_left(links.previous) %-->/index.html" rel="previous">< Previous</a>,
|
||||
<span><a href="<!--% absolute_path(baseurl) %-->eps/<!--% folder %--><!--% zero_pad_left(links.previous) %-->/index.html" rel="previous"><object href="/images/icons/arrow-previous-plain.svg"><</object>Previous</a></span>,
|
||||
<!--% ELSE %-->
|
||||
<span><</span> Previous,
|
||||
<span class="no-link"><object href="/images/icons/arrow-previous-plain.svg"><</object>Previous</span>,
|
||||
<!--% END %-->
|
||||
<!--% IF links.next %-->
|
||||
<a href="<!--% absolute_path(baseurl) %-->eps/<!--% folder %--><!--% zero_pad_left(links.next) %-->/index.html" rel="next">Next ></a>,
|
||||
<span><a href="<!--% absolute_path(baseurl) %-->eps/<!--% folder %--><!--% zero_pad_left(links.next) %-->/index.html" rel="next">Next<object href="/images/icons/arrow-next-plain.svg">></object></a></span>,
|
||||
<!--% ELSE %-->
|
||||
Next <span>></span>
|
||||
<span class="no-link">Next<object href="/images/icons/arrow-next-plain.svg">></object></span>,
|
||||
<!--% END %-->
|
||||
<a href="<!--% absolute_path(baseurl) %-->eps/<!--% folder %--><!--% zero_pad_left(links.latest) %-->/index.html" rel="last">Latest >></a></small>
|
||||
<span><a href="<!--% absolute_path(baseurl) %-->eps/<!--% folder %--><!--% zero_pad_left(links.latest) %-->/index.html" rel="last">Latest<object href="/images/icons/arrow-last-plain.svg">>></object></a></span></nav>
|
||||
<!--% END %-->
|
||||
|
||||
Reference in New Issue
Block a user