docusaurus/packages/docusaurus-theme-bootstrap/src/theme/Footer/index.js
Fanny 2bc54a80fc
feat(v2): bootstrap layout footer (#2635)
* feat(v2): add minor adjustements and footer component

* fix(v2): margin and spacing of footer

* fix(v2): spacings

* fix(v2): remove unrelated links of the bootstrap template

* fix(v2): remove unrelated links of the bootstrap template
2020-04-21 19:54:12 +08:00

75 lines
2 KiB
JavaScript

/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
import React from 'react';
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
import Link from '@docusaurus/Link';
import useBaseUrl from '@docusaurus/useBaseUrl';
function FooterLink({to, href, label, ...props}) {
const toUrl = useBaseUrl(to);
return (
<Link
{...(href
? {
target: '_blank',
rel: 'noopener noreferrer',
href,
}
: {
to: toUrl,
})}
{...props}>
{label}
</Link>
);
}
function Footer() {
const context = useDocusaurusContext();
const {siteConfig = {}} = context;
const {themeConfig = {}} = siteConfig;
const {footer} = themeConfig;
const {links} = footer || {};
return (
<footer className="container p-0 m-0">
<div className="row bg-light no-gutters justify-content-center">
{links && links.length > 0 && (
<>
{links.map((linkItem, i) => (
<div className="col col-xs-1 col-xl-1 mx-4 my-4" key={i}>
{linkItem.title != null && <h5>{linkItem.title}</h5>}
<ul className="list-unstyled">
{linkItem.items.map((item, key) =>
item.html ? (
<li
key={key}
className="mb-2"
dangerouslySetInnerHTML={{
__html: item.html,
}}
/>
) : (
<li className="mb-1" key={item.href || item.to}>
<FooterLink {...item} />
</li>
),
)}
</ul>
</div>
))}
</>
)}
</div>
</footer>
);
}
export default Footer;