From 2ed7394f276e081502d346dc1acb051182919e4d Mon Sep 17 00:00:00 2001
From: Arthur Barrett <abarrett@edx.org>
Date: Tue, 5 Mar 2013 23:44:35 -0500
Subject: [PATCH] visually distinguish instructions from guided discussion
 section

---
 common/lib/xmodule/xmodule/css/annotatable/display.scss | 2 ++
 lms/templates/annotatable.html                          | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/common/lib/xmodule/xmodule/css/annotatable/display.scss b/common/lib/xmodule/xmodule/css/annotatable/display.scss
index 2db3b85e66..a8d7032e53 100644
--- a/common/lib/xmodule/xmodule/css/annotatable/display.scss
+++ b/common/lib/xmodule/xmodule/css/annotatable/display.scss
@@ -17,6 +17,8 @@ $body-font-size: em(14);
   border-radius: .5em;
   margin-bottom: .5em;
 
+  &.shaded { background-color: #EDEDED; }
+
   .annotatable-section-title {
     font-weight: bold;
     a { font-weight: normal; }
diff --git a/lms/templates/annotatable.html b/lms/templates/annotatable.html
index af872b8c95..f010305744 100644
--- a/lms/templates/annotatable.html
+++ b/lms/templates/annotatable.html
@@ -6,7 +6,7 @@
     </div>
 
     % if instructions_html is not UNDEFINED and instructions_html is not None:
-    <div class="annotatable-section">
+    <div class="annotatable-section shaded">
         <div class="annotatable-section-title">
             Instructions
             <a class="annotatable-toggle annotatable-toggle-instructions expanded" href="javascript:void(0)">Collapse Instructions</a>