diff options
| -rw-r--r-- | css/website.css | 6 | ||||
| -rw-r--r-- | templates/partials/navigation.html.twig | 20 |
2 files changed, 17 insertions, 9 deletions
diff --git a/css/website.css b/css/website.css index e7d1fa9..3492ed2 100644 --- a/css/website.css +++ b/css/website.css @@ -178,7 +178,11 @@ body { flex-direction: column; } -#nextback #next, #nextback, #back{ +#nextback { + padding-top: 20px; +} + +#nextback #next, #nextback #back{ max-width: 40%; overflow:hidden; } diff --git a/templates/partials/navigation.html.twig b/templates/partials/navigation.html.twig index be351e0..feb0684 100644 --- a/templates/partials/navigation.html.twig +++ b/templates/partials/navigation.html.twig @@ -1,25 +1,29 @@ + +{% if page.parent.parent.url == "/" %} <div class="links" id="nextback"> - {# {% if $prevPage = page.prevSibling %} #} - <a class="anim2" id="next" href="{{ page.parent.url }}"> + {% set prevPage = page.adjacentSibling(-1) %} + {% if prevPage %} + <a class="anim2" id="next" href="{{ prevPage.url }}"> <div class="roundedButton"> <span class="icon">arrow_back</span> <div class="stack"> <span>Previous</span> - <span>Sample last article name that is super long and will require me to clip it</span> + <span>{{ prevPage.title }}</span> </div> </div> </a> - {# {% endif %} #} + {% endif %} - {# {% if $nextPage = page.nextSibling %} #} - <a class="anim3" id="back" href="{{ page.parent.url }}"> + {% set nextPage = page.adjacentSibling(1) %} + {% if nextPage %} + <a class="anim3" id="back" href="{{ nextPage.url }}"> <div class="roundedButton"> <span class="icon">arrow_forward</span> <div class="stack"> <span>Next</span> - <span>Sample next article name</span> + <span>{{ nextPage.title }}</span> </div> </div> </a> - {# {% endif %} #} + {% endif %} </div> |