Expand navbar to full width in-app

7 files changed, 9 insertions, 9 deletions

diff --git a/src/components/navigation/AppNavbar.js b/src/components/navigation/AppNavbar.js
index 05aa09fd..7ed1821c 100644
--- a/src/components/navigation/AppNavbar.js
+++ b/src/components/navigation/AppNavbar.js
@@ -5,8 +5,8 @@ import {Link} from "react-router-dom";
 import Navbar, {NavItem} from "./Navbar";
 import "./Navbar.css";
 
-const AppNavbar = ({simulationId, inSimulation}) => (
-    <Navbar>
+const AppNavbar = ({simulationId, inSimulation, fullWidth}) => (
+    <Navbar fullWidth={fullWidth}>
         {inSimulation ?
             <NavItem route={"/simulations/" + simulationId}>
                 <Link
diff --git a/src/components/navigation/HomeNavbar.js b/src/components/navigation/HomeNavbar.js
index 9c393da4..4d821325 100644
--- a/src/components/navigation/HomeNavbar.js
+++ b/src/components/navigation/HomeNavbar.js
@@ -9,7 +9,7 @@ const ScrollNavItem = ({id, name}) => (
 );
 
 const HomeNavbar = () => (
-    <Navbar>
+    <Navbar fullWidth={false}>
         <ScrollNavItem id="#stakeholders" name="Stakeholders"/>
         <ScrollNavItem id="#modeling" name="Modeling"/>
         <ScrollNavItem id="#simulation" name="Simulation"/>
diff --git a/src/components/navigation/Navbar.js b/src/components/navigation/Navbar.js
index 2358e146..6dfc20b0 100644
--- a/src/components/navigation/Navbar.js
+++ b/src/components/navigation/Navbar.js
@@ -45,9 +45,9 @@ const LoggedInSectionWithoutRoute = ({location}) => (
     )
 ;
 
-const Navbar = ({children}) => (
+const Navbar = ({fullWidth, children}) => (
     <nav className="navbar fixed-top navbar-expand-lg navbar-light bg-faded" id="navbar">
-        <div className="container">
+        <div className={fullWidth ? "container-fluid" : "container"}>
             <button className="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse"
                     data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
                     aria-expanded="false" aria-label="Toggle navigation">
diff --git a/src/pages/App.js b/src/pages/App.js
index 8f46156b..583b9476 100644
--- a/src/pages/App.js
+++ b/src/pages/App.js
@@ -55,7 +55,7 @@ class AppComponent extends React.Component {
                 title={this.props.simulationName ? this.props.simulationName + " - OpenDC" : "Simulation - OpenDC"}
             >
                 <div className="page-container full-height">
-                    <AppNavbar simulationId={this.props.simulationId} inSimulation={true}/>
+                    <AppNavbar simulationId={this.props.simulationId} inSimulation={true} fullWidth={true}/>
                     {this.props.datacenterIsLoading ?
                         <div className="full-height d-flex align-items-center justify-content-center">
                             <LoadingScreen/>
diff --git a/src/pages/Experiments.js b/src/pages/Experiments.js
index 5985de45..c56ad5ce 100644
--- a/src/pages/Experiments.js
+++ b/src/pages/Experiments.js
@@ -28,7 +28,7 @@ class ExperimentsComponent extends React.Component {
                     "Experiments - OpenDC"}
             >
                 <div className="full-height">
-                    <AppNavbar simulationId={this.props.simulationId} inSimulation={true}/>
+                    <AppNavbar simulationId={this.props.simulationId} inSimulation={true} fullWidth={true}/>
                     <div className="container text-page-container full-height">
                         <ExperimentListContainer/>
                         <NewExperimentButtonContainer/>
diff --git a/src/pages/Profile.js b/src/pages/Profile.js
index 6d09dc89..17b01495 100644
--- a/src/pages/Profile.js
+++ b/src/pages/Profile.js
@@ -8,7 +8,7 @@ import DeleteProfileModal from "../containers/modals/DeleteProfileModal";
 const ProfileContainer = ({onDelete}) => (
     <DocumentTitle title="My Profile - OpenDC">
         <div className="full-height">
-            <AppNavbar inSimulation={false}/>
+            <AppNavbar inSimulation={false} fullWidth={false}/>
             <div className="container text-page-container full-height">
                 <button className="btn btn-danger" onClick={onDelete}>Delete my account on OpenDC</button>
                 <p>
diff --git a/src/pages/Simulations.js b/src/pages/Simulations.js
index 5ca48435..46b2843c 100644
--- a/src/pages/Simulations.js
+++ b/src/pages/Simulations.js
@@ -18,7 +18,7 @@ class SimulationsContainer extends React.Component {
         return (
             <DocumentTitle title="My Simulations - OpenDC">
                 <div className="full-height">
-                    <AppNavbar inSimulation={false}/>
+                    <AppNavbar inSimulation={false} fullWidth={false}/>
                     <div className="container text-page-container full-height">
                         <SimulationFilterPanel/>
                         <VisibleSimulationList/>