[Fix #8] Fix collapse/expand dynamics of sections

kbss-cvut · Dec 8, 2021 · 93fabb9 · 93fabb9
1 parent 290cc41
commit 93fabb9
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 11 deletions.
diff --git a/src/components/SectionComponent.jsx b/src/components/SectionComponent.jsx
@@ -12,10 +12,14 @@ export default class SectionComponent extends Question {
   constructor(props) {
     super(props);
 
-    const toggleCollapseSuper = this._toggleCollapse;
-    this._toggleCollapse = (e) => {
+    const toggleCollapseSuper = this.toggleCollapse;
+    this.toggleCollapse = (e) => {
       let classList = e.target.classList;
-      if (!classList.contains('answer-content') && !classList.contains('card-header')) {
+      if (!classList.contains('answer-content') && !classList.contains('card-header')
+        && !classList.contains('answer') && !classList.contains('show-advanced-switch')
+        && !classList.contains('d-inline') && !classList.contains('caret-square-down')
+        && !(classList.length === 0)
+      ) {
         return;
       }
       toggleCollapseSuper();
@@ -44,12 +48,11 @@ export default class SectionComponent extends Question {
     );
   }
 
-  _renderQuestionHelp() {
+  renderHeaderExtension() {
     return (
       <>
-        {super._renderQuestionHelp()}
         {this._renderIdentifierText()}
-        {this._renderShowAdvanced()}
+        {this.state.expanded && this._renderShowAdvanced()}
       </>
     );
   }

diff --git a/src/styles/components.css b/src/styles/components.css
@@ -109,18 +109,14 @@
     display: inline-block;
     text-align: center;
     pointer-events: none;
-    margin-left: 30px;
+    margin-left: 6px;
     color: #535353;
 }
 
 .text-white .section-identifier {
     color: white;
 }
 
-.answer-content .section-identifier {
-    margin-left: 6px;
-}
-
 .card-header .answer-content .form-group {
     display: inline-block;
 }