分页导航（Pagination Nav）

标准样式

<nav class="pagination-nav">
  <div class="pagination-nav__item">
    <a class="pagination-nav__link" href="#url">
      <div class="pagination-nav__sublabel">Previous</div>
      <div class="pagination-nav__label">Installation</div>
    </a>
  </div>
  <div class="pagination-nav__item pagination-nav__item--next">
    <a class="pagination-nav__link" href="#url">
      <div class="pagination-nav__sublabel">Next</div>
      <div class="pagination-nav__label">Getting Started</div>
    </a>
  </div>
</nav>

超长的标题会折到下一行。

<nav class="pagination-nav">
  <div class="pagination-nav__item">
    <a class="pagination-nav__link" href="#url">
      <div class="pagination-nav__sublabel">Previous</div>
      <div class="pagination-nav__label">
        Some Extremely Long Long Long Long Title
      </div>
    </a>
  </div>
  <div class="pagination-nav__item pagination-nav__item--next">
    <a class="pagination-nav__link" href="#url">
      <div class="pagination-nav__sublabel">Next</div>
      <div class="pagination-nav__label">
        AnotherExtremelyLongTitleWithoutBreaksProbablyAComponent
      </div>
    </a>
  </div>
</nav>

只有 Previous 链接

<nav class="pagination-nav">
  <div class="pagination-nav__item">
    <a class="pagination-nav__link" href="#url">
      <div class="pagination-nav__sublabel">Previous</div>
      <div class="pagination-nav__label">Installation</div>
    </a>
  </div>
</nav>

只有 Next 链接

<nav class="pagination-nav">
  <div class="pagination-nav__item"></div>
  <div class="pagination-nav__item pagination-nav__item--next">
    <a class="pagination-nav__link" href="#url">
      <div class="pagination-nav__sublabel">Next</div>
      <div class="pagination-nav__label">
        AnotherExtremelyLongTitleWithoutBreaksProbablyAComponent
      </div>
    </a>
  </div>
</nav>