mirror of
https://github.com/facebook/docusaurus.git
synced 2025-05-17 11:07:07 +02:00
fix: wrong padding for single row mobile nav (#1191)
This commit is contained in:
parent
d5fd15ecbe
commit
4ce7ae2c98
2 changed files with 26 additions and 1 deletions
|
@ -7,12 +7,14 @@
|
|||
|
||||
const React = require('react');
|
||||
const fs = require('fs');
|
||||
const classNames = require('classnames');
|
||||
|
||||
const HeaderNav = require('./nav/HeaderNav.js');
|
||||
const Head = require('./Head.js');
|
||||
|
||||
const Footer = require(`${process.cwd()}/core/Footer.js`);
|
||||
const translation = require('../server/translation.js');
|
||||
const env = require('../server/env.js');
|
||||
const liveReloadServer = require('../server/liveReloadServer.js');
|
||||
const {idx} = require('./utils.js');
|
||||
|
||||
|
@ -20,6 +22,15 @@ const CWD = process.cwd();
|
|||
|
||||
// Component used to provide same head, header, footer, other scripts to all pages
|
||||
class Site extends React.Component {
|
||||
mobileNavHasOneRow(headerLinks) {
|
||||
const hasLanguageDropdown =
|
||||
env.translation.enabled && env.translation.enabledLanguages().length > 1;
|
||||
const hasOrdinaryHeaderLinks = headerLinks.some(
|
||||
link => !(link.languages || link.search),
|
||||
);
|
||||
return !(hasLanguageDropdown || hasOrdinaryHeaderLinks);
|
||||
}
|
||||
|
||||
render() {
|
||||
const tagline =
|
||||
idx(translation, [this.props.language, 'localized-strings', 'tagline']) ||
|
||||
|
@ -43,6 +54,12 @@ class Site extends React.Component {
|
|||
docsVersion = latestVersion;
|
||||
}
|
||||
|
||||
const navPusherClasses = classNames('navPusher', {
|
||||
singleRowMobileNav: this.mobileNavHasOneRow(
|
||||
this.props.config.headerLinks,
|
||||
),
|
||||
});
|
||||
|
||||
return (
|
||||
<html lang={this.props.language}>
|
||||
<Head
|
||||
|
@ -62,7 +79,7 @@ class Site extends React.Component {
|
|||
version={this.props.version}
|
||||
current={this.props.metadata}
|
||||
/>
|
||||
<div className="navPusher">
|
||||
<div className={navPusherClasses}>
|
||||
{this.props.children}
|
||||
<Footer config={this.props.config} language={this.props.language} />
|
||||
</div>
|
||||
|
|
|
@ -1317,6 +1317,10 @@ input::placeholder {
|
|||
z-index: 99;
|
||||
}
|
||||
|
||||
.singleRowMobileNav.navPusher {
|
||||
padding-top: 50px;
|
||||
}
|
||||
|
||||
.navPusher:after {
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
content: '';
|
||||
|
@ -2006,6 +2010,10 @@ input::placeholder {
|
|||
z-index: 10;
|
||||
}
|
||||
|
||||
.tocActive .singleRowMobileNav .onPageNav {
|
||||
top: 98px;
|
||||
}
|
||||
|
||||
.tocActive .navToggle,
|
||||
.tocActive .navBreadcrumb h2 {
|
||||
visibility: hidden;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue