diff --git a/public/index.html b/public/index.html
index aa069f2..2e82f81 100644
--- a/public/index.html
+++ b/public/index.html
@@ -24,7 +24,7 @@
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
-
React App
+ Västtrafik
You need to enable JavaScript to run this app.
diff --git a/src/App.js b/src/App.js
index 76f57ba..1dadba9 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,23 +1,29 @@
-import logo from './logo.svg';
import './App.css';
+import React, { Component } from 'react';
-function App() {
- return (
-
- );
+
+class App extends Component {
+ render() {
+ return (
+
+ );
+ }
}
+const app = document.getElementById('App');
+
export default App;
diff --git a/src/fonts/roboto-regular.ttf b/src/fonts/roboto-regular.ttf
new file mode 100644
index 0000000..7d9a6c4
Binary files /dev/null and b/src/fonts/roboto-regular.ttf differ
diff --git a/src/index.css b/src/index.css
index ec2585e..3660f04 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,13 +1,55 @@
-body {
- margin: 0;
- font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
- 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
- sans-serif;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
+@font-face {
+ font-family: 'Roboto';
+ src: url('fonts/roboto-regular.ttf') format('truetype'); /* Safari, Android, iOS */
}
-code {
- font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
- monospace;
+* {
+ margin: 0;
+ padding: 0;
+ font-family: 'Roboto', sans-serif;
+ outline: none;
}
+
+html, body, #root, #app {
+ width: 100%;
+ height: 100%;
+}
+
+#app {
+ display: flex;
+ flex-direction: column;
+}
+
+header {
+ width: 100vw;
+ height: 15vh;
+ background: burlywood;
+}
+
+#pageArea {
+ width: 100vw;
+ flex: 1 1 auto;
+}
+
+#bottomMenu {
+ width: 100%;
+ height: 8vh;
+ background: lightcoral;
+ display: flex;
+ justify-content: space-evenly;
+}
+
+#bottomMenu button {
+ background: none;
+ border: none;
+ font-size: 0.9em;
+ margin-bottom: 5px;
+ flex-basis: calc(100%/3);
+ display: flex;
+ align-items: flex-end;
+ justify-content: space-evenly;
+}
+
+#bottomMenu button:active {
+
+}
\ No newline at end of file