Merge pull request #26 from nypublicradio/events-pages-WE-7026-7027

new file for events styles

app/styles/app.scss

@@ -87,6 +87,7 @@ body:not(.simplified_wrapper):not(.container_stripped) {
 @import 'legacy/nav-menu';
 @import 'legacy/user-profile';
 @import 'legacy/story';
+@import 'legacy/events';
 @import 'legacy/footer';
 
 // MISC

app/styles/legacy/_events.scss

@@ -0,0 +1,268 @@
+/* extend this style for links below */
+.event-link {
+  font-family: "Lato", sans-serif;
+  color: $wqxrdarkblue;
+  font-weight: normal;
+  font-size: 16px;
+}
+
+#events-home, .event-detail {
+   font-family: "Open Sans", sans-serif;
+   margin-bottom: 175px;
+
+  h2, h3, h4 {
+    font-family: "Lato", sans-serif;
+  }
+
+  .page-titlegroup {
+    margin-top: 15px;
+    margin-bottom: 10px;
+
+    h1 {
+      font-family: "Open Sans", sans-serif !important;
+      padding-bottom: 32px;
+
+      a {
+        color: $wqxrdarkblue;
+      }
+    }
+  }
+
+  a.buy-button, .sold-out {
+    font-size: 16px;
+    display: inline-block;
+    border-radius: 25px;
+    color: white;
+    padding: 4px 18px 5px 18px;
+    background: $wqxrblue;
+    white-space: nowrap;
+    font-weight: 600;
+    line-height: 2;
+
+
+    &:hover {
+      text-decoration: none;
+    }
+  }
+
+  .sold-out {
+    font-size: 16px;
+    background-color: $lightgray;
+  }
+}
+
+/* EVENTS MAIN PAGE */
+#events-home {
+  margin-right: 85px;
+
+  .primary_event, .event-tease, .blurb-tease {
+
+    padding: 30px 0 !important;
+
+    .mediumimage.imageleft {
+      margin-right: 30px;
+    }
+
+    .mediumimage, .smallimage, h2 {
+      a, a:hover {
+        border-bottom: none;
+      }
+    }
+
+    h2, h3{
+      color: $darkergray;
+    }
+
+    h2.event-channel {
+      margin-bottom: 13px;
+      a {
+        display: block;
+        font-size: 14px;
+        line-height: 1;
+        font-weight: normal;
+        padding: 0;
+        color: $darkergray; 
+      }
+    }
+
+    h2.title {
+      font-size: 24px;
+      font-weight: normal;
+      line-height: 1.5;
+    }
+    h2.title a {
+      font-size: 24px;
+      font-weight: normal;
+      color: $darkergray !important;
+    }
+
+    h2 a:hover {
+      text-decoration: none;
+      color: $wqxrblue !important;
+    }
+
+    .event-date, .date.time {
+      margin-bottom: 17px;
+    }
+    h3.date {
+      font-size: 14px; 
+      line-height: 1.5;
+    }
+
+    p {
+      color: $darkergray;
+      font-size: 16px;
+      line-height: 1.7;
+    }
+
+    .text {
+      margin-bottom: 10px;
+    }
+
+
+    .vendor-link, p a.buy-button {
+      margin-top: 18px;
+    }
+
+    ul.storylinks li a {
+      @extend .event-link;
+      background: none;
+      padding-left: 0;
+    }
+
+  }
+
+  .blurb-tease + h4 {
+    padding-top: 30px;
+    padding-bottom: 30px;
+    a.more {
+      @extend .event-link;
+      &::after {
+        content: none;
+      }
+    }
+  }
+
+}
+
+.event-detail-sidebar.sidebar {
+  margin-top: 84px;
+
+  .sideblock:not(.ad_container) {
+    /* headings */
+    p strong {
+      font-family: "Lato", sans-serif;
+    }
+
+    /* text */
+    p {
+      margin-bottom: 10px;
+      font-family: "Open Sans", sans-serif;
+      font-size: 16px;
+      line-height: 1.5;
+    }
+
+    p.image-caption {
+      font-size: 12px;
+    }
+
+    /* links */
+    p a {
+      @extend .event-link;
+      color: $blue;
+    }
+
+    p a.more:after {
+      content: none;
+    }
+
+    hr {
+      margin: 35px 0;
+    }
+  }
+}
+
+
+/* SINGLE EVENT PAGE */
+.event-detail {
+
+  .story-headergroup.event {
+    background-color: $wqxrdarkblue;
+    color: white;
+    padding: 16px 140px 16px 23px;
+
+    h2 {
+      font-size: 24px;
+      line-height: 1.5;
+      font-weight: bold;
+    }
+    h3 {
+      color: white;
+      font-size: 14px;
+      line-height: 1.5;
+      font-weight: bold;
+    }
+    .vendor-link {
+      font-size: 16px;
+      position: absolute;
+      top: 26px;
+      right: 16px;
+      .buy-button:hover {
+        background: $wqxrblue;
+      }
+
+    }
+
+  }
+  .share-tools {
+    margin: 7px 0 34px;
+    .sharelinks .fa-hover a {
+      line-height: 33px;
+    }
+  }
+
+  .story-sidebar {
+    width: auto;
+    float: none;
+    margin: 0 0 25px;
+
+    p, ul li {
+      margin-top: 0;
+      font-size: 14px;
+      line-height: 1.5;
+      margin-bottom: 10px;
+    }
+
+    p.imagecaption {
+      font-size: 12px;
+    }
+
+
+    .mediumimage {
+      float: left;
+      width: 200px;
+      margin-right: 25px;
+    }
+
+    .event-venue li {
+      background: none;
+    }
+
+    &:after {
+      @extend .clearfix;
+    }
+  }
+
+  .sponsor-sidebar {
+    .event-partners {
+      h4 {
+        font-size: 24px;
+        line-height: 1.5;
+        margin-bottom: 30px;
+      }
+    }
+  }
+}
+
+
+