From c4eec80e5ea4b6091c5fa9c9f8674618baa5cb8a Mon Sep 17 00:00:00 2001
From: Ibrahim Awwal <ibrahim.awwal@gmail.com>
Date: Tue, 4 Sep 2012 02:32:38 -0700
Subject: [PATCH] Somewhat compacted the embedded thread view, but it probably
 needs a more thorough redesign.

---
 lms/static/sass/_discussion.scss              | 94 ++++++++++++++-----
 .../mustache/_inline_discussion.mustache      |  2 +-
 2 files changed, 71 insertions(+), 25 deletions(-)

diff --git a/lms/static/sass/_discussion.scss b/lms/static/sass/_discussion.scss
index 0df6eceb85..f94e1958b5 100644
--- a/lms/static/sass/_discussion.scss
+++ b/lms/static/sass/_discussion.scss
@@ -60,7 +60,7 @@
   border: 1px solid #aaa;
   border-top: none;
   border-radius: 0 0 3px 3px;
-  background: #eee;    
+  background: #eee;
   color: #333;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
 }
@@ -82,7 +82,7 @@
 
 .wmd-button-bar  {
   width: 100%;
-  background-color: Silver; 
+  background-color: Silver;
 }
 
 .wmd-input {
@@ -129,25 +129,25 @@
 }
 
 .wmd-button-row {
-  position: relative; 
+  position: relative;
   margin-left: 5px;
   margin-right: 5px;
   margin-bottom: 5px;
   margin-top: 10px;
-  padding: 0px;  
+  padding: 0px;
   height: 20px;
   overflow: hidden;
   @include transition(all, .2s, easeOut);
 }
 
 .wmd-spacer {
-  width: 1px; 
-  height: 20px; 
+  width: 1px;
+  height: 20px;
   margin-left: 14px;
-  
+
   position: absolute;
   background-color: Silver;
-  display: inline-block; 
+  display: inline-block;
   list-style: none;
 }
 
@@ -301,7 +301,7 @@ body.discussion {
           border-top: 1px solid #5f5f5f;
           font-size: 14px;
           font-weight: 700;
-          color: #eee;        
+          color: #eee;
 
           &:hover {
             background-color: #666;
@@ -332,7 +332,7 @@ body.discussion {
         width: 100%;
         height: 30px;
         padding: 0 15px;
-        box-sizing: border-box;   
+        box-sizing: border-box;
         border-radius: 30px;
         border: 1px solid #333;
         box-shadow: 0 1px 3px rgba(0, 0, 0, .25) inset;
@@ -392,7 +392,7 @@ body.discussion {
       box-sizing: border-box;
       border: 1px solid #333;
       border-radius: 0 0 3px 3px;
-      background: #e6e6e6;    
+      background: #e6e6e6;
       color: #333;
       box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset;
     }
@@ -400,10 +400,10 @@ body.discussion {
     .new-post-preview-label {
       position: absolute;
       top: 4px;
-      left: 4px;    
+      left: 4px;
       font-size: 11px;
       color: #aaa;
-      text-transform: uppercase;    
+      text-transform: uppercase;
     }
 
     .new-post-title,
@@ -468,7 +468,7 @@ body.discussion {
     color: #333;
     background: #c5eeff;
     border: 1px solid #90c4d7;
-    font-size: 13px;  
+    font-size: 13px;
   }
 
   .thread-title {
@@ -478,7 +478,7 @@ body.discussion {
     color: #333;
     font-weight: 700;
   }
-  
+
 
 
 
@@ -567,7 +567,7 @@ body.discussion {
     height: 60px;
     border-bottom: 1px solid #a3a3a3;
     border-radius: 3px 0 0 0;
-    
+
 
     .browse,
     .search {
@@ -762,7 +762,7 @@ body.discussion {
       width: 100%;
       height: 30px;
       padding: 0 15px;
-      box-sizing: border-box;   
+      box-sizing: border-box;
       border-radius: 30px;
       border: 1px solid #333;
       box-shadow: 0 1px 3px rgba(0, 0, 0, .25) inset;
@@ -929,7 +929,7 @@ body.discussion {
         box-shadow: 0 1px 0 #4697c1, 0 -1px 0 #4697c1;
 
         .title {
-          color: #333;  
+          color: #333;
         }
 
         .votes-count,
@@ -1077,7 +1077,7 @@ body.discussion {
   .responses {
     list-style: none;
     margin-top: 40px;
-    padding: 0;    
+    padding: 0;
 
     > li {
       position: relative;
@@ -1230,8 +1230,8 @@ body.discussion {
       background: #009FE2;
       font-size: 9px;
       font-weight: 700;
-      font-style: normal;   
-      color: white;   
+      font-style: normal;
+      color: white;
       text-transform: uppercase;
     }
 
@@ -1386,7 +1386,7 @@ body.discussion {
   }
 
   #wmd-input {
-    @include discussion-wmd-input; 
+    @include discussion-wmd-input;
   }
 
   #wmd-preview {
@@ -1418,7 +1418,53 @@ body.discussion {
 
 /* For some reason I have to do this to get the SCSS to compile, can't stick it under the above .discussion-module */
 .discussion-module {
-  .discussion-reply-new {
-    display:none
+  section.discussion {
+    /* Course content p has a default margin-bottom of 1.416, this is just to reset that */
+
+    .discussion-thread {
+      padding: 0.5em;
+
+      p {
+        margin-bottom: 0em;
+      }
+      .discussion-article {
+        border: 1px solid;
+        border-radius: 3px;
+        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
+
+        .discussion-post {
+          header {
+            padding-bottom: 0.1em;
+            margin-bottom: 10px;
+
+          }
+          .post-body {
+            font-size: 14px;
+          }
+        }
+
+        .responses {
+          margin-top: 10px;
+
+          header {
+            padding-bottom: 0em;
+            margin-bottom: 5px;
+            .posted-by {
+              font-size: 0.8em;
+            }
+          }
+          .response-body {
+            margin-bottom: 0.2em;
+            font-size: 14px;
+          }
+
+        }
+      }
+    }
   }
+
+  .discussion-reply-new {
+    display:none;
+  }
+
 }
diff --git a/lms/templates/discussion/mustache/_inline_discussion.mustache b/lms/templates/discussion/mustache/_inline_discussion.mustache
index eb8f12af43..f82b3810e5 100644
--- a/lms/templates/discussion/mustache/_inline_discussion.mustache
+++ b/lms/templates/discussion/mustache/_inline_discussion.mustache
@@ -1,6 +1,6 @@
 <section class="discussion">
   {{#threads}}
-    <article class="discussion-article" data-id="{{id}}" id="thread_{{id}}">
+    <article class="discussion-thread" id="thread_{{id}}">
     </article>
   {{/threads}}
 </section>