From 7c0e9e792149ce7e6dd20d14334fc1988203b6cc Mon Sep 17 00:00:00 2001
From: walkews <walker_waylon_s@cat.com>
Date: Fri, 14 Jul 2017 17:12:19 -0500
Subject: [PATCH] Continued updates for /enthusiast draft

---
 src/pyDataVizDay.py           |  4 +--
 src/static/css/custom.css     | 47 ++++++++++++++++++++++++++++++-----
 src/static/js/enthusiast.js   |  4 +--
 src/templates/enthusiast.html | 46 +++++++++++++++++++++++++---------
 4 files changed, 79 insertions(+), 22 deletions(-)

diff --git a/src/pyDataVizDay.py b/src/pyDataVizDay.py
index c460835..25fe267 100644
--- a/src/pyDataVizDay.py
+++ b/src/pyDataVizDay.py
@@ -182,8 +182,8 @@ class score_timeseries(Resource):
                                     ['x'] + df.DATE.astype(str).values.tolist()],
                                     # ['x'] + df.index.values.tolist()],
                         'colors':{
-      'IMDB Score': '#B80000',
-      'gross': '#fd8d3c',
+      'IMDB Score': '#0071A7',
+      'gross': '#4D9913',
       'x': '#08414C'
     }}
     return jsonify(score_timeseries)
diff --git a/src/static/css/custom.css b/src/static/css/custom.css
index 54df319..65e373b 100644
--- a/src/static/css/custom.css
+++ b/src/static/css/custom.css
@@ -4,7 +4,14 @@ body{
 }
 .kpi {
     /* color: #B80000; */
-    font-weight:10;
+    font-weight:4;
+    font-size:16px;
+}
+.kpi-value {
+    /* color: #B80000; */
+    font-weight:8;
+    font-size:18px;
+    padding: 10px 20px 10px 0px;
 }
 
 .chosen{
@@ -47,12 +54,40 @@ body{
 
 .title{
     font-size:22px;
-    color:#B80000;
+    color:#0071A7;
     font: bold;
 }
 
+.sentiment-chart-title{
+    color:#0071A7;
+    /*text-align: center;*/
+}
+.word-cloud-title{
+    color:#0071A7;
+    /*text-align: center;*/
+}
+
 .sentiment-chart{
-text-align: center;
-vertical-align: middle;
-line-height: 200px; 
-}
\ No newline at end of file
+    text-align:center;
+    vertical-align: middle;
+    line-height: 150px; 
+    height:300px;
+    background-color:grey;
+    li
+}
+
+#myNavbar{
+/*    background-color:#0071A7;
+}
+
+#navbar{
+    background-color:#0071A7;
+}
+
+#navbar-header{
+    background-color:#0071A7;
+}
+
+.active{
+    background-color:#0071A7;
+}*/
\ No newline at end of file
diff --git a/src/static/js/enthusiast.js b/src/static/js/enthusiast.js
index 376034f..f861b50 100644
--- a/src/static/js/enthusiast.js
+++ b/src/static/js/enthusiast.js
@@ -27,7 +27,7 @@ var data = {
     ],
     'colors': {
       'IMDB Score': '#B80000',
-      'gross': '#fd8d3c',
+      'gross': '#0071A7',
       'x': '#08414C'
     }
   },
