mirror of
https://github.com/facebook/docusaurus.git
synced 2025-07-25 12:38:57 +02:00
feat(v2): add logo and title in doc sidebar (#2161)
* feat(v2): add logo and title in doc sidebar * fix: hide sidebar logo on small screens
This commit is contained in:
parent
8c693fbac9
commit
ca30adc19d
3 changed files with 31 additions and 2 deletions
|
@ -7,7 +7,8 @@
|
|||
|
||||
import React, {useState, useCallback} from 'react';
|
||||
import classnames from 'classnames';
|
||||
|
||||
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
|
||||
import useBaseUrl from '@docusaurus/useBaseUrl';
|
||||
import Link from '@docusaurus/Link';
|
||||
|
||||
import styles from './styles.module.css';
|
||||
|
@ -104,6 +105,10 @@ function mutateSidebarCollapsingState(item, location) {
|
|||
|
||||
function DocSidebar(props) {
|
||||
const [showResponsiveSidebar, setShowResponsiveSidebar] = useState(false);
|
||||
const {
|
||||
siteConfig: {themeConfig: {navbar: {title, logo = {}} = {}}} = {},
|
||||
} = useDocusaurusContext();
|
||||
const logoUrl = useBaseUrl(logo.src);
|
||||
|
||||
const {
|
||||
docsSidebars,
|
||||
|
@ -132,6 +137,10 @@ function DocSidebar(props) {
|
|||
|
||||
return (
|
||||
<div className={styles.sidebar}>
|
||||
<div className={styles.sidebarLogo}>
|
||||
{logo != null && <img src={logoUrl} alt={logo.alt} />}
|
||||
{title != null && <strong>{title}</strong>}
|
||||
</div>
|
||||
<div
|
||||
className={classnames('menu', 'menu--responsive', {
|
||||
'menu--show': showResponsiveSidebar,
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue