KSS Style Guide

<insert-markup>organisms.form-</insert-markup>
Which option do you prefer
Choose your preferences
Markup: ..\..\styleguide\templates\organisms\form.html
<form action="/wordpress4.8/forms/#wpcf7-f1885-p1886-o1" method="post" class="rocksite-o-form wpcf7-form">
		<div class="rocksite-o-form__line">
			<div class="rocksite-m-label-input ">
			
			
				<label for="input_text" class="rocksite-m-label-input__label">Your Name</label>
				<input type="text" value="" id="input_text" name="your-name" placeholder="" class="rocksite-a-input rocksite-m-label-input__input">
			
			</div>
		</div>
		<div class="rocksite-o-form__line">
			<div class="rocksite-m-label-input ">
			
			
				<label for="input_surname" class="rocksite-m-label-input__label">Your Surname</label>
				<input type="text" value="" id="input_surname" name="your-surnname" placeholder="" class="rocksite-a-input rocksite-m-label-input__input">
			
			</div>
		</div>
		<div class="rocksite-o-form__line">
			<div class="rocksite-m-label-input ">
			
			
				<label for="input_email" class="rocksite-m-label-input__label">Your E-mail</label>
				<input type="email" value="" id="input_email" name="your-surnname" placeholder="" class="rocksite-a-input rocksite-m-label-input__input">
			
			</div>
		</div>
	<div class="rocksite-o-form__line">
		<div class="rocksite-m-label-select ">
		
		
			<label for="input_text" class="rocksite-m-label-select__label">Select this option</label>
			<select name="select_option" class="rocksite-a-select rocksite-m-label-input__select" aria-label="Shop order">
			
			    <option value="first-option">
			        First option
			    </option>
			
			
			    <option value="second-option" selected="selected">
			        Second option
			    </option>
			
			
			
			    <option value="third-option">
			        Third option
			    </option>
			
			
			    <option value="fourth-option">
			        Fourth option
			    </option>
			
			
			</select>
		</div>
	</div>

	<div class="rocksite-o-form__line">
		<div class="rocksite-m-label-textarea ">
		
		
			<label for="input_text" class="rocksite-m-label-textarea__label">Your Message</label>
			<textarea class="rocksite-a-textarea rocksite-m-label-textarea__textarea" id="input_text" name="your-message" rows="" placeholder="" aria-invalid="false"></textarea>
		
		</div>
	</div>

	<fieldset class="rocksite-o-form__fieldset">

		<h5 class="rocksite-a-heading -h6 rocksite-o-form__fieldset__title">Which option do you prefer</h5>

	<div class="rocksite-o-form__line">
		<div class="rocksite-m-label-radio ">
			<input name="radio_name" type="radio" value="Option 1" id="input_radio1" /><label class="rocksite-m-label-radio__label" for="input_radio1">Option 1</label>
		</div>
	</div>
	<div class="rocksite-o-form__line">
		<div class="rocksite-m-label-radio ">
			<input name="radio_name" type="radio" value="Option 2" id="input_radio2" /><label class="rocksite-m-label-radio__label" for="input_radio2">Option 2</label>
		</div>
	</div>
	<div class="rocksite-o-form__line">
		<div class="rocksite-m-label-radio ">
			<input name="radio_name" type="radio" value="Option 3" id="input_radio3" /><label class="rocksite-m-label-radio__label" for="input_radio3">Option 3</label>
		</div>
	</div>
	</fieldset>



	<fieldset class="rocksite-o-form__fieldset">
		<h5 class="rocksite-a-heading -h6 rocksite-o-form__fieldset__title">Choose your preferences</h5>
		<div class="rocksite-o-form__line">
			<div class="rocksite-m-label-checkbox ">
				<input name="checkbox_name1" type="checkbox"  value="Option 1" id="input_checkbox1" /><label class="rocksite-m-label-checkbox__label" for="input_checkbox1">Option 1</label>
			</div>
		</div>
		<div class="rocksite-o-form__line">
			<div class="rocksite-m-label-checkbox ">
				<input name="checkbox_name2" type="checkbox"  value="Option 2" id="input_checkbox2" /><label class="rocksite-m-label-checkbox__label" for="input_checkbox2">Option 2</label>
			</div>
		</div>
		<div class="rocksite-o-form__line">
			<div class="rocksite-m-label-checkbox ">
				<input name="checkbox_name3" type="checkbox"  value="Option 3" id="input_checkbox3" /><label class="rocksite-m-label-checkbox__label" for="input_checkbox3">Option 3</label>
			</div>
		</div>
	</fieldset>






		<div class="rocksite-o-form__btn-line -btn-right">
				<button class="rocksite-a-input-button " type="submit">Send Message</button>
		</div>
</form>
Source: ../source/scss/components/organisms/_form.scss, line 1