Contact all your info in one place


Contact section includes working contact form (contact.php file). You can change styles labels or inputs form as the same as here. How you can see we also created alert error and success when the form was sent. If you want to change contact styles check contact.less and custom.less

...
<form name="contact-form" id="contact-form" action="contact-send.php" method="POST" >
  <div class="input-wrapper">
	<input class="contact-form form-name-error" type="text" placeholder="name" name="contact[form-name]" id="form-name">
  </div>
  <div class="input-wrapper">
	<input class="contact-form form-subject-error" type="text" placeholder="subject" name="contact[form-subject]" id="form-subject">
  </div>
  <div class="clearfix"></div>
  <div class="message">
	<div class="input-wrapper">
	  <textarea class="contact-form form-message-error" placeholder="message" name="contact[form-message]" id="form-message"></textarea>					
	  <div class="message-success alert-success alert hidden">Your message was sent. Thank you!</div>
	</div>
  </div>
  <div class="btn-submit">
	<input type="submit" value="Send" class="btn btn-default pull-right button-send btn-lg btn-radius-none">
  </div>	
</form>
...

Styles in contact.php

custom.less

...
//Form
//-----------------------------------------
.placeholder(@color) {
    &::-webkit-input-placeholder {
        color: @color;
    }
    &:-moz-placeholder {
        color: @color;
    }
    &:-ms-input-placeholder {
      color: @color;
    }
}
.message-error { border: 2px solid @highlightColor !important; .placeholder(@highlightColor) !important; background: #fff !important; }
...