Material UI Theme primary and secondary changed to AA Brand Dark and Orange

client/src/App.js

@@ -9,6 +9,10 @@ import { setContext } from 'apollo-link-context'
 
 import { Route, BrowserRouter, Switch } from 'react-router-dom'
 
+// Material UI
+
+import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles'
+
 // Components
 
 import NavBar from './components/NavBar'
@@ -65,31 +69,40 @@ export const client = new ApolloClient({
 
 export const auth = new Auth(result => console.log('auth result', result), client)
 
+/* Here we change the default Material UI theme for Advanced Algos brand colors. */
+
+const theme = createMuiTheme({
+  palette: {
+    primary: { main: '#303036' }, // DARK.
+    secondary: { main: '#F0A202' } // GOLDEN_ORANGE.
+  }
+})
+
 class App extends Component {
   render () {
     return (
       <BrowserRouter>
         <ApolloProvider client={client}>
-
-          <div className='App'>
-            <NavBar />
-            <Switch>
-              <Route exact path='/' component={Home} />
-              <Route path='/user' component={User} />
-              <Route path='/browse' component={Browse} />
-              <Route path='/search' component={Search} />
-              <Route path='/about' component={About} />
-              <Route path='/contact' component={Contact} />
-              <Route path='/logout' component={Logout} />
-              <Route path='/:post_id' component={Post} />
-              <Route path='/callback' render={(props) => {
-                auth.handleAuthentication(props)
-                return <Callback {...props} />
-              }} />
-            </Switch>
-            <Footer />
-          </div>
-
+          <MuiThemeProvider theme={theme}>
+            <div className='App'>
+              <NavBar />
+              <Switch>
+                <Route exact path='/' component={Home} />
+                <Route path='/user' component={User} />
+                <Route path='/browse' component={Browse} />
+                <Route path='/search' component={Search} />
+                <Route path='/about' component={About} />
+                <Route path='/contact' component={Contact} />
+                <Route path='/logout' component={Logout} />
+                <Route path='/:post_id' component={Post} />
+                <Route path='/callback' render={(props) => {
+                  auth.handleAuthentication(props)
+                  return <Callback {...props} />
+                }} />
+              </Switch>
+              <Footer />
+            </div>
+          </MuiThemeProvider>
         </ApolloProvider>
       </BrowserRouter>
     )