Updated form

This commit is contained in:
nastyapash
2025-07-29 00:30:07 +02:00
parent bc9955e1a2
commit 8c00793bb6
2 changed files with 116 additions and 6 deletions
@@ -24,12 +24,112 @@
text-align: center;
}
.contact-form {
&__top-overlay {
width: pxToRem(210);
height: pxToRem(210);
background-image: url('/img/blurred/blurred-light-15.svg');
&__container {
position: relative;
width: 100%;
max-width: pxToRem(720);
margin: 0 auto;
border-radius: $spacer * 0.5;
background: linear-gradient($neutral-20, #0e1424);
* {
font-family: $font-family-base;
}
[data-hsfc-id=Renderer] .hsfc-Step .hsfc-Step__Content {
padding: $spacer * 1.5;
}
.hsfc-RichText span, .hsfc-FieldLabel span, .hsfc-ProgressBar__Text {
font-size: $font-size-s !important;
line-height: $line-height-sm !important;
color: $neutral-98 !important;
}
.hsfc-FieldLabel {
margin-bottom: $spacer * 0.5 !important;
}
[data-hsfc-id=Renderer] .hsfc-TextInput, [data-hsfc-id=Renderer] .hsfc-TextareaInput {
display: block;
background-color: transparent;
border: pxToRem(1) solid $neutral-50;
margin-bottom: $spacer * 0.5;
padding: $spacer * 0.5 $spacer;
font-size: $font-size-md;
line-height: $spacer * 1.5;
color: $neutral-98;
border-radius: $spacer * 0.5;
&:focus, &:active {
box-shadow: none !important;
}
&::placeholder {
color: $neutral-70;
}
}
[data-hsfc-id=Renderer] .hsfc-ErrorAlert {
font-size: $font-size-xs;
line-height: $font-size-l;
color: $primary-40;
}
[data-hsfc-id=Renderer] .hsfc-Button {
display: inline-flex;
align-items: center;
justify-content: center;
flex-wrap: nowrap;
cursor: pointer;
border: none;
border-radius: $spacer * 0.5;
color: $neutral-100;
text-decoration: none;
height: $spacer * 2.5;
padding: pxToRem(22);
font-weight: 700;
font-size: map-get($font-sizes-text, md);
z-index: 1;
background: linear-gradient(180deg, $primary-50, $primary-40) !important;
box-shadow: 0 2px 1px 0 $primary-60 inset !important;
transition: none !important;
&:hover {
background: $primary-50 !important;
border: none !important;
box-shadow: 0 2px 1px 0 $primary-70 inset !important;
transform: none !important;
}
&:active {
background: $primary-50 !important;
border: none !important;
box-shadow:
0 2px 1px 0 $primary-60 inset,
0 0 0 2px rgba(220, 36, 76, 0.4) !important;
}
&.button_disabled,
&:disabled {
background: $primary-70 !important;
border: none !important;
box-shadow: none !important;
}
}
}
&__form-overlay {
position: absolute;
right: 0;
top: 0;
width: pxToRem(210);
height: pxToRem(210);
background-image: url('/img/blurred/blurred-light-15.svg');
background-position: top;
background-size: cover;
border-radius: 0 pxToRem(12) 0 0;
}
&__overlay {
@@ -51,5 +151,11 @@
font-size: $h3-font-size;
line-height: pxToRem(58);
}
&__container {
[data-hsfc-id=Renderer] .hsfc-Step .hsfc-Step__Content {
padding: $spacer * 4;
}
}
}
}
@@ -5,7 +5,11 @@
<h2 class="edge-beta-form__title">{{ .Params.title }}</h2>
<p class="edge-beta-form__description">{{ .Params.description }}</p>
{{ partial "contact-form" .Params.form }}
<div class="edge-beta-form__container">
<div class="edge-beta-form__form-overlay"></div>
<script src="https://js-eu1.hsforms.net/forms/embed/developer/139603372.js" defer></script>
<div class="hs-form-html" data-region="eu1" data-form-id="3adfb3a8-1c4b-4670-958f-325826039f7e" data-portal-id="139603372"></div>
</div>
</div>
</section>
{{ end }}