From 9c57ed82660f9960b8ce986dd6cb0ace19627e8b Mon Sep 17 00:00:00 2001
From: Niel Rohling <niel.rohling@gmail.com>
Date: Thu, 7 Feb 2019 22:15:10 +0100
Subject: [PATCH] optimized some css

---
 src/App.css                       | 7 -------
 src/App.scss                      | 4 ++++
 src/App.tsx                       | 2 +-
 src/components/Header/Header.scss | 9 +++------
 4 files changed, 8 insertions(+), 14 deletions(-)
 delete mode 100755 src/App.css
 create mode 100644 src/App.scss

diff --git a/src/App.css b/src/App.css
deleted file mode 100755
index c84d958..0000000
--- a/src/App.css
+++ /dev/null
@@ -1,7 +0,0 @@
-body {
-  background-color: pink;
-}
-
-.App {
-  text-align: center;
-}
diff --git a/src/App.scss b/src/App.scss
new file mode 100644
index 0000000..ab3fb24
--- /dev/null
+++ b/src/App.scss
@@ -0,0 +1,4 @@
+body {
+  background-color: #4a4a4a;
+  font-size: 160%
+}
diff --git a/src/App.tsx b/src/App.tsx
index beb7e21..654fa0e 100755
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2,7 +2,7 @@ import React, { Component } from 'react';
 
 import Header from './components/Header/Header';
 
-import './App.css';
+import './App.scss';
 
 class App extends Component {
   public render() {
diff --git a/src/components/Header/Header.scss b/src/components/Header/Header.scss
index ac52886..0e7f4b2 100644
--- a/src/components/Header/Header.scss
+++ b/src/components/Header/Header.scss
@@ -1,10 +1,7 @@
 .App-header {
+  text-align: center;
   background-color: #282c34;
-  min-height: 100px;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: calc(10px + 2vmin);
+  font-size: 1.6em;
+  padding: 0.5em 0;
   color: white;
 }