3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-05-10 07:37:19 +02:00
Code Issues Projects Releases Packages Wiki Activity

feat(v2): use new pagination nav CSS (#1520)

Browse source
This commit is contained in:
Yangshun Tay 2019-05-26 20:19:16 -07:00 • committed by GitHub
parent c75cec76ec
commit b8965dcf38
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 40 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

20
packages/docusaurus-plugin-content-blog/src/theme/BlogListPaginator/index.js
View file

@ -13,22 +13,26 @@ function BlogListPaginator(props) {
const {previousPage, nextPage} = metadata;
return (
<div className="row">
<div className="col col--6">
<nav className="pagination-nav">
<div className="pagination-nav__item">
{previousPage && (
<Link className="button button--secondary" to={previousPage}>
Newer entries
<Link className="pagination-nav__link" to={previousPage}>
<h4 className="pagination-nav__link--label">
&laquo; Newer Entries
</h4>
</Link>
)}
</div>
<div className="col col--6 text--right">
<div className="pagination-nav__item pagination-nav__item-next">
{nextPage && (
<Link className="button button--secondary" to={nextPage}>
Older entries
<Link className="pagination-nav__link" to={nextPage}>
<h4 className="pagination-nav__link--label">
Older Entries &raquo;
</h4>
</Link>
)}
</div>
</div>
</nav>
);
}

22
packages/docusaurus-plugin-content-blog/src/theme/BlogPostPaginator/index.js
View file

@ -12,22 +12,28 @@ function BlogPostPaginator(props) {
const {nextItem, prevItem} = props;
return (
<div className="row">
<div className="col col--6">
<nav className="pagination-nav">
<div className="pagination-nav__item">
{prevItem && (
<Link className="button button--secondary" to={prevItem.permalink}>
{prevItem.title}
<Link className="pagination-nav__link" to={prevItem.permalink}>
<h5 className="pagination-nav__link--sublabel">Previous Post</h5>
<h4 className="pagination-nav__link--label">
&laquo; {prevItem.title}
</h4>
</Link>
)}
</div>
<div className="col col--6 text--right">
<div className="pagination-nav__item pagination-nav__item--next">
{nextItem && (
<Link className="button button--secondary" to={nextItem.permalink}>
{nextItem.title}
<Link className="pagination-nav__link" to={nextItem.permalink}>
<h5 className="pagination-nav__link--sublabel">Next Post</h5>
<h4 className="pagination-nav__link--label">
{nextItem.title} &raquo;
</h4>
</Link>
)}
</div>
</div>
</nav>
);
}

25
packages/docusaurus-plugin-content-docs/src/theme/DocPaginator/index.js
View file

@ -15,29 +15,32 @@ function DocPaginator(props) {
} = props;
return (
<div className="row">
<div className="col col--6">
<nav className="pagination-nav">
<div className="pagination-nav__item">
{metadata.previous && docs[metadata.previous] && (
<Link
className="button button--secondary"
className="pagination-nav__link"
to={docs[metadata.previous].permalink}>
<i className="fas fa-arrow-left" />
&nbsp;&nbsp;
{metadata.previous_title}
<h5 className="pagination-nav__link--sublabel">Previous</h5>
<h4 className="pagination-nav__link--label">
&laquo; {metadata.previous_title}
</h4>
</Link>
)}
</div>
<div className="col col--6 text--right">
<div className="pagination-nav__item pagination-nav__item--next">
{metadata.next && docs[metadata.next] && (
<Link
className="button button--secondary"
className="pagination-nav__link"
to={docs[metadata.next].permalink}>
{metadata.next_title}&nbsp;&nbsp;
<i className="fas fa-arrow-right" />
<h5 className="pagination-nav__link--sublabel">Next</h5>
<h4 className="pagination-nav__link--label">
{metadata.next_title} &raquo;
</h4>
</Link>
)}
</div>
</div>
</nav>
);
}