cf7-input-group.less

/*
 *
 * Bootstrap 3 input group form for Contact Form 7
 *
 * In the shortcode, you must use html_id="my-id"
 * or html_class="my-class" to target a specific form
 *
 * Actual form sample:
 *   <label for="your-email">Email:</label>
 *   [email* your-email 0/ placeholder "enter your email"]
 *   <span><button type="submit" class="wpcf7-form-control">Submit</button></span>
 *
 * Example 1 (affects targeted form class only): .my-form-class { &:extend(.cf7_input_group all); }
 * 
 * Example 2 (affects all Contact Form 7 forms): .wpcf7-form { &:extend(.cf7_input_group all); }
 *
 */

.cf7_input_group {
	& {
		&:extend(.input-group);
	}
	.wpcf7-form-control-wrap {
		> input {
			&:extend(.input-group .form-control, .input-group .form-control:first-child);
		}
		+ span {
			&:extend(.input-group-btn);
			vertical-align: bottom;
			> button {
				&:extend(.input-group-btn:last-child > .btn, .input-group-btn > .btn);
			}
		}
	}
	label {
		&:extend(.hidden);
		@media (min-width: @grid-float-breakpoint) {
			display: inline-block !important;
			visibility: visible !important;
		}
	}
}