@@ -92,7 +92,7 @@ word_coud_settings =     {
       width: 500,
       height: 350,
       classPattern: null,
-      colors: ['#bd0026', '#e31a1c', '#800026', '#fc4e2a', '#fd8d3c', '#feb24c', '#fed976'],// '#ffeda0', '#ffffcc'],
+      colors: ['#0071A7', '#000E29', '#24A854',],// '#ffeda0', '#ffffcc'],
       fontSize: {
         from: 0.1,
         to: 0.02
diff --git a/src/templates/enthusiast.html b/src/templates/enthusiast.html
index cb35387..d102c2b 100644
--- a/src/templates/enthusiast.html
+++ b/src/templates/enthusiast.html
@@ -18,23 +18,33 @@
 
 {% block body %}
     {{ super ()}}
-    {{ form | safe }}
-    <div class="container center" padding:50px>
-
+    <div class="container center" style='background-color:#e8f7ff'>
         <div class='row'>
-            <div class='col-sm-3'></div>
+        <div class='col-sm-12'>
+            <h2>Plot Analysis</h2>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla suscipit dignissim purus at tincidunt. Nam dapibus magna ultricies, sollicitudin tortor id, convallis risus. Morbi convallis pharetra dictum. Proin rutrum finibus justo, eu lobortis felis condimentum sed. Quisque lorem tellus, tempor eu eleifend a, tristique vel mauris. Proin ut augue aliquam, vestibulum tortor et, cursus augue. Nullam pellentesque mattis dui, vitae consequat nulla mattis quis. Aenean non felis diam. Nunc consectetur at nunc sollicitudin fringilla. Nam in gravida tortor.
+
+Cras eu posuere est, a tincidunt diam. Cras et volutpat massa. Ut in ante consequat, egestas dolor vitae, scelerisque leo. Donec vulputate tincidunt nunc id maximus. Aliquam semper enim est, id bibendum eros volutpat quis. Sed orci augue, cursus ut rutrum eu, fringilla nec tortor. Nam consequat tincidunt pretium. In eget ornare massa.
+
+        </div>
+        </div>
+    <div style='margin-top:50px'>
+    {{ form | safe }}
+    </div>
+        <div class='row kpi' style='margin-top:50px auto; float:center; background-color:#ccebfc; border:1px; border-color:#c0e5f9; border-style:solid'>
+            <div class='col-sm-4'></div>
             <div class='col-sm-1'>
-                Year: <div class='kpi' id='year'>
+                Year: <div class='kpi-value' id='year'>
+                </div>
+            </div>
+            <div class='col-sm-1 kpi'>
+                Score: <div class='kpi-value' id='score' style='color:#0071A7'>
                 </div>
             </div>
             <div class='col-sm-1'>
-                Score: <div class='kpi' id='score' style='color:#B80000'>
+                Gross: <div class='kpi-value' id='gross' style='color:#4D9913'>
                 </div>
-            </div>
-            <div class='col-sm-4'>
-                Gross: <div class='kpi' id='gross' style='color:#4D9913'>
-                </div>
-            <div class='col-sm-9'></div>
+            {# <div class='col-sm-3'></div> #}
             </div>
         </div>
 
@@ -46,10 +56,22 @@
 
         <div class="row" min-height:150px>
             <div class='col-sm-6'>
-                <div id='sentiment-chart' class='sentiment-chart'><h2>SENTIMENT</h2></div>
+                <div id='sentiment-chart-title' class='sentiment-chart-title'>
+                <h2>Sentiment</h2>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla suscipit dignissim purus at tincidunt. Nam dapibus magna ultricies, sollicitudin tortor id, convallis risus. Morbi convallis pharetra dictum. Proin rutrum finibus justo, eu lobortis felis condimentum sed. Quisque lorem tellus, tempor eu eleifend a, tristique vel mauris.
+                </div>
+                <div id='sentiment-chart' class='sentiment-chart'>
+                <br>Sentiment Chart
+                </div>
             </div>
 
             <div class='col-sm-6'>
+                <div id='word-cloud-title'>
+                <h2>Common Keywords</h2>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla suscipit dignissim purus at tincidunt. Nam dapibus magna ultricies, sollicitudin tortor id, convallis risus. Morbi convallis pharetra dictum. Proin rutrum finibus justo, eu lobortis felis condimentum sed. Quisque lorem tellus, tempor eu eleifend a, tristique vel mauris.
+
+
+                </div>
                 <div id='word_cloud'></div>
             </div>
         </div>