[tor-commits] [nyx/master] Avoid need for a wrapper 'answer_container'

[atagar at torproject.org]

commit 45daf4ad0fda25e7d12a148a608e0d452b615b39
Author: Damian Johnson <atagar at torproject.org>
Date:   Thu Jul 27 20:57:51 2017 -0700

    Avoid need for a wrapper 'answer_container'
---
 web/index.html | 17 +++++++++++------
 web/styles.css | 29 ++++++++++++++++-------------
 2 files changed, 27 insertions(+), 19 deletions(-)

diff --git a/web/index.html b/web/index.html
index f8710ed..75ff1e6 100644
--- a/web/index.html
+++ b/web/index.html
@@ -95,15 +95,15 @@
 
         <div class="question" id="question_1">
           <span>Demo question 1</span>
-          <div class="answer_container">
-            <div class="answer">answer 1</div>
+          <div class="answer">
+            <p>answer 1</p>
           </div>
         </div>
 
         <div class="question" id="question_2">
           <span>Demo question 2</span>
-          <div class="answer_container">
-            <div class="answer">answer 2</div>
+          <div class="answer">
+            <p>answer 2</p>
           </div>
         </div>
       </div>
@@ -206,13 +206,18 @@
       // show/hide for FAQ questions
 
       $('.question').click(function() {
-        var answer = $(this).find('.answer_container');
+        var answer = $(this).find('.answer');
 
         if (answer.is('.open')) {
           answer.animate({'height': '0'}, 100);
           answer.removeClass('open');
         } else {
-          var newHeight = $(this).find('.answer').height() + 'px';
+          var newHeight = 0;
+
+          answer.children().each(function () {
+            newHeight += $(this).outerHeight(true);
+          });
+
           answer.animate({'height': newHeight}, 100);
           answer.addClass('open');
          }
diff --git a/web/styles.css b/web/styles.css
index 7e6a10c..fcd0510 100644
--- a/web/styles.css
+++ b/web/styles.css
@@ -155,19 +155,22 @@ FAQ Page
 ============================================================*/
 
 .question {
-    color: #523a17;
-    cursor: pointer;
-    font-size: 24px;
-    font-weight: bold;
-    margin: 0px;
-    padding: 0px 0px 5px 0px;
-    text-align: left;
-}
-
-.answer_container {
-    height: 0px;
-    overflow: hidden;
-    padding: 0px;
+  cursor: pointer;
+  margin: 0px;
+  padding: 0px 0px 5px 0px;
+  text-align: left;
+}
+
+.question span {
+  color: #523a17;
+  font-size: 24px;
+  font-weight: bold;
+}
+
+.answer {
+  height: 0px;
+  overflow: hidden;
+  padding: 0px;
 }
 
 /*============================================================