From 76c7c6384df71038f34567d9f7b2c8b5a40a7162 Mon Sep 17 00:00:00 2001
From: MathuraMG <mmg9291@gmail.com>
Date: Fri, 19 Aug 2016 15:51:41 -0400
Subject: [PATCH] add subtitle

---
 client/modules/IDE/components/Preferences.js | 3 ++-
 client/styles/components/_preferences.scss   | 7 +++++++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/client/modules/IDE/components/Preferences.js b/client/modules/IDE/components/Preferences.js
index 7043d417..a705a098 100644
--- a/client/modules/IDE/components/Preferences.js
+++ b/client/modules/IDE/components/Preferences.js
@@ -178,7 +178,8 @@ class Preferences extends React.Component {
           </div>
         </div>
         <div className="preference">
-          <h4 className="preference__title">Hidden Text Output</h4>
+          <h4 className="preference__title">Accessible Text-based Canvas</h4>
+          <h6 className="preference__subtitle">Used with screen reader</h6>
           <div className="preference__options">
             <button
               className={textOutputOnClass}
diff --git a/client/styles/components/_preferences.scss b/client/styles/components/_preferences.scss
index 1152a26a..06ca4b70 100644
--- a/client/styles/components/_preferences.scss
+++ b/client/styles/components/_preferences.scss
@@ -46,6 +46,13 @@
 	margin-bottom: #{10 / $base-font-size}rem;
 }
 
+.preference__subtitle {
+	width: 100%;
+	margin-bottom: #{10 / $base-font-size}rem;
+	margin-top: 0;
+	color: $light-inactive-text-color;
+}
+
 .preference__value {
 	border: 2px solid $light-button-border-color;
 	text-align: center;