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

fix(v2): removes hardcoded sidebar width (#1535)

Browse source 
* fix(v2): removes hardcoded sidebar width

* fix(v2): remove grid layout and keep fixed width of sidebar
This commit is contained in:
Tushar Sharma 2019-06-05 10:23:53 +05:30 • committed by Yangshun Tay
parent c66ae5a507
commit ec69460b4f
4 changed files with 39 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

2
packages/docusaurus-plugin-content-docs/src/theme/DocItem/index.js
View file

@ -36,7 +36,7 @@ function DocItem(props) {
<Head>
{metadata && metadata.title && <title>{metadata.title}</title>}
</Head>
<div className="container margin-vert--lg">
<div className={`${styles.container} container margin-bottom--lg`}>
<div className="row">
<div className="col col--8">
<header>

10
packages/docusaurus-plugin-content-docs/src/theme/DocItem/styles.module.css
View file

@ -9,6 +9,16 @@
min-height: calc(100vh - 50px);
}
.container {
padding-top: 2rem !important;
}
@media (min-width: 996px) {
.container {
padding-left: 2rem;
}
}
@media only screen and (min-width: 996px) {
.tableOfContents {
max-height: calc(100vh - (var(--ifm-navbar-height) + 2rem));

8
packages/docusaurus-plugin-content-docs/src/theme/DocPage/index.js
View file

@ -12,6 +12,8 @@ import Layout from '@theme/Layout'; // eslint-disable-line
import DocSidebar from '@theme/DocSidebar';
import './styles.css';
function DocPage(props) {
const {route, docsMetadata, location} = props;
const {permalinkToId} = docsMetadata;
@ -24,11 +26,11 @@ function DocPage(props) {
return (
<Layout noFooter description={description}>
<div className="container container--fluid">
<div className="row">
<div className="col col--3">
<div>
<div className="sidebar__container">
<DocSidebar docsMetadata={docsMetadata} sidebar={sidebar} />
</div>
<div className="col col--9">
<div className="content__container">
{renderRoutes(route.routes, {docsMetadata})}
</div>
</div>

23
packages/docusaurus-plugin-content-docs/src/theme/DocPage/styles.css Normal file
View file

@ -0,0 +1,23 @@
/**
* Copyright (c) 2017-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* width 19rem is calculated according to (sidebarWidth - sidebarPadding)
* i.e 20rem - ( 0.5rem + 0.5rem )
* Todo - 0.5rem and 20rem should be a css variable
*/
@media (min-width: 996px) {
.sidebar__container {
width: 19rem;
float: left;
min-height: calc(100vh - var(--ifm-navbar-height));
}
.content__container {
margin: 0 0 0 19rem;
}
}