Merge pull request #1271 from appirio-tech/t-shirt-announcement

Replace announcement and add Valentine's day banner

Author: ThomasKranitsas

app/my-dashboard/notifications/news.json

@@ -1,16 +1,17 @@
 [
   {
-    "header": "QA",
-    "details": "Live Reveal of New Topcoder Track w/ Will Price",
-    "headerExpand": "QA Track Revealed",
-    "detailsExpand": "Join Nick as he interviews Will Price who will be introducing Topcoder's newest track.  Spoiler Alert: You could win a TCO Trip!",
-    "backgroundImageDesktop": "DarkCircles-desktop.jpg",
-    "backgroundImageTablet": "DarkCircles-tablet.jpg",
-    "backgroundImageMobile": "DarkCircles-mobile.jpg",
-    "redirectTo": "https://www.topcoder.com/all-you-need-to-know-about-qa-challenges/",
-    "redirectText": "Learn More Here",
-    "live": true,
-    "liveExpand": true,
-    "videoCode": "https://www.youtube.com/embed/LF6rc40-TSo"
+    "header": "28 Days of T-Shirts!",
+    "details": "Every day in February you can win a shirt!",
+    "headerExpand": "28 Days of T-Shirts!",
+    "detailsExpand": "Every day a new chance to win a t-shirt. Check our Facebook page, Instagram, Twitter, the Forums or Slack for the contest of the day and good luck winning that t-shirt!",
+    "backgroundImageDesktop": "tshirt-desktop.jpg",
+    "backgroundImageTablet": "tshirt-tablet.jpg",
+    "backgroundImageMobile": "tshirt-mobile.jpg",
+    "live": false,
+    "liveExpand": false,
+    "customTag": {
+      "text": "Announcement"
+    },
+    "videoCode": ""
   }
 ]

assets/css/directives/notification.directive.scss

@@ -132,6 +132,7 @@ $desktop-width: 1024px;
       position: relative;
       @include desktop {
         height: 400px;
+        padding: 20px;
       }
       @include tablet {
         height: 325px;
@@ -140,9 +141,7 @@ $desktop-width: 1024px;
         padding: 20px;
       }
       @include mobile {
-        // Without video
-
-        // height: 250px;
+        height: 250px;
         display: flex;
         flex-direction: column;
         padding: 14px;
@@ -182,10 +181,10 @@ $desktop-width: 1024px;
 
       }
       @include mobile {
-        font-size: 20px;
+        font-size: 24px;
         text-align: center;
         padding-top: 20px;
-        padding-bottom: 10px;
+        padding-bottom: 20px;
         /*
         ======
         With Logo
@@ -224,7 +223,8 @@ $desktop-width: 1024px;
         */
       }
       @include mobile {
-        font-size: 14px;
+        font-size: 18px;
+        line-height: 26px;
         margin-bottom: 25px;
         text-align: center;
         /*

assets/css/my-dashboard/notifications.scss

@@ -40,7 +40,8 @@
       margin-right: 0;
     }
     &.tco18{
-      background: url(../../images/banner-tco18-stage-3.jpg) center/cover;
+      // background: url(../../images/banner-tco18-stage-3.jpg) center/cover;
+      background: url(../../images/[email protected]) center/cover;
       background-position: center top;
     }
     &.watson{
@@ -60,6 +61,12 @@
       &:last-child{
         margin-bottom: 0;
       }
+      &.tco18{
+        background-size: contain;
+        background-position: center;
+        background-repeat: no-repeat;
+        background-color: #333333;
+      }
     }
   }
 }