add fa logo at top

src/components/TemplateCover.js

@@ -3,7 +3,7 @@ import { connect } from 'react-redux'
 import { Player } from 'video-react'
 import marked from 'marked'
 import MediaOverlay from './Overlay/Media'
-
+import logo from '../assets/fa-logo.png'
 const MEDIA_HIDDEN = -2
 
 /**
@@ -117,6 +117,7 @@ class TemplateCover extends React.Component {
     const { videos } = this.props.cover
     return (
       <div className='default-cover-container'>
+        <img className='cover-logo' src={logo} />
         <div className='cover-content'>
           {
             this.props.cover.bgVideo ? (
@@ -140,7 +141,6 @@ class TemplateCover extends React.Component {
               <h5>{this.props.cover.subsubtitle}</h5>
             ) : null
           }
-          <hr />
 
           {this.props.cover.featureVideo ? this.renderFeature() : null}
           <div className='hero thin'>

src/scss/cover.scss

@@ -17,6 +17,11 @@
   }
 }
 
+.cover-logo {
+  margin-top: 30px;
+  width: 200px;
+}
+
 .fullscreen-bg {
   &.hidden {
     top: -100%;
@@ -164,8 +169,8 @@
     overflow-y: auto;
     overflow-x: hidden;
     h1, h2, h3, h4, h5 { text-align: center; }
-    h1 { margin-bottom: -20px; }
-    h5 { margin-top: -10px; }
+    h1 { margin-bottom: -15px; margin-top: 30px; }
+    h5 { margin-top: -15px; }
 
     // mobile styles, remove overlay buttons
     @media only screen and (max-width: 992px) {

webpack.config.js

@@ -1,19 +1,19 @@
-const webpack = require('webpack');
-const MiniCssExtractPlugin = require('mini-css-extract-plugin');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
+const webpack = require('webpack')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
 
-const devMode = process.env.NODE_ENV !== 'production';
-const path = require('path');
+const devMode = process.env.NODE_ENV !== 'production'
+const path = require('path')
 
-const APP_DIR = path.resolve(__dirname, './src');
-const BUILD_DIR = path.resolve(__dirname, './build');
+const APP_DIR = path.resolve(__dirname, './src')
+const BUILD_DIR = path.resolve(__dirname, './build')
 
 /** env variables from config.js */
-const envConfig = require('./config');
+const envConfig = require('./config')
 const userConfig = {}
 const userFeatures = {}
 for (const k in envConfig) {
-  userConfig[k] = JSON.stringify(envConfig[k]);
+  userConfig[k] = JSON.stringify(envConfig[k])
 }
 
 for (const k in envConfig['features']) {
@@ -22,7 +22,7 @@ for (const k in envConfig['features']) {
 
 const config = {
   entry: {
-    index: `${APP_DIR}/index.jsx`,
+    index: `${APP_DIR}/index.jsx`
   },
   devtool: 'source-map',
   module: {
@@ -41,14 +41,14 @@ const config = {
         include: `${APP_DIR}`,
         use: {
           loader: 'babel-loader'
-        },
-      }, {
-        test: /\.(eot|svg|otf|ttf|woff|woff2)$/,
-        use: {
-          loader: 'file-loader',
         }
-      },
-    ],
+      }, {
+        test: /\.(eot|svg|otf|ttf|woff|woff2|png)$/,
+        use: {
+          loader: 'file-loader'
+        }
+      }
+    ]
   },
   node: {
     net: 'empty',
@@ -56,11 +56,11 @@ const config = {
     dns: 'empty'
   },
   resolve: {
-    extensions: ['*', '.js', ],
+    extensions: ['*', '.js']
   },
   output: {
     path: BUILD_DIR,
-    filename: 'js/[name].bundle.js',
+    filename: 'js/[name].bundle.js'
   },
   plugins: [
     new webpack.DefinePlugin({
@@ -72,12 +72,12 @@ const config = {
     }),
     new MiniCssExtractPlugin({
       filename: devMode ? '[name].css' : '[name].[hash].css',
-      chunkFilename: devMode ? '[id].css' : '[id].[hash].css',
+      chunkFilename: devMode ? '[id].css' : '[id].[hash].css'
     }),
     new HtmlWebpackPlugin({
-      template: './index.html',
+      template: './index.html'
     })
-  ],
-};
+  ]
+}
 
-module.exports = config;
+module.exports = config