Refs #2982: starting with reactux integration

2 files changed, 49 insertions, 20 deletions

diff --git a/app/assets/javascripts/es6_browserified/time_tables/components/Metas.js b/app/assets/javascripts/es6_browserified/time_tables/components/Metas.js
index 3bb763c71..1440dcb1d 100644
--- a/app/assets/javascripts/es6_browserified/time_tables/components/Metas.js
+++ b/app/assets/javascripts/es6_browserified/time_tables/components/Metas.js
@@ -11,27 +11,47 @@ const reorderArray = (arr) =>{
 const Metas = ({day_types}) => {
   day_types = reorderArray(day_types)
   return (
-    <div>
-      <h2>Metas</h2>
-        <div className="form-group labelled-checkbox-group">
-          {day_types.map((day, i) =>
-            <div className="lcbx-group-item"
-              key={i}
-            >
-              <div className="checkbox">
-                <label>
-                  <input
-                    onChange={(e) => {e.preventDefault()}}
-                    id={i}
-                    type="checkbox"
-                    checked={day ? 'checked' : ''}
-                  />
-                  <span className='lcbx-group-item-label'>{weekDays[i]}</span>
-                </label>
+    <div className='form-horizontal'>
+      <div className="row">
+        <div className="col-lg-12">
+          {/* comment (name) */}
+          <div className="form-group"></div>
+
+          {/* color */}
+          <div className="form-group"></div>
+
+          {/* tags */}
+          <div className="form-group"></div>
+
+          {/* day_types */}
+          <div className="form-group">
+            <label htmlFor="" className="control-label col-sm-4">
+              Journées d'applications pour les périodes ci-dessous
+            </label>
+            <div className="col-sm-8">
+              <div className="form-group labelled-checkbox-group">
+                {day_types.map((day, i) =>
+                  <div className="lcbx-group-item"
+                    key={i}
+                    >
+                    <div className="checkbox">
+                      <label>
+                        <input
+                          onChange={(e) => {e.preventDefault()}}
+                          id={i}
+                          type="checkbox"
+                          checked={day ? 'checked' : ''}
+                          />
+                        <span className='lcbx-group-item-label'>{weekDays[i]}</span>
+                      </label>
+                    </div>
+                  </div>
+                )}
               </div>
             </div>
-          )}
+          </div>
         </div>
+      </div>
     </div>
   )
 }
diff --git a/app/views/time_tables/new.html.slim b/app/views/time_tables/new.html.slim
index bc15f7032..8770a59b2 100644
--- a/app/views/time_tables/new.html.slim
+++ b/app/views/time_tables/new.html.slim
@@ -1,3 +1,12 @@
-= title_tag t('time_tables.new.title')
+/ PageHeader
+= pageheader 'map-marker',
+             t('time_tables.new.title'),
+             '',
+             ''
 
-== render 'form'
\ No newline at end of file
+/ PageContent
+.page_content
+  .container-fluid
+    .row
+      .col-lg-8.col-lg-offset-2.col-md-8.col-md-offset-2.col-sm-10.col-sm-offset-1
+        == render 'form'