modified question.html prototype layout

Philip Guo · Philip Guo · commit 0d4acfeb624e · 2011-09-26T23:01:42.000-04:00
diff --git a/edu-python-questions.css b/edu-python-questions.css
@@ -22,6 +22,11 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 /* styles for Online Python Tutor questions site */
 
 #questionsHeaderPane {
-  text-align: center;
-  margin-bottom: 30px;
+  text-align: left;
+  margin-bottom: 10px;
+  width: 650px;
+}
+
+.questionsHeaderStmt {
+  margin-bottom: 5px;
 }
diff --git a/question.html b/question.html
@@ -54,24 +54,37 @@
 <body>
 
 
+<center>
+
 <div id="questionsHeaderPane">
 
-<div id="ProblemStatement"><b>Problem</b>: Write a function that
+<div class="questionsHeaderStmt" id="ProblemStatement"><b>Problem</b>: Write a function that
 reverses a list in-place.</div>
 
-<div id="HintStatement"><a href="#" id="showHintHref">Show hint</a></div>
+<div class="questionsHeaderStmt" id="ExampleStatement"><b>Example</b>: A list [INSERT LIST DIAGRAM]
+should be mutate to look like [INSERT LIST DIAGRAM]</div>
+
+<div class="questionsHeaderStmt" id="HintStatement"><a href="#" id="showHintHref">Show hint</a></div>
 
-<div id="SolutionStatement"><a href="#" id="showSolutionHref">Show solution</a></div>
+<div class="questionsHeaderStmt" id="SolutionStatement"><a href="#" id="showSolutionHref">Show solution</a></div>
 
 </div>
 
+</center>
+
 
 <div id="pyInputPane">
 
-<textarea id="pyInput" cols="55" rows="20" wrap="off"></textarea>
+<textarea id="pyInput" cols="60" rows="18" wrap="off">
+def reverse(lst):
+    # fill in your code here
+</textarea>
 
 <p/>Test code:<br/>
-<textarea id="pyInput" cols="55" rows="4" wrap="off"></textarea>
+<textarea id="pyInput" cols="60" rows="4" wrap="off">
+input = ['a', 'b', 'c', 'd', 'e']
+reverse(input)
+</textarea>
 
 <p>
 
