Make dashboard larger on large screens

Author: Pierre-Gilles

front/src/routes/dashboard/DashboardPage.jsx

@@ -16,7 +16,7 @@ const DashboardPage = ({ children, ...props }) => (
         <div class="loader" />
         <div class="dimmer-content">
           <div class="my-3 my-md-5 dashboard">
-            <div class={cx('container')}>
+            <div class={cx(style.dashboardContainer)}>
               <div class="page-header">
                 <div>
                   {!props.dashboardListEmpty && (

front/src/routes/dashboard/edit-dashboard/EditDashboard.jsx

@@ -15,7 +15,7 @@ const EditDashboard = ({ children, ...props }) => (
         <div class="loader" />
         <div class="dimmer-content">
           <div class="my-3 my-md-5">
-            <div class={cx('container', style.largeContainer)}>
+            <div class={cx(style.dashboardContainer)}>
               <div class="row">
                 <div class="col-lg-3">
                   <div class="card">

front/src/routes/dashboard/style.css

@@ -1,3 +1,11 @@
+.dashboardContainer {
+  width: 100%;
+  padding-right: 0.75rem;
+  padding-left: 0.75rem;
+  margin-right: auto;
+  margin-left: auto;
+}
+
 .emptyStateDivBox {
   max-width: 450px;
   margin-left: auto;