From 30f4feff4850ffba30e8734dc32b0de0e352f8a6 Mon Sep 17 00:00:00 2001
From: Andrew Sliwinski <andrewsliwinski@acm.org>
Date: Fri, 4 Dec 2015 10:41:25 -0500
Subject: [PATCH] Hotfix for HOC legal notices

---
 en.json                |  4 ++--
 src/main.scss          |  4 ++++
 src/views/hoc/hoc.jsx  | 15 ++++++++++++++-
 src/views/hoc/hoc.scss |  4 ++++
 4 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/en.json b/en.json
index 19dd560e5..c0575ca26 100644
--- a/en.json
+++ b/en.json
@@ -50,7 +50,7 @@
     "footer.scratchFamily": "Scratch Family",
     "hoc.activityCards": "Activity Cards",
     "hoc.activityCardsHeader": "Activity Cards and Guides",
-    "hoc.activityCardsInfo1": "Want tips and ideas for these Hour of Code activities? Use the activity cards to get ideas for creating with Scratch. Facilitator guides can help you plan a group activity.",
+    "hoc.activityCardsInfo1": "Want tips and ideas for these Hour of Code&trade; activities? Use the activity cards to get ideas for creating with Scratch. Facilitator guides can help you plan a group activity.",
     "hoc.addToStudios": "Add Your Projects to Studios",
     "hoc.addToStudiosDescription": "These studios include projects created by young people around the world. Take a look at the studios to get inspired - or submit your own projects to the studios!",
     "hoc.facilitatorGuide": "Facilitator Guide",
@@ -93,4 +93,4 @@
     "welcome.learn": "Learn how to make a project in Scratch",
     "welcome.tryOut": "Try out starter projects",
     "welcome.connect": "Connect with other Scratchers"
-}
\ No newline at end of file
+}
diff --git a/src/main.scss b/src/main.scss
index 9f4666247..b65a6fbee 100644
--- a/src/main.scss
+++ b/src/main.scss
@@ -35,6 +35,10 @@ h4 {
     font-size: 1.0rem;
 }
 
+p.legal {
+    font-size: .8rem;
+}
+
 /* Links */
 a {
     white-space: nowrap;
diff --git a/src/views/hoc/hoc.jsx b/src/views/hoc/hoc.jsx
index c2f844eea..586e78e89 100644
--- a/src/views/hoc/hoc.jsx
+++ b/src/views/hoc/hoc.jsx
@@ -133,7 +133,7 @@ var Hoc = React.createClass({
                                     <FormattedHTMLMessage
                                         id='hoc.activityCardsInfo1'
                                         defaultMessage={
-                                            'Want tips and ideas for these Hour of Code activities? ' +
+                                            'Want tips and ideas for these Hour of Code&trade; activities? ' +
                                             'Use the activity cards to get ideas for creating with ' +
                                             'Scratch. Facilitator guides can help you plan ' +
                                             'a group activity.'
@@ -380,6 +380,19 @@ var Hoc = React.createClass({
                                 <img src="/images/hoc2015/pocketcode-logo.png" />
                             </a>
                         </div>
+
+                        <div className="trademark">
+                            <p className="legal">
+                                <FormattedHTMLMessage
+                                    id='hoc.officialNotice'
+                                    defaultMessage={
+                                        'The "Hour of Code&trade;" is a nationwide initiative by ' +
+                                        '<a href="http://csedweek.org">Computer Science Education Week</a> ' +
+                                        'and <a href="http://code.org">Code.org</a> to introduce millions of ' +
+                                        'students to one hour of computer science and computer programming.'
+                                    } />
+                            </p>
+                        </div>
                     </section>
                 </div>
             </div>
diff --git a/src/views/hoc/hoc.scss b/src/views/hoc/hoc.scss
index b4089d0ec..8d5e977c7 100644
--- a/src/views/hoc/hoc.scss
+++ b/src/views/hoc/hoc.scss
@@ -250,4 +250,8 @@ $base-bg: $ui-white;
             vertical-align: middle;
         }
     }
+
+    .trademark {
+        margin-top: 20px;
+    }
 }