Merge pull request #70 from transitnownash/choose-how-you-move-banner

Swap out loading screen for CHYM banner

src/components/LoadingScreen.js

@@ -1,18 +1,21 @@
 import { React } from 'react';
 import PropTypes from 'prop-types';
 import TitleBar from './TitleBar';
-import logo from '../resources/logo.svg';
 import './LoadingScreen.scss';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faMusic } from '@fortawesome/free-solid-svg-icons';
+import { faSpinner } from '@fortawesome/free-solid-svg-icons';
 
 function LoadingScreen({ hideTitleBar }) {
   return (
     <div>
       <TitleBar hide={hideTitleBar}></TitleBar>
       <div className="loading-screen">
-        <div className="m-4"><img src={logo} className="loading-screen-logo" alt="Logo"/></div>
-        <div className="h3 mb-3"><FontAwesomeIcon icon={faMusic} bounce className='text-dark' /> The wheels on the bus go ... <FontAwesomeIcon icon={faMusic} bounce className='text-dark' /></div>
+        <a href="https://transit.nashville.gov/">
+          <img src="/campaigns/2024-choose-how-you-move.png" alt="Choose How You Move Campaign" className="img-fluid rounded" />
+        </a>
+        <div className="h3 my-3">
+          <FontAwesomeIcon icon={faSpinner} spin opacity={0.5} /> Loading ...
+        </div>
       </div>
     </div>
   );

src/components/LoadingScreen.scss

@@ -1,4 +1,5 @@
 .loading-screen {
+  padding: 2rem;
   text-align: center;
   height: 80vh;
   display: flex;