From e7635b632c915df46fb7fc77e62ef7b2b3af5866 Mon Sep 17 00:00:00 2001
From: Faizaan Gagan <fzngagan@gmail.com>
Date: Wed, 27 Jan 2021 10:48:22 +0530
Subject: [PATCH] added dynamic attributes that can be targetted via css (#67)

---
 assets/javascripts/wizard/helpers/char-counter.js.es6 | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/assets/javascripts/wizard/helpers/char-counter.js.es6 b/assets/javascripts/wizard/helpers/char-counter.js.es6
index c27c0818..6a9bb120 100644
--- a/assets/javascripts/wizard/helpers/char-counter.js.es6
+++ b/assets/javascripts/wizard/helpers/char-counter.js.es6
@@ -6,7 +6,8 @@ export default registerUnbound("char-counter", function(body, maxLength) {
     let finalString;
 
     if (maxLength) {
-       finalString = `<div class="body-length">${bodyLength} / ${I18n.t('wizard.x_characters', { count: parseInt(maxLength) })}</div>`;
+       let isOverMax = bodyLength > maxLength ? "true" : "false";
+       finalString = `<div class="body-length" data-length=${bodyLength} data-over-max=${isOverMax}>${bodyLength} / ${I18n.t('wizard.x_characters', { count: parseInt(maxLength) })}</div>`;
     } else {
        finalString = `<div class="body-length">${I18n.t('wizard.x_characters', { count: parseInt(bodyLength) })}</div>`;
     }