_yohandeschamps_ Posted February 18 Posted February 18 (edited) Hello I kinda need some code to style my form, located in the additional info product. The form opens in Lightbox. I want the background black, the field white with no hover, and the title and text in white. I can not control this primary button; I am getting a dark blue colour on hover. Any help will be appreciated. You can find the button on this page: https://www.yodeschamps.com/image-licensing/p/road-to-infinity Thank you Edited February 18 by _yohandeschamps_ Correct a typing mistake
Solution justin.mabee Posted February 18 Solution Posted February 18 If you click on the form block, then Design, and then Edit Form Styles, from there you can customize all of the form styles. But this may not translate to the lightbox form, so try this out. Obviously change the fonts or remove the font lines entirely if you don't need them, same with text-transforms. //Lightbox Form// .sqs-modal-lightbox-content .lightbox-inner .lightbox-content { background: #090b09 !important; border: 1px solid #e7e64d; } .sqs-modal-lightbox-content .lightbox-inner .lightbox-content .lightbox-close { color: #e7e64d; } .sqs-modal-lightbox-content .lightbox-inner .lightbox-content .form-wrapper .form-title { font-family: 'Quantify Bold'; text-transform: uppercase; color: white; } .form-wrapper .field-list .title, .form-wrapper .field-list .field .caption { font-family: 'Nexa Bold'; text-transform: uppercase; color: white !important; } .sqs-modal-lightbox .sqs-modal-lightbox-content .sqs-button-element--primary { background-color: #e7e64d; color: black; font-family: 'Nexa Bold'; } .form-wrapper .react-form-contents .field-list .fields .description.required, .form-wrapper .react-form-contents .field-list .description.required, .form-wrapper .react-form-contents .field-list p.description, .form-wrapper .react-form-contents .field-list .caption-text:not(:empty) { font-family: 'Nexa Bold'; color: white; } .sqs-modal-lightbox-content .lightbox-inner .lightbox-content .form-wrapper { background-color: black; }
_yohandeschamps_ Posted February 19 Author Posted February 19 Thanks, Justin; I used some of your code and then added more code to polish it. So I got the result I wanted.
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment