Merge pull request #876 from appirio-tech/tom-tco17-banner

Tom tco17 banner

Author: tladendo

app/my-dashboard/my-dashboard.jade

@@ -7,6 +7,12 @@
 
   //- .ttl
   //-   tc-banner(theme="black", banner-name="ttl")
+  .tco.tco17
+    .tc-banner-placeholder.black.bg-image
+      .title 2017 Topcoder Open
+      .subtitle The Ultimate Programming & Design tournament
+      .description Earn your way to the USA!
+      a(href="http://tco17.topcoder.com/").cta.tc-btn-white.tc-btn-radius Learn More
 
   .tco
     tc-banner(theme="black", banner-name="tco16")

assets/css/directives/tc-banner.scss

@@ -3,6 +3,10 @@
 $tco-color: #F47A20;
 $tco-color-dark: #ea690b;
 
+.tco17 {
+  margin-bottom: 10px;
+}
+
 .tc-banner-placeholder {
   display: flex;
   flex-direction: column;
@@ -113,6 +117,11 @@ $tco-color-dark: #ea690b;
     color: $white;
   }
 
+  .subtitle {
+    @extend .title;
+    @include sofia-pro-regular;
+  }
+
   .description {
     color: $white;
   }
@@ -124,5 +133,41 @@ $tco-color-dark: #ea690b;
       }
     }
   }
+
+  .tc-btn-white {
+    background-color: white;
+    color: #0096FF;
+    padding: 10px 20px;
+    margin-top: 5px;
+  }
+
+  .tc-btn-radius {
+    border-radius: 26px;
+  }
+}
+.tc-banner-placeholder.bg-image {
+  background-image: url(../../images/home-hero.jpg);
+  background-size: 100%;
+  height: 352px;
+  background-position: center 40%;
+  background-repeat: no-repeat;
+
+  padding-top: 50px;
+  padding-right: 350px;
+
+  .title {
+    font-size: 36px;
+    margin-bottom: 5px;
+    margin-top: 10px;
+  }
+
+  .subtitle {
+    margin-top: 20px;
+    width: 450px;
+  }
+
+  .cta {
+    margin-top: 20px;
+  }
 }