Merge pull request #890 from appirio-tech/dev - promote to prod

Merging ratings graph fixes

Author: ajefts

app/directives/challenge-links/challenge-links.directive.js

@@ -12,11 +12,6 @@ import angular from 'angular'
       scope: {
         challenge: '=',
         view: '='
-      },
-      link: function(scope, element, attrs) {
-        element.on('click', function() {
-          window.location.href = $(this).attr('href')
-        })
       }
     }
   })

app/directives/history-graph/history-graph.directive.js

@@ -245,10 +245,10 @@ import Tooltip from 'appirio-tech-react-components/components/Tooltip/Tooltip.js
           return y
         }
       }
-      
+
       /* render react tooltip component */
       ReactDOM.unmountComponentAtNode(document.getElementById('chart-tooltip'))
-      ReactDOM.render(<Tooltip popMethod='click'>
+      ReactDOM.render(<Tooltip popMethod='hover'>
           <div className='tooltip-target'></div>
           <div className='tooltip-body'>
           <div className='tooltip-rating'></div>
@@ -259,7 +259,7 @@ import Tooltip from 'appirio-tech-react-components/components/Tooltip/Tooltip.js
           </div>
         </Tooltip>
         , document.getElementById('chart-tooltip'))
-    
+
       svg.selectAll('circle')
          .data(history)
          .enter()
@@ -270,6 +270,7 @@ import Tooltip from 'appirio-tech-react-components/components/Tooltip/Tooltip.js
          .attr('cy', function(d) {
            return y(d.newRating)
          })
+         .attr('r', 5.5)
          .attr('fill', function(d) {
            return ratingToColor($scope.colors, d.newRating)
          })
@@ -283,18 +284,18 @@ import Tooltip from 'appirio-tech-react-components/components/Tooltip/Tooltip.js
              else
                location.href = $filter('challengeLinks')({id: d.challengeId, 'track': $state.params.track, 'subTrack': $state.params.subTrack}, 'detail')
            })
-           
+
            /* update tooltip location on mouseover, feature currently not inbuilt in react tooltip component */
            d3.select('#chart-tooltip')
-              .style('left', (d3.event.pageX-5) + 'px')    
+              .style('left', (d3.event.pageX-5) + 'px')
               .style('top', (d3.event.pageY-5) + 'px')
            d3.select('#chart-tooltip .tooltip-container')
-              .style('left', '20px !important')    
+              .style('left', '20px !important')
               .style('top', '-20px !important')
            d3.select('#chart-tooltip .tooltip-container .tooltip-pointer')
-              .style('left', '-5.5px !important')    
+              .style('left', '-5.5px !important')
               .style('bottom', '25px !important')
-          
+
            d3.select('#chart-tooltip .challenge-name').text($scope.historyChallenge)
            d3.select('#chart-tooltip .challenge-date').text(moment(d.ratingDate).format('MMM DD, YYYY'))
            d3.select('#chart-tooltip .tooltip-rating').text($scope.historyRating)
@@ -307,7 +308,7 @@ import Tooltip from 'appirio-tech-react-components/components/Tooltip/Tooltip.js
            $scope.$digest()
          })
 
-      /* hide tooltip when clicked anywhere outside */           
+      /* hide tooltip when clicked anywhere outside */
       d3.select('body').on('click', function(){
         if((d3.event.target.classList[0] != 'tooltip-target') && !$('#chart-tooltip .tooltip-container').hasClass('tooltip-hide') &&
           (d3.event.target.tagName.toLowerCase()!='circle') && !(d3.event.target.tagName.toLowerCase()=='rect' && d3.event.target.classList[0] == 'hover')) {

assets/css/directives/history-graph.scss

@@ -91,7 +91,6 @@
     }
 
     circle {
-      r: 5.5px;
       stroke: $white;
       stroke-width: 1.5px;
     }

assets/css/directives/tc-banner.scss

@@ -155,14 +155,22 @@ $tco-color-dark: #ea690b;
   padding-top: 50px;
 
   .title {
-    font-size: 36px;
-    margin-bottom: 5px;
     margin-top: 10px;
+    @include sofia-pro-bold;
+    color: $white;
   }
 
   .subtitle {
     margin-top: 20px;
     width: 450px;
+    font-size: 20px;
+    @extend .title;
+    @include sofia-pro-regular;
+  }
+
+  .description {
+    margin-top: 20px;
+    margin-bottom: 5px;
   }
 
   .cta {