fixup! refactor end of narrative styled component

nextstrain · Jan 29, 2020 · f4db3fb · f4db3fb
1 parent 78d9de5
commit f4db3fb
Showing 1 changed file with 21 additions and 13 deletions.
diff --git a/src/components/narrative/MobileNarrativeDisplay.js b/src/components/narrative/MobileNarrativeDisplay.js
@@ -2,7 +2,13 @@ import React from "react";
 import { connect } from "react-redux";
 import queryString from "query-string";
 import { changePage, EXPERIMENTAL_showMainDisplayMarkdown } from "../../actions/navigation";
-import { MobileBannerTop, MobileBannerBottom, MobileContentContainer } from "./styles";
+import {
+  linkStyles,
+  MobileBannerTop,
+  MobileBannerBottom,
+  MobileContentContainer,
+  EndOfNarrative
+} from "./styles";
 import Tree from "../tree";
 import Map from "../map/map";
 import MainDisplayMarkdown from "./MainDisplayMarkdown";
@@ -113,18 +119,20 @@ class MobileNarrativeDisplay extends React.Component {
           Previous
         </MobileBannerTop>
         <MobileContentContainer height={contentHeight+bannerHeight}>
-          <h1>End of Narrative</h1>
-          <a style={{...linkStyles, textAlign: "center"}}
-            onClick={() => this._goToPage(0)}
-          >
-            Jump to the beginning
-          </a>
-          <br />
-          <a style={{...linkStyles, textAlign: "center"}}
-            onClick={this.exitNarrativeMode}
-          >
-            Explore the data
-          </a>
+          <EndOfNarrative>
+            <h1>End of Narrative</h1>
+            <a style={{...linkStyles}}
+              onClick={() => this._goToPage(0)}
+            >
+              Jump to the beginning
+            </a>
+            <br />
+            <a style={{...linkStyles}}
+              onClick={this.exitNarrativeMode}
+            >
+              Explore the data
+            </a>
+          </EndOfNarrative>
         </MobileContentContainer>
       </>
     );