From 18d671d76bf2f336f5010111eb4880e54bbf6014 Mon Sep 17 00:00:00 2001 From: Noah Loomans Date: Wed, 21 Mar 2018 19:16:43 +0100 Subject: Migrate IndexPage styling --- src/client/react/components/page/Index.js | 4 +++- src/client/react/components/page/Index.scss | 33 +++++++++++++++++++++++++++++ 2 files changed, 36 insertions(+), 1 deletion(-) create mode 100644 src/client/react/components/page/Index.scss (limited to 'src/client/react/components/page') 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 ( -
+
Metis 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; + } + } + } +} -- cgit v1.1