time-convertor

commit a5b8e22e2fd9985c03c599a6623add3351e6fe67
parent 62bfee1b1b01ed51f5c4eec2f762a3821f9c8b10
Author: Agastya Chandrakant <me@hanabi.in>
Date:   Mon, 18 May 2020 13:09:36 +0530

DRY

Diffstat:
M
src/App.js
 | 
25
+++++++++++++++++++------
M
src/subpages/fromTo.js
 | 
14
+-------------
M
src/subpages/future.js
 | 
14
+-------------
M
src/subpages/help.js
 | 
75
++++++++++++++++++++++++++++++++++++++++++++++++---------------------------
M
src/subpages/main.js
 | 
13
+------------

5 files changed, 70 insertions(+), 71 deletions(-)
diff --git a/src/App.js b/src/App.js
@@ -1,20 +1,33 @@
 import React from 'react';
 import { Route, BrowserRouter as Router, Switch } from 'react-router-dom';
 
+import Footer from './comp/footer';
 import FromTo from './subpages/fromTo';
 import Future from './subpages/future';
+import Header from './comp/header';
 import Help from './subpages/help';
 import Main from './subpages/main';
 
 function App() {
   return (
     <Router>
-      <Switch>
-        <Route component={Help} path="/help" />
-        <Route component={FromTo} path="/from-to" />
-        <Route component={Future} path="/future" />
-        <Route component={Main} path="/" />
-      </Switch>
+      <div
+        className="container-fluid"
+        style={{
+          maxWidth: '100vw',
+          overflow: 'hidden',
+          padding: 0,
+        }}
+      >
+        <Header />
+        <Switch>
+          <Route component={Help} path="/help" />
+          <Route component={FromTo} path="/from-to" />
+          <Route component={Future} path="/future" />
+          <Route component={Main} path="/" />
+        </Switch>
+        <Footer />
+      </div>
     </Router>
   );
 }
diff --git a/src/subpages/fromTo.js b/src/subpages/fromTo.js
@@ -2,20 +2,8 @@ import React from 'react';
 
 import FromToTime from '../comp/fromToTime';
 
-import Footer from '../comp/footer';
-import Header from '../comp/header';
-
 function FromTo() {
-  return (
-    <div
-      className="container-fluid"
-      style={{ maxWidth: '100vw', overflow: 'hidden', padding: 0 }}
-    >
-      <Header />
-      <FromToTime />
-      <Footer />
-    </div>
-  );
+  return <FromToTime />;
 }
 
 export default FromTo;
diff --git a/src/subpages/future.js b/src/subpages/future.js
@@ -1,19 +1,7 @@
 import React from 'react';
 
-import Footer from '../comp/footer';
-import Header from '../comp/header';
-
 function Future() {
-  return (
-    <div
-      className="container-fluid"
-      style={{ maxWidth: '100vw', overflow: 'hidden', padding: 0 }}
-    >
-      <Header />
-      Future
-      <Footer />
-    </div>
-  );
+  return 'Future';
 }
 
 export default Future;
diff --git a/src/subpages/help.js b/src/subpages/help.js
@@ -2,37 +2,58 @@ import React from 'react';
 import { Link } from 'react-router-dom';
 import moment from 'moment-timezone';
 
-import Footer from '../comp/footer';
-import Header from '../comp/header';
-
 function Help() {
   const tz = moment.tz.guess();
   const tzAbbr = moment.tz.zone(tz).abbr(moment());
   return (
-    <div
-      className="container-fluid"
-      style={{ maxWidth: '100vw', overflow: 'hidden', padding: 0 }}
-    >
-      <Header />
-      <ol>
-        <li>
-          Use the <Link to="/">homepage</Link> to convert your{' '}
-          <span className="font-weight-bold">current time</span> ({tzAbbr}) to
-          other timezone.
-        </li>
-        <li>
-          Use the <Link to="/future">/future</Link> to convert a{' '}
-          <span className="font-weight-bold">future date</span> between
-          different timezones.
-        </li>
-        <li>
-          Use the <Link to="/from-to">/from-to</Link> to convert
-          <span className="font-weight-bold">current time</span> between
-          different timezones.
-        </li>
-      </ol>
-      <Footer />
-    </div>
+    <ol>
+      <li>
+        Use the{' '}
+        <Link
+          to="/"
+          style={{
+            background: 'lavender',
+            borderRadius: '5px',
+            padding: '2px 5px',
+          }}
+        >
+          homepage
+        </Link>{' '}
+        to convert your <span className="font-weight-bold">current time</span> (
+        {tzAbbr}) to other timezone.
+      </li>
+      <li>
+        Use the{' '}
+        <Link
+          to="/future"
+          style={{
+            background: 'lavender',
+            borderRadius: '5px',
+            padding: '2px 5px',
+          }}
+        >
+          /future
+        </Link>{' '}
+        to convert a <span className="font-weight-bold">future date</span>{' '}
+        between different timezones.
+      </li>
+      <li>
+        Use the{' '}
+        <Link
+          to="/from-to"
+          style={{
+            background: 'lavender',
+            borderRadius: '5px',
+            padding: '2px 5px',
+          }}
+        >
+          /from-to
+        </Link>{' '}
+        to convert
+        <span className="font-weight-bold"> current time</span> between
+        different timezones.
+      </li>
+    </ol>
   );
 }
 
diff --git a/src/subpages/main.js b/src/subpages/main.js
@@ -1,20 +1,9 @@
 import React from 'react';
 
 import CurrentTime from '../comp/currentTime';
-import Footer from '../comp/footer';
-import Header from '../comp/header';
 
 function Main() {
-  return (
-    <div
-      className="container-fluid"
-      style={{ maxWidth: '100vw', overflow: 'hidden', padding: 0 }}
-    >
-      <Header />
-      <CurrentTime />
-      <Footer />
-    </div>
-  );
+  return <CurrentTime />;
 }
 
 export default Main;