diff options
-rw-r--r-- | packages/website/ts/pages/documentation/doc_page.tsx | 43 |
1 files changed, 17 insertions, 26 deletions
diff --git a/packages/website/ts/pages/documentation/doc_page.tsx b/packages/website/ts/pages/documentation/doc_page.tsx index f13866ee8..58b6f076d 100644 --- a/packages/website/ts/pages/documentation/doc_page.tsx +++ b/packages/website/ts/pages/documentation/doc_page.tsx @@ -76,7 +76,9 @@ export class DocPage extends React.Component<DocPageProps, DocPageState> { const sectionNameToLinks = _.isUndefined(this.state.docAgnosticFormat) ? {} : this.props.docsInfo.getSectionNameToLinks(this.state.docAgnosticFormat); - const mainContent = ( + const mainContent = _.isUndefined(this.state.docAgnosticFormat) ? ( + <div className="flex justify-center">{this._renderLoading()}</div> + ) : ( <DocReference selectedVersion={this.props.docsVersion} availableVersions={this.props.availableDocVersions} @@ -86,35 +88,24 @@ export class DocPage extends React.Component<DocPageProps, DocPageState> { /> ); return ( - <div> - {_.isUndefined(this.state.docAgnosticFormat) ? ( - this._renderLoading() - ) : ( - <DevelopersPage - mainContent={mainContent} - sectionNameToLinks={sectionNameToLinks} - location={this.props.location} - screenWidth={this.props.screenWidth} - translate={this.props.translate} - dispatcher={this.props.dispatcher} - /> - )} - </div> + <DevelopersPage + mainContent={mainContent} + sectionNameToLinks={sectionNameToLinks} + location={this.props.location} + screenWidth={this.props.screenWidth} + translate={this.props.translate} + dispatcher={this.props.dispatcher} + /> ); } private _renderLoading(): React.ReactNode { return ( - <div className="col col-12"> - <div - className="relative sm-px2 sm-pt2 sm-m1" - style={{ height: 122, top: '50%', transform: 'translateY(-50%)' }} - > - <div className="center pb2"> - <CircularProgress size={40} thickness={5} /> - </div> - <div className="center pt2" style={{ paddingBottom: 11 }}> - Loading documentation... - </div> + <div className="pt4"> + <div className="center pb2"> + <CircularProgress size={40} thickness={5} /> + </div> + <div className="center pt2" style={{ paddingBottom: 11 }}> + Loading documentation... </div> </div> ); |