---
export let prevUrl: string;
export let nextUrl: string;
---

<style lang="scss">
.nav {
  display: flex;
  margin-right: auto;
  margin-left: auto;
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.prev,
.next {
  display: block;
  text-transform: uppercase;
  font-size: 0.8em;

  &[href="#"] {
    display: none;
  }
}

.prev {
  margin-right: auto;
}

.next {
  margin-left: auto;
}
</style>

<div class="wrapper">
  <nav class="nav">
    <a class="prev" href={prevUrl || '#'}>Prev</a>
    <a class="next" href={nextUrl || '#'}>Next</a>
  </nav>
</div>