From 5807737aea56cc0e57eb5911788ca2edf1967e83 Mon Sep 17 00:00:00 2001
From: Greg Wilson <gvwilson@third-bit.com>
Date: Tue, 24 May 2016 14:09:47 -0400
Subject: [PATCH] Showing how to use  elements for challenges

---
 _episodes/04-divs.md   | 33 +++++++++++++++++++++++++++++++++
 assets/css/lesson.scss |  1 +
 2 files changed, 34 insertions(+)
 create mode 100644 _episodes/04-divs.md

diff --git a/_episodes/04-divs.md b/_episodes/04-divs.md
new file mode 100644
index 0000000..731a96c
--- /dev/null
+++ b/_episodes/04-divs.md
@@ -0,0 +1,33 @@
+---
+title: "Using Divs"
+teaching: 5
+exercises: 0
+questions:
+- "Should we use div instead of blockquote for challenge?"
+objectives:
+- "Show the differences between divs and blockquotes for challenges."
+keypoints:
+- "The CSS changes are surprisingly small."
+---
+This is a challenge formatted using a `div`:
+
+<div class="challenge" markdown="1">
+
+## Challenge Title as H2
+
+This is the text explaining the challenge.
+
+~~~
+this code
+is part of
+the challenge
+~~~
+{: .source}
+
+> ## Solution
+>
+> We can put the solution(s) in blockquotes inside the `div`.
+> Or we could define yet another `div`.
+{: .solution}
+
+</div>
diff --git a/assets/css/lesson.scss b/assets/css/lesson.scss
index 1b89d56..1cd011f 100644
--- a/assets/css/lesson.scss
+++ b/assets/css/lesson.scss
@@ -75,6 +75,7 @@ $codeblock-padding: 5px !default;
 .keypoints{ @include bkSetup(#682047, "\e101"); }
 .objectives{ @include bkSetup(#667932, "\e085"); }
 .prereq{ @include bkSetup(#BD6F7A, "\e124"); }
+.solution{ @include bkSetup(#F5A9A9, "\e105"); }
 .testimonial{ @include bkSetup(#C0A92A, "\e143"); }
 
 //----------------------------------------
-- 
GitLab