Material Admin
Form Striped Row
Project Assingingmore_vert
Add .striped-rows class in the form with bordered form styling.
Codeclose
<form class="h-form b-form striped-rows">
<div class="form-body">
<div class="divider"></div>
<div class="card-content">
<h6 class="font-medium">Personal Info</h6>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="f-nameh">First Name</label>
</div>
</div>
<div class="input-field col s9">
<input id="f-nameh" type="text" placeholder="First Name Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="l-nameh">Last Name</label>
</div>
</div>
<div class="input-field col s9">
<input id="l-nameh" type="text" placeholder="Last Name Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="emailh">Email</label>
</div>
</div>
<div class="input-field col s9">
<input id="emailh" type="email" placeholder="Email Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="con_no1">Contact Number</label>
</div>
</div>
<div class="input-field col s9">
<input id="con_no1" type="email" placeholder="Contact Number Here">
</div>
</div>
</div>
<div class="divider"></div>
<div class="card-content">
<h6 class="font-medium">Requirements</h6>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="con_no1">Company</label>
</div>
</div>
<div class="input-field col s9">
<input id="con_no1" type="email" placeholder="Company Name Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="con_no1">Interested In</label>
</div>
</div>
<div class="input-field col s9">
<select>
<option value="" disabled selected>Choose your option</option>
<option value="1">Designing</option>
<option value="2">Development</option>
<option value="3">Videography</option>
</select>
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="con_no1">Budget</label>
</div>
</div>
<div class="input-field col s9">
<select>
<option value="" disabled selected>Choose your option</option>
<option value="1">Less then $5000</option>
<option value="2">$5000 -$10000</option>
<option value="3">$10000 - $20000</option>
</select>
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label>Select File</label>
</div>
</div>
<div class="input-field col s9">
<div class="file-field">
<div class="btn cyan">
<span>File</span>
<input type="file">
</div>
<div class="file-path-wrapper">
<input class="file-path validate" type="text" placeholder="choose file Here">
</div>
</div>
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="project">About Project</label>
</div>
</div>
<div class="input-field col s9">
<textarea id="project" class="materialize-textarea" placeholder="About Project Here"></textarea>
</div>
</div>
</div>
</div>
<div class="divider"></div>
<div class="card-content">
<div class="form-action">
<button class="btn cyan waves-effect waves-light" type="submit" name="action">Save
</button>
<button class="btn waves-effect waves-light grey darken-4" type="submit" name="action">Cancel
</button>
</div>
</div>
</form>
Employee Timingmore_vert
Codeclose
<form class="h-form b-form striped-rows">
<div class="form-body">
<div class="card-content">
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="icon_prefix1">Employee Name</label>
</div>
</div>
<div class="input-field col s9">
<input id="icon_prefix1" type="text" class="validate" placeholder="Employee Name Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="icon_prefix3">Project Name</label>
</div>
</div>
<div class="input-field col s9">
<input id="icon_prefix3" type="text" class="validate" placeholder="Project Name Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="icon_prefix4">Date</label>
</div>
</div>
<div class="input-field col s9">
<input id="icon_prefix4" type="text" class="validate datepicker" placeholder="Date Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="icon_prefix5">Rate Per Hour</label>
</div>
</div>
<div class="input-field col s9">
<input id="icon_prefix5" type="text" class="validate" placeholder="Rate Per Hour">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="icon_prefix6">Start Time</label>
</div>
</div>
<div class="input-field col s9">
<input id="icon_prefix6" type="text" class="validate timepicker" placeholder="Start Time Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="icon_prefix7">End Time</label>
</div>
</div>
<div class="input-field col s9">
<input id="icon_prefix7" type="text" class="validate timepicker" placeholder="End Time Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="icon_prefix8">Notes</label>
</div>
</div>
<div class="input-field col s9">
<input id="icon_prefix8" type="text" class="validate" placeholder="Notes Here">
</div>
</div>
</div>
</div>
<div class="divider"></div>
<div class="card-content">
<div class="form-action">
<button class="btn cyan waves-effect waves-light" type="submit" name="action">Save
</button>
<button class="btn waves-effect waves-light grey darken-4" type="submit" name="action">Cancel
</button>
</div>
</div>
</form>
Event Registrationmore_vert
Codeclose
<form class="h-form b-form striped-rows">
<div class="form-body">
<div class="card-content">
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="full-n">Full Name</label>
</div>
</div>
<div class="input-field col s9">
<input id="full-n" type="text" placeholder="Full Name Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="title">Title</label>
</div>
</div>
<div class="input-field col s9">
<input id="title" type="text" placeholder="Title Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="com1">Company</label>
</div>
</div>
<div class="input-field col s9">
<input id="com1" type="text" placeholder="Company Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="em1">Email</label>
</div>
</div>
<div class="input-field col s9">
<input id="em1" type="text" placeholder="Email Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label for="con2">Contact Number</label>
</div>
</div>
<div class="input-field col s9">
<input id="con2" type="text" placeholder="Contact Number Here">
</div>
</div>
<div class="row">
<div class="col s3">
<div class="h-form-label">
<label>Existing Customer</label>
</div>
</div>
<div class="input-field col s9">
<p>
<label>
<input name="group1" type="radio" checked />
<span>Yes</span>
</label>
</p>
<p>
<label>
<input name="group1" type="radio" />
<span>No</span>
</label>
</p>
</div>
</div>
</div>
</div>
<div class="divider"></div>
<div class="card-content">
<div class="form-action">
<button class="btn cyan waves-effect waves-light" type="submit" name="action">Save
</button>
<button class="btn waves-effect waves-light grey darken-4" type="submit" name="action">Cancel
</button>
</div>
</div>
</form>