aboutsummaryrefslogtreecommitdiff
path: root/src/client/react/components/page
diff options
context:
space:
mode:
authorNoah Loomans <noahloomans@gmail.com>2018-03-21 19:16:43 +0100
committerNoah Loomans <noahloomans@gmail.com>2018-03-21 19:16:43 +0100
commit18d671d76bf2f336f5010111eb4880e54bbf6014 (patch)
treef2ecdd12bcc0b51aa0214f9f64977021a8ec9b6c /src/client/react/components/page
parent2e426cce0f3649cbcc21717e79b18434a8a66f35 (diff)
Migrate IndexPage styling
Diffstat (limited to 'src/client/react/components/page')
-rw-r--r--src/client/react/components/page/Index.js4
-rw-r--r--src/client/react/components/page/Index.scss33
2 files changed, 36 insertions, 1 deletions
diff --git a/src/client/react/components/page/Index.js b/src/client/react/components/page/Index.js
index ac6c4f6..b2ebbcb 100644
--- a/src/client/react/components/page/Index.js
+++ b/src/client/react/components/page/Index.js
@@ -22,10 +22,12 @@ import React from 'react';
import Search from '../container/Search';
import HelpBox from '../container/HelpBox';
+import './Index.scss';
+
class IndexPage extends React.Component {
render() {
return (
- <div className="page-index">
+ <div className="IndexPage">
<div className="container">
<img src="/icons/mml-logo.png" alt="Metis" />
<Search />
diff --git a/src/client/react/components/page/Index.scss b/src/client/react/components/page/Index.scss
new file mode 100644
index 0000000..f47b36d
--- /dev/null
+++ b/src/client/react/components/page/Index.scss
@@ -0,0 +1,33 @@
+.IndexPage {
+ background-color: #ececec;
+ padding-top: calc(50vh - 310px);
+ height: 100vh;
+
+ .container {
+ max-width: 600px;
+ margin: 0 auto;
+ padding: 8px;
+
+ img {
+ display: block;
+ margin: 64px auto;
+ }
+
+ .Search {
+ z-index: 1; // Position search above help-box
+ }
+ }
+}
+
+
+@media (max-height: 510px) {
+ .IndexPage {
+ padding-top: 0px;
+
+ .container {
+ img {
+ display: none;
+ }
+ }
+ }
+}