mirror of https://github.com/bigchaindb/site.git
basic contact page & form
This commit is contained in:
parent
60aef59f33
commit
d08ca58047
|
|
@ -12,6 +12,11 @@ email:
|
|||
twitter: BigchainDB
|
||||
disqus: bigchain
|
||||
|
||||
address:
|
||||
street: Wichertstr. 17
|
||||
zip: 10439
|
||||
city: Berlin
|
||||
country: Germany
|
||||
|
||||
# Track all the things
|
||||
# --------------------
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
//=include bigchain/dnt.js
|
||||
|
||||
//=include bigchain/form-earlyaccess.js
|
||||
//=include bigchain/form-contact.js
|
||||
|
||||
jQuery(function($) {
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,59 @@
|
|||
|
||||
var FormContact = (function(w, d, $) {
|
||||
|
||||
'use strict';
|
||||
|
||||
var app, _private, _config;
|
||||
|
||||
_config = {
|
||||
form: $('#form-contact'),
|
||||
formBtn: $('#form-contact').find('.btn'),
|
||||
formURL: $('#form-contact').attr('action'),
|
||||
formMethod: $('#form-contact').attr('method')
|
||||
};
|
||||
|
||||
_private = {
|
||||
formSubmit: function() {
|
||||
_config.form.submit(function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
if ( $(this).parsley().isValid() ) {
|
||||
$.ajax({
|
||||
url: _config.formURL,
|
||||
type: _config.formMethod,
|
||||
accept: {
|
||||
javascript: 'application/javascript'
|
||||
},
|
||||
data: _config.form.serialize(),
|
||||
crossDomain: true,
|
||||
beforeSend: function() {
|
||||
_config.formBtn
|
||||
.addClass('disabled')
|
||||
.attr('value', 'Sending...');
|
||||
},
|
||||
success: function(data) {
|
||||
_config.form.find('.form-group').addClass('hide');
|
||||
_config.form.find('.alert-success').removeClass('hide');
|
||||
_config.formBtn.removeClass('disabled');
|
||||
},
|
||||
error: function(err) {
|
||||
_config.form.find('.alert-danger').removeClass('hide');
|
||||
_config.formBtn
|
||||
.removeClass('disabled')
|
||||
.attr('value', 'Send');
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
app = {
|
||||
init: function() {
|
||||
_private.formSubmit();
|
||||
}
|
||||
};
|
||||
|
||||
return app;
|
||||
|
||||
})(window, document, jQuery);
|
||||
|
|
@ -45,3 +45,4 @@
|
|||
@import 'page-about';
|
||||
@import 'page-features';
|
||||
@import 'page-community';
|
||||
@import 'page-contact';
|
||||
|
|
|
|||
|
|
@ -0,0 +1,9 @@
|
|||
//
|
||||
// Page: Contact
|
||||
// ---
|
||||
// bigchain.io
|
||||
//
|
||||
|
||||
.contactlist {
|
||||
p { margin-bottom: 0 }
|
||||
}
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
|
||||
<form id="form-contact" class="js-parsley" action="//formspree.io/{{ site.email.contact }}" method="POST" accept-charset="UTF-8">
|
||||
<p class="form-group">
|
||||
<input class="form-control" type="text" id="name" name="name" required>
|
||||
<label class="form-label" for="name">Your Name</label>
|
||||
</p>
|
||||
<p class="form-group">
|
||||
<input class="form-control" type="email" id="email" name="_replyto" required>
|
||||
<label class="form-label" for="email">Your Email</label>
|
||||
</p>
|
||||
<p class="form-group">
|
||||
<textarea class="form-control" id="comment" name="comment" rows="1" required></textarea>
|
||||
<label class="form-label" for="comment">Your Message</label>
|
||||
</p>
|
||||
<p class="form-group">
|
||||
<input class="btn btn-primary" type="submit" value="Send">
|
||||
</p>
|
||||
|
||||
<div class="alert alert-success animation-slide-in-from-bottom hide">
|
||||
<svg class="alert__icon icon icon-success">
|
||||
<use xlink:href="/assets/img/sprite.svg#icon-success"></use>
|
||||
</svg>
|
||||
<p>
|
||||
<strong class="alert__title">Great to hear you’re interested!</strong>
|
||||
We’ll get in touch soon to discuss how we can work together.
|
||||
</p>
|
||||
</div>
|
||||
<div class="alert alert-danger hide">
|
||||
<svg class="alert__icon icon icon-fail">
|
||||
<use xlink:href="/assets/img/sprite.svg#icon-fail"></use>
|
||||
</svg>
|
||||
<p>
|
||||
<strong class="alert__title">Ops, there was an error</strong>
|
||||
Would you mind trying again?
|
||||
</p>
|
||||
</div>
|
||||
</form>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
---
|
||||
layout: page
|
||||
|
||||
title: Contact
|
||||
---
|
||||
|
||||
<section class="section section-contactform">
|
||||
<div class="row">
|
||||
<header class="section-header">
|
||||
<h1 class="section-title">Get in touch</h1>
|
||||
</header>
|
||||
|
||||
<div class="grid grid--full grid-small--fit grid--gutters">
|
||||
<div class="grid__col">
|
||||
{% include/form-contact.html %}
|
||||
</div>
|
||||
<div class="grid__col">
|
||||
<div class="contactlist">
|
||||
<p>{{ site.address.street }}</p>
|
||||
<p>{{ site.address.zip }} {{ site.address.city }}</p>
|
||||
<p>{{ site.address.country }}</p>
|
||||
<p>{{ site.email.contact }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
---
|
||||
layout: page
|
||||
|
||||
title: Contact
|
||||
---
|
||||
Loading…
Reference in New Issue