[#1879] Hide "exceed" input when not in use

akvo · Nov 3, 2015 · 231904a · 231904a
1 parent 12ca61d
commit 231904a
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 2 deletions.
diff --git a/akvo/rsr/static/scripts-src/project-main.js b/akvo/rsr/static/scripts-src/project-main.js
@@ -1546,6 +1546,7 @@ if (firstAccordionChild !== null) {
     exceedTargetNewValue.setAttribute('type', 'number');
     exceedTargetNewValue.setAttribute('disabled', '');
     exceedTargetNewValue.classList.add('exceed-value');
+    exceedTargetNewValue.classList.add('opacity-transition');
 
     exceedTargetNewValue.addEventListener('input', function () {
       if (exceedTargetCheckbox.checked) {

diff --git a/akvo/rsr/static/scripts-src/project-main.jsx b/akvo/rsr/static/scripts-src/project-main.jsx
@@ -1546,6 +1546,7 @@ if (firstAccordionChild !== null) {
     exceedTargetNewValue.setAttribute('type', 'number');
     exceedTargetNewValue.setAttribute('disabled', '');
     exceedTargetNewValue.classList.add('exceed-value');
+    exceedTargetNewValue.classList.add('opacity-transition');
 
     exceedTargetNewValue.addEventListener('input', function () {
       if (exceedTargetCheckbox.checked) {

diff --git a/akvo/rsr/static/styles-src/main.css b/akvo/rsr/static/styles-src/main.css
@@ -2427,11 +2427,15 @@ body.translationBarActive div.skiptranslate ~ article, body.translationBarActive
       .results .update-dialog-container td .update-entry-container .update-exceed-target {
         margin: 2em 0 0 0;
         text-align: right; }
+        .results .update-dialog-container td .update-entry-container .update-exceed-target input.exceed-value {
+          opacity: 0; }
         .results .update-dialog-container td .update-entry-container .update-exceed-target label {
           margin-right: 10px;
           color: rgba(32, 32, 36, 0.5); }
         .results .update-dialog-container td .update-entry-container .update-exceed-target .update-exceed-target-checkbox {
           margin-right: 10px; }
+          .results .update-dialog-container td .update-entry-container .update-exceed-target .update-exceed-target-checkbox:checked ~ input.exceed-value {
+            opacity: 1; }
       .results .update-dialog-container td .update-entry-container .indicator-bar-display-container {
         position: relative;
         height: 100%;

diff --git a/akvo/rsr/static/styles-src/main.scss b/akvo/rsr/static/styles-src/main.scss
@@ -3110,15 +3110,21 @@ body {
                 .update-exceed-target {
                     margin: 2em 0 0 0;
                     text-align: right;
-                    input {
-
+                    input.exceed-value {
+                        opacity: 0;
                     }
                     label {
                         margin-right: 10px;
                         color: rgba($akvoBlack, 0.5);
                     }
                     .update-exceed-target-checkbox {
                         margin-right: 10px;
+
+                        &:checked {
+                            ~ input.exceed-value {
+                                opacity: 1;
+                            }
+                        }
                     }
                 }
                 .indicator-bar-display-container {