diff --git a/services/web/app/views/project/editor/pdf.jade b/services/web/app/views/project/editor/pdf.jade index 75255dd914..8c9c0f434c 100644 --- a/services/web/app/views/project/editor/pdf.jade +++ b/services/web/app/views/project/editor/pdf.jade @@ -148,10 +148,8 @@ div.full-size.pdf(ng-controller="PdfController") ng-click="trackLogHintsNegativeFeedback(entry.ruleId); showNegFeedbackUI = true;" href ) #{translate("answer_no")} - .card-hint-extra-feedback( - ng-show="showNegFeedbackUI && !feedbackSent" - ) - p Can you help us understand why this hint wasn't helpful? + .card-hint-extra-feedback(ng-hide="!showNegFeedbackUI || feedbackSent") + p.card-hint-extra-feedback-label Can you help us understand why this hint wasn't helpful? .radio: label input( type="radio" @@ -165,14 +163,14 @@ div.full-size.pdf(ng-controller="PdfController") ng-model="negFeedbackReason" value="not_applicable" ) - | I couldn’t apply it to my document + | I can’t apply this solution to my document .radio: label input( type="radio" ng-model="negFeedbackReason" value="incorrect" ) - | I don’t think this is correct + | This doesn’t fix the error .radio: label input( type="radio" diff --git a/services/web/public/stylesheets/app/editor/pdf.less b/services/web/public/stylesheets/app/editor/pdf.less index 3f3cf68707..2183798650 100644 --- a/services/web/public/stylesheets/app/editor/pdf.less +++ b/services/web/public/stylesheets/app/editor/pdf.less @@ -203,6 +203,17 @@ white-space: nowrap; } + +@keyframes expand-feedback-area { + from { + max-height: 0; + } + + to { + max-height: 500px; + } +} + .card-hint:extend(.card-thin) { margin-top: 10px; padding-bottom: 7px; @@ -283,9 +294,16 @@ &-extra-feedback { color: @gray-dark; font-size: 0.8rem; - border-top: solid 1px @gray-lighter; margin-top: 10px; - padding: 5px; + padding-bottom: 5px; + animation: 0.5s ease-out expand-feedback-area; + overflow: hidden; + + &-label { + margin: 5px 0 10px; + padding-top: 5px; + border-top: solid 1px @gray-lighter; + } .radio { margin: 5px;