Any ideas on how to make my font size smaller and/or making other stylistic changes to the GDPR language used in forms? Here is an example page view:
https://www.logicbay.com/the-roi-of-partner-relationship-management-0?hs_preview=QWsjScgn-5957151985
Thanks!
Seth
You could add the CSS rules to your css file.
for the main text in the GDPR section, you would add styles to this block
.legal-consent-container p {
font-size:25px;
/* more styles go here */
}
and to adjust the checkbox labels, you could use the following CSS block
.legal-consent-container label {
font-size:25px;
/* more styles go here */
}
If this answer helped, please, mark as solved 
tim@belch.io | forms.belch.io | Design your own Beautiful HubSpot Forms; No coding necessary.
Drop by and say Hi to me on slack.
@tjoyce I have a minor problem with these GDPR texts, especially in our pop-up forms. I’ve tried the codes above, as well as .legal-consent-container .hs-richtext and some other tests, but the texts behave differently. Right now, my Process Consent Text (which is the 2nd text) for some reason has a different styling than the communications consent before, and the privacy text after.
Bonus question: if I would like to style every text and label separately, how would I do that? Is it possible at all? I tried :nth-child(2) etc but that didn’t seem to do anything
The contact us pop-up form I’m working on can be found in the footer of any page at www.prometheusone.io
Okay, I got the Consent text to behave by going to edit the form itself, and there clearing the formating of consent text. Don’t know why that worked, since there are no options to format the text there (other than Bold, Italic etc) at all.
But still, is there a way to target individual texts and labels?
So I got the container P to change text size but I can’t get the label to change size. I used the code you gave but it doesn’t work? Any thoughts?
Here’s how I solved it for our forms:
Hope it helps.
.legal-consent-container p {
font-size:13px;
}
.legal-consent-container {
font-size:13px;
}
.legal-consent-container ul {
line-height: 13px;
}
.legal-consent-container .hs_cos_wrapper_type_form ul.inputs-list li label {
font-size:13px!important;
}
.legal-consent-container .hs-form-booleancheckbox-display {
font-size:13px!important;
}
Hi,
I added the legal-consent-container styling from Brandsensations as a stylesheet to all my landing pages, and it worked for the process consent text, but not the consent to communicate checkbox label or the privacy text.
I’m not very familiar with CSS, but are there other classes I can use to style the checkbox label and privacy text?
Here is the page I’m testing it on:
https://go.quantummetric.com/fullstory-0?hs_preview=tGFBEgsk-18072011301
Thanks!
EDIT: It looks like this is only an issue with this landing page template, because it works for another one I’m testing on: https://go.quantummetric.com/blackfriday-ebook-1?hs_preview=SRXBNLpD-18073298858
I assume this means there is something else overriding it within the first landing page?
@evelliQM - Can you change the order of the CSS files?
Put the Legal_Consent_Formatting.css last in the list… right now it’s first
To anyone else that finds themselves trying to style GDPR toggles in their forms, I created a module that will convert them to switches.
DEMO: https://offers.belch.io/gdpr-material-switches-hubspot-cms-code-gallery
All you have to do is create a custom module and place the necessary code from the code gallery and it will find any form in the template / page and convert the checkboxes to toggles. The module itself does not contain the form, which keeps it dynamic and just an embeddable module that can exist in the template and just wait for a form to be added. It will ignore pages that don’t have forms as well.
You can checkout other modules related to forms like better checkboxes, radio buttons and inputs
If this answer helped, please, mark as solved
tim@belch.io | forms.belch.io | Design your own Beautiful HubSpot Forms; No coding necessary.
Drop by and say Hi to me on slack.
Hey @tjoyce unfortunately that didn’t fix it, but thank you for the suggestion. I think it’s something else within one of the other stylesheets, or perhaps a setting within the LP template?
Doesn’t work:
.legal-consent-container {
line-height: 10px !important;
}
.hs-richtext {
line-height: 10px !important;
}
Tried the above and about 20 different combinations of everything suggested on these 3 Hubspot threads:
… and nothing works. I just want to reduce the line height. Anyone have any new ideas? I feel like customization of forms has been a challenge for years. Even simple stuff like this. 