2022-07-06 22:03:47 +00:00
|
|
|
<section id="contact">
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="section-title">
|
|
|
|
|
<h2 class="title-text">{{ getLocalizedStr('contact.title') }}</h2>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="means-of-contact">
|
|
|
|
|
<p>
|
|
|
|
|
{{ getLocalizedStr('contact.use-email') }} <a href="mailto:{{ email }}">{{ email }}</a>
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<p>
|
|
|
|
|
{{ getLocalizedStr('contact.use-form') }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="contact-form-container">
|
|
|
|
|
<form id="contact-form">
|
|
|
|
|
<noscript>{{ getLocalizedStr('contact.no-script') }}</noscript>
|
|
|
|
|
<div class="alert alert-success hidden" id="contact-alert-success">
|
|
|
|
|
<div class="alert-content">
|
|
|
|
|
<div class="alert-icon">
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-circle-check" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
|
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
|
|
|
<circle cx="12" cy="12" r="9"></circle>
|
|
|
|
|
<path d="M9 12l2 2l4 -4"></path>
|
|
|
|
|
</svg>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="alert-text">
|
|
|
|
|
Thanks, your message has been sent!
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="alert alert-error hidden" id="contact-alert-error">
|
|
|
|
|
<div class="alert-content">
|
|
|
|
|
<div class="alert-icon">
|
|
|
|
|
<!-- <img src="/imgs/error.svg" alt="Error icon" /> -->
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-alert-circle" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
|
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
|
|
|
<circle cx="12" cy="12" r="9"></circle>
|
|
|
|
|
<line x1="12" y1="8" x2="12" y2="12"></line>
|
|
|
|
|
<line x1="12" y1="16" x2="12.01" y2="16"></line>
|
|
|
|
|
</svg>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="alert-text">
|
|
|
|
|
Sorry, there was an error while processing your message.
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="contact-form-first-group">
|
|
|
|
|
<div class="contact-form-input">
|
|
|
|
|
<label for="contact-form-name">{{ getLocalizedStr('contact.form.name') }}</label>
|
|
|
|
|
<input id="contact-form-name" type="text" name="name" minlength="2" maxlength="100" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="contact-form-input">
|
|
|
|
|
<label for="contact-form-email">{{ getLocalizedStr('contact.form.email') }}</label>
|
|
|
|
|
<input id="contact-form-email" type="email" name="email" required="required" maxlength="100" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="contact-form-subject contact-form-input">
|
|
|
|
|
<label for="contact-form-subject">{{ getLocalizedStr('contact.form.subject') }}</label>
|
|
|
|
|
<input id="contact-form-subject" type="text" name="subject" required="required" maxlength="100" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="contact-form-message contact-form-input">
|
|
|
|
|
<label for="contact-form-message">{{ getLocalizedStr('contact.form.message') }}</label>
|
|
|
|
|
<textarea id="contact-form-message" type="text" name="message" minlength="10" maxlength="8000"></textarea>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="contact-form-container">
|
|
|
|
|
<button type="submit" class="btn contact-form-submit" id="contact-form-submit">
|
|
|
|
|
{{ getLocalizedStr('contact.form.submit') }}
|
|
|
|
|
</button>
|
|
|
|
|
<button class="btn contact-form-submit loading-button" id="contact-form-loading">
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-refresh" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
|
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
|
|
|
<path d="M20 11a8.1 8.1 0 0 0 -15.5 -2m-.5 -4v4h4"></path>
|
|
|
|
|
<path d="M4 13a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4"></path>
|
|
|
|
|
</svg>
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
