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);
|
clip: rect(0, 0, 0, 0);
|
||||||
border: 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) {
|
@media (min-width: 600px) {
|
||||||
body > header .bounding-box {
|
body > header .bounding-box {
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
|||||||
@@ -117,16 +117,16 @@
|
|||||||
<!--% IF folder %-->
|
<!--% IF folder %-->
|
||||||
<!--% folder = folder %--><!--% ELSE %--><!--% folder = "hpr" %-->
|
<!--% folder = folder %--><!--% ELSE %--><!--% folder = "hpr" %-->
|
||||||
<!--% END %-->
|
<!--% 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 %-->
|
<!--% 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 %-->
|
<!--% ELSE %-->
|
||||||
<span><</span> Previous,
|
<span class="no-link"><object href="/images/icons/arrow-previous-plain.svg"><</object>Previous</span>,
|
||||||
<!--% END %-->
|
<!--% END %-->
|
||||||
<!--% IF links.next %-->
|
<!--% 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 %-->
|
<!--% ELSE %-->
|
||||||
Next <span>></span>
|
<span class="no-link">Next<object href="/images/icons/arrow-next-plain.svg">></object></span>,
|
||||||
<!--% END %-->
|
<!--% 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 %-->
|
<!--% END %-->
|
||||||
|
|||||||
Reference in New Issue
Block a user