Merge pull request #33 from topcoder-platform/develop

Version 1.4

Author: jmgasper

design/custom.css

@@ -17,4 +17,10 @@
   border: 1px solid $global-color_primary;
   color: white;
   width: 100%;
+}
+
+
+.ReactButton.Quote {
+  vertical-align: inherit;
+  margin: 0 0;
 }

design/custom.css.map

@@ -22,4 +22,5 @@
 @import 'mebox';
 @import 'editor';
 @import 'table';
-@import 'group';
+@import 'group';
+@import "lists";

src/scss/base/_button.scss

@@ -35,21 +35,41 @@
         padding-top: 0;
         min-height: 0;
 
+        .AuthorWrap {
+          max-width: 100%;
+          display: flex;
+          font-family: $global-body_fontFamily;
+          font-size: $global-medium_fontSize;
+
+          .Author {
+            white-space: nowrap;
+          }
+          .DiscussionInfo {
+             text-align: right;
+             white-space: nowrap;
+             overflow: hidden;
+             text-overflow: ellipsis;
+          }
+        }
         .Username {
           color: $global-color_black_light;
           font-size: 14px;
           font-weight: 500;
           line-height: 16px;
         }
 
+
         .Meta.CommentMeta.CommentInfo {
           display: block;
         }
       }
 
+      .Message {
+        font-family: $link-body_fontFamily;
+      }
+
       .Message.userContent {
-        font-size: 16px;
-        font-weight: 400;
+        font-size: $global-medium_fontSize;
       }
 
       &.CategoryHeading {
@@ -111,6 +131,28 @@
   }
 }
 
+.MessageList.Discussion {
+  .Item.ItemDiscussion {
+    .Item-BodyWrap {
+      .Item-Body {
+        .Message.userContent {
+          font-family: $global-body_fontFamily;
+          font-size: $global-large_fontSize;
+        }
+      }
+    }
+  }
+}
+
+.Message.userContent {
+  a {
+    color: $global-blue;
+    text-decoration: underline;
+  }
+}
+
+
+
 
 .ReactButton.Quote.js-quoteButton {
   font-size: 12px;
@@ -157,7 +199,7 @@
     .MessageList.DataList.Comments {
       li.Item {
         .PhotoWrap {
-          left: 0;
+         // left: 0;
         }
 
         .AuthorWrap {

src/scss/base/_index.scss

@@ -9,27 +9,26 @@
         padding-right: 56px;
         padding-left: 20px;
         font-family: $global-body_fontFamily;
+
+        &:focus,
+        &:active {
+            border-color: $global-color_grey_dark;
+        }
       }
 
       .InputBox.js-search {
-        border: 1px solid #aaa;
+        border: 1px solid $global-color_grey_dark;
       }
 
       input.Button:hover,
       input.Button {
         height: 38px !important;
         width: 56px !important;
-        background: $global-grey-bg !important;
-        border-radius: 30px !important;
+        background: $color-turquoise-tc-turquoise-dark-3 !important;
+        border-radius: 20px !important;
         margin: 1px;
       }
 
-      &::after {
-        color: white !important;
-        width: 56px !important;
-        font-size: 18px !important;
-        top: 1px !important;
-      }
     }
   }
 }

src/scss/base/_lists.scss

@@ -1,4 +1,5 @@
 @import "flyouts";
 @import 'mebox';
 @import "lists";
-@import "easymde";
+@import "easymde";
+@import "searchbox";

src/scss/base/_messageList.scss

@@ -2,4 +2,43 @@
   .ItemContent {
     margin-left: #{$component-horizontal_padding};
   }
-}
+}
+
+.MessageList.DataList.Comments {
+  .Item-Header.CommentHeader {
+    .DiscussionInfo  {
+      a.ParentCommentLink, a.DiscussionLink {
+        color: $global-blue;
+      }
+    }
+  }
+}
+
+.MessageList {
+  .ItemDiscussion , .ItemComment {
+    .Item-Body {
+      .Controls {
+         a {
+          color: $global-blue;
+         }
+         .MiddleDot{
+           margin: 0px 8px;
+           font-weight: bold;
+         }
+         .left {
+           text-align: left;
+         }
+         .center {
+           text-align: center;
+         }
+
+         .right {
+           text-align: right;
+         }
+       }
+
+    }
+  }
+}
+
+

src/scss/base/_searchBox.scss

@@ -0,0 +1,12 @@
+.SearchForm form > div::after,
+.SearchBox form > div::after {
+  content:  " ";
+  background-image:  url('/themes/topcoder/design/images/icon-search.svg');
+  background-size: cover;
+  position: absolute;
+  margin: 12px 20px;
+  color: $global-color_white !important;
+  height: 16px;
+  width: 16px;
+  display: inline-block;
+}