Skip to content

Instantly share code, notes, and snippets.

@arunmdavid
Created January 13, 2014 11:40
Show Gist options
  • Select an option

  • Save arunmdavid/8398884 to your computer and use it in GitHub Desktop.

Select an option

Save arunmdavid/8398884 to your computer and use it in GitHub Desktop.
Job search result
/**
* Job search result
*/
.search-result-job-contact{
font-weight:nornal;margin-top:5px;color:#2d6ca2;
display:none;
}
.header-outer{
background-color:#eee;
}
.header-outer{
margin-top:50px;padding-top:20px;
}
.navbar a{
color:#fff;
}
.navbar{
background-color:#2d6ca2;
}
.header-search-hint{
margin-bottom:10px;
font-weight:bold;
}
.main-container{
margin-top:20px;
margin-bottom:100px;
}
.form-group {
margin-bottom: 20px;
}
.search-result-single{
margin-bottom:10px;
padding-bottom:10px;
border-bottom:1px solid #ddd;
}
.search-result-logo{
/*border: 1px solid #CCCCCC;
padding: 2px;*/
}
.search-result-logo-img{
width:100%;height:100%;border: 3px solid #dddddd;
}
.search-result-job-title{
font-size:18px;color:#2d6ca2;
}
.search-result-job-company{
font-size:16px;color:#2d6ca2;
}
.search-result-job-info{
}
.search-result-job-info-single.label{
font-weight:normal;font-size:14px;
padding-top:4px;
}
.search-result-job-info-single{
float:left;margin-right:10px;margin-top:10px;
}
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
<div id="" class=" navbar navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">Jobs</a></li>
<li><a href="#contact">Companies</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
<div class='header-outer'>
<div class='container'>
<div class='row header'>
<form role="form" class="noform-inline">
<div class='col-md-7'>
<div class="form-group">
<div class='header-search-hint'>What?</div>
<input type="email" class="form-control" name="query" id="search-query" placeholder="Job Title / Location / Company">
</div>
</div>
<div class='col-md-3'>
<div class="form-group">
<div class='header-search-hint'>Where?</div>
<select class="form-control" id="search-city">
<option value=''>Select City</option>
<option value='Chennai' selected>Chennai</option>
<option value='Banglore'>Banglore</option>
</select>
</div>
</div>
<div class='col-md-2'>
<div class="form-group">
<div class='header-search-hint'>&nbsp;</div>
<input type='submit' class="form-control btn btn-primary" name="search" value="Search" />
</div>
</div>
</form>
</div><br/>
</div>
</div>
<div class="container">
<div class="main-container">
<div class='row'>
<div class='col-md-3'>
<div>
Search Filters:<br/><br/>
<form role="form">
<div class="form-group">
<label for="search-query">
<i class='fa fa-bars'></i> Keyword
</label>
<input type='text' class="form-control" name="search" placeholder="Job Title / Company" />
</div>
<div class="form-group">
<label for="search-city">
<i class='fa fa-map-marker'></i> Location
</label>
<select class="form-control" id="search-city">
<option value=''>Any</option>
<option value='' selected>Chennai</option>
<option value=''>Banglore</option>
</select><br/>
<input type='text' class="form-control" name="search" placeholder="Ex: Egmore / Adyar" />
</div>
<div class="form-group">
<label for="search-query">
<i class='fa fa-bars'></i> Type
</label>
<select class="form-control" id="search-city">
<option value=''>Any</option>
<option value='' selected>Part time</option>
<option value=''>Full time</option>
</select>
</div>
<div class="form-group">
<label for="search-city">
<i class='fa fa-clock-o'></i> Time
</label><br/>
<!--<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" checked>
Any<br/>-->
<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" >
Morning ( 6AM to 11AM )<br/>
<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" >
Afternoon ( 11AM to 4PM )<br/>
<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" >
Evening ( 4PM to 10PM )<br/>
<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" >
Night ( 10PM to 6AM )<br/>
</div>
<div class="form-group">
<label for="search-city">
<i class='fa fa-briefcase'></i> Category
</label><br/>
<!--<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" checked>
Any<br/>-->
<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" >
Restaurant <br/>
<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" >
Retail <br/>
<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" >
Travel <br/>
<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" >
Others <br/>
</div>
<div class="form-group form-inline">
<label for="search-city">
<i class='fa fa-money
'></i> Salary
</label><br/>
<select class="form-control" style='width:100px' id="search-city">
<option value=''>Any</option>
<option value='' selected>1000</option>
<option value=''>2000</option>
</select>
to
<select class="form-control" style='width:100px' id="search-city">
<option value=''>Any</option>
<option value='' >1000</option>
<option value='' selected>2000</option>
</select>
</div>
<div class="form-group">
<label for="search-city">
<i class='fa fa-gift'></i> Anemities
</label><br/>
<!--<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" checked>
Any<br/>-->
<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" >
Food <br/>
<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" >
Stay <br/>
<input type="checkbox" name="optionsRadios" id="optionsRadios1" value="option1" >
T-shirt <br/>
</div>
</form>
</div>
</div>
<div class='col-md-7'>
Search Results:<br/><br/>
<div class='search-result-single'>
<div class='row'>
<div class='search-result-logo col-md-2 col-sm-2 nohidden-xs col-xs-3'>
<img src="http://foodriot.com/wp-content/uploads/2013/05/kentucky-fried-chicken-logo.jpg" class="search-result-logo-img" />
</div>
<div class='col-md-10 col-sm-10 nocol-xs-12 col-xs-9'>
<div class='search-result-job-title'>Team Member</div>
<div class='search-result-job-company'>KFC ( Kentucky Fried Chicken )</div>
<div class='search-result-job-location'>
Adyar, Chennai
</div>
<div class='search-result-job-contact'>
career.chennai@kfc.co.in<br/>
+91-937497553
</div>
<div class='search-result-job-info'>
<span class="search-result-job-info-single label label-success">
<i class="fa fa-briefcase"></i> Part Time
</span>
<span class="search-result-job-info-single label label-success">
<i class="fa fa-money"></i> Rs. 7000/hr
</span>
<div class='search-result-job-info-single label label-success'>
<i class="fa fa-clock-o"></i> 06:01 pm - 10:20 pm
</div>
<div class='clearfix'></div>
</div> </div>
</div>
</div>
<div class='search-result-single'>
<div class='row'>
<div class='search-result-logo col-md-2 col-sm-2 nohidden-xs col-xs-3'>
<img src="http://www.doublehelixdash.com/sites/default/files/mcdonalds-logo.png" class="search-result-logo-img" />
</div>
<div class='col-md-10 col-sm-10 nocol-xs-12 col-xs-9'>
<div class='search-result-job-title'>Team Member</div>
<div class='search-result-job-company'>KFC ( Kentucky Fried Chicken )</div>
</div>
</div>
</div>
</div>
<div class='col-md-2'>
Right sidebar:<br/><br/>
sdfdsf sdf ds dsf dsfds fsd fsdfsd fsd fsd fsdf
</div>
</div>
</div>
</div><!-- /.container -->
// alert('Hello world!');
{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment