aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--packages/website/ts/pages/documentation/doc_page.tsx43
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>
);