diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_contact-form.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_contact-form.scss index fbfe2095c..a0c437de8 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_contact-form.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_contact-form.scss @@ -49,6 +49,10 @@ } fieldset { + .input .hs-input { + width: 100%; + } + &.form-columns-1:has(> .legal-consent-container) { width: auto; margin-bottom: 0; @@ -96,4 +100,17 @@ @include media-breakpoint-up(xl) { padding: $spacer * 3 $spacer * 2.5; } + + .input ul { + padding-left: 0; + li { + list-style: none; + } + } + + #Legit-interest-text-legal-disclaimer, + #explicit-text-legal-disclaimer { + font-size: pxToRem(12); + line-height: pxToRem(18); + } } diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_hubspot-form.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_hubspot-form.scss index 1c15607ce..146944b97 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_hubspot-form.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_hubspot-form.scss @@ -64,7 +64,7 @@ form.hs-form { // todo: this may be removed once the form is updated // this hides an original HubSpot form header - &.form-columns-0 { + &.form-columns-0:first-child { margin: 0; .hs-richtext { display: none !important; @@ -157,48 +157,49 @@ form.hs-form { } } + .hs-form-booleancheckbox-display, + .hs-form-checkbox-display { + display: flex; + align-items: center; + + input[type='checkbox'] { + width: 1.2rem; + height: 1rem; + aspect-ratio: 1/1; + background-color: transparent; + border: 1px solid $neutral-40; + border-radius: 4px; + outline: none; + appearance: none; + padding: 0; + margin-right: pxToRem(8); + + &:checked { + border-color: $neutral-100; + background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NDggNTEyIj48IS0tIUZvbnQgQXdlc29tZSBGcmVlIDYuNi4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlL2ZyZWUgQ29weXJpZ2h0IDIwMjQgRm9udGljb25zLCBJbmMuLS0+PHBhdGggZmlsbD0iI2YwZjJmOSIgZD0iTTQzOC42IDEwNS40YzEyLjUgMTIuNSAxMi41IDMyLjggMCA0NS4zbC0yNTYgMjU2Yy0xMi41IDEyLjUtMzIuOCAxMi41LTQ1LjMgMGwtMTI4LTEyOGMtMTIuNS0xMi41LTEyLjUtMzIuOCAwLTQ1LjNzMzIuOC0xMi41IDQ1LjMgMEwxNjAgMzM4LjcgMzkzLjQgMTA1LjRjMTIuNS0xMi41IDMyLjgtMTIuNSA0NS4zIDB6Ii8+PC9zdmc+'); + background-repeat: no-repeat; + background-position: center; + } + + &:focus { + border: 1px solid $neutral-100; + } + } + } .legal-consent-container { - p, & div { + p, + div, + span, + .hs-form-booleancheckbox-display { font-size: pxToRem(12); line-height: pxToRem(18); color: $neutral-60; - margin-bottom: pxToRem(8); a { color: $neutral-80; font-weight: 600; } } - .hs-form-booleancheckbox-display { - display: flex; - align-items: center; - - input[type='checkbox'] { - width: 1.2rem; - height: 1rem; - aspect-ratio: 1/1; - background-color: transparent; - border: 1px solid $neutral-40; - border-radius: 4px; - outline: none; - appearance: none; - padding: 0; - - &:checked { - border-color: $neutral-100; - background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NDggNTEyIj48IS0tIUZvbnQgQXdlc29tZSBGcmVlIDYuNi4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlL2ZyZWUgQ29weXJpZ2h0IDIwMjQgRm9udGljb25zLCBJbmMuLS0+PHBhdGggZmlsbD0iI2YwZjJmOSIgZD0iTTQzOC42IDEwNS40YzEyLjUgMTIuNSAxMi41IDMyLjggMCA0NS4zbC0yNTYgMjU2Yy0xMi41IDEyLjUtMzIuOCAxMi41LTQ1LjMgMGwtMTI4LTEyOGMtMTIuNS0xMi41LTEyLjUtMzIuOCAwLTQ1LjNzMzIuOC0xMi41IDQ1LjMgMEwxNjAgMzM4LjcgMzkzLjQgMTA1LjRjMTIuNS0xMi41IDMyLjgtMTIuNSA0NS4zIDB6Ii8+PC9zdmc+'); - background-repeat: no-repeat; - background-position: center; - } - - &:focus { - border: 1px solid $neutral-100; - } - } - } - &:last-child { - margin-bottom: pxToRem(20); - } } } @@ -228,8 +229,7 @@ form.hs-form { } .hs_recaptcha.hs-recaptcha { - .grecaptcha-badge { box-shadow: none !important; } -} \ No newline at end of file +} diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/hubspot-form.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/hubspot-form.html index e1a9f9e19..c8c9150bc 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/hubspot-form.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/hubspot-form.html @@ -27,6 +27,37 @@ } }); }; + + // List of countries that require explicit consent for data processing + const restrictedCountries = [ + "Argentina", "Belgium", "Canada", "Czech Republic", "Cyprus", "Denmark", "Germany", + "Hungary", "Latvia", "Liechtenstein", "Luxembourg", "Netherlands", "Norway", "France", + "Finland", "Croatia", "Bulgaria", "Belarus", "Bosnia and Herzegovina", "Austria", "Estonia", + "Georgia", "Greenland", "Hong Kong", "Israel", "Italy", "Maldives", "Moldova", "Monaco", + "Portugal", "Russia", "Serbia", "Slovakia", "Slovenia", "Sweden", "Switzerland", "Türkiye", + "Ukraine", "Macedonia (FYROM)", "United Kingdom" + ]; + + // consent block should show additional checkbox for restricted countries + function updateConsentBlocks(form) { + const countryField = form.querySelector('select[name="country"]'); + const legitDisclaimerText = form.querySelector('#Legit-interest-text-legal-disclaimer'); + const explicitDisclaimerText = form.querySelector('#explicit-text-legal-disclaimer'); + + if (!countryField || !legitDisclaimerText || !explicitDisclaimerText) { + // If there is no country field or related disclaimers, exit early + return; + } + + const selected = countryField.value; + const isRestricted = restrictedCountries.includes(selected); + const showOptIn = selected && isRestricted; + + if (legitDisclaimerText) legitDisclaimerText.style.display = showOptIn ? "none" : "block"; + if (explicitDisclaimerText) explicitDisclaimerText.style.display = showOptIn ? "block" : "none"; + } + + try { hbspt.forms.create({ ...options, @@ -34,12 +65,24 @@ pageId: "{{- .context.Permalink -}}", target: "#{{- .id -}}", onFormReady: function($form) { + if (!$form) { + console.warn("Form not found."); + return; + } + initHoneypot($form); + + updateConsentBlocks($form) + const countryField = $form.querySelector('select[name="country"]'); + if (countryField) { + countryField.addEventListener("change", () => updateConsentBlocks($form)); + } + }, }); } catch (e) { document.getElementById("{{- .id -}}").innerHTML = '
Here should be a form but looks like it was blocked on your side. Please, check your trackers blocking policy.
'; } })() - +