How many characters does form button input attributes accepts?

General Discussion
11

I see, unfortunately you need to workaround the field size limitation, the best way would be to write a css class, and you can inject that class in different ways: a mautic form theme, directly on the page you will insert the form or either in a HTML field inside the mautic form, where you can open a <style> tag.

now, since you are using the tailwindCss, if you want to use that utility styles in you css, you would have to write the class with tailwindCSS, run the pre-processor, and attach the output css.

another workaround would be to run a script after the page is load and add the utility classes you need dynamically, something like:

 document.addEventListener("DOMContentLoaded", function(e) {
    const allMyClasses = "w-[150px] sm:w-[205px] h-[40px] sm:h-[56px] text-center rounded-full text-xs sm:text-lg text-[#8B3C3A] border-2 solid border-[#8B3C3A] font-semibold uppercase font-twk-lausanne hover:bg-[#8B3C3A] hover:text-white transition duration-500 ease-in-out my-3 sm:my-6".split(" ");
                    const myButton = document.querySelector('button[name="mauticform[submit]"][type="submit"]' )
allMyClasses.forEach( className => { myButton.classList.add(className) ; } );
                });
1 Like