[add] about and contact section

et/#2
tribikram 2 years ago
parent e17d1c549a
commit b96564a946
  1. 75
      public/css/style.css
  2. BIN
      public/images/close-up.png
  3. BIN
      public/images/contact-sec.png
  4. 13
      resources/views/layout/app.blade.php
  5. 768
      resources/views/welcome.blade.php

@ -781,7 +781,26 @@ p {
padding: 60px 0;
position: relative;
}
.about-us-desc{
position: absolute;
bottom: 0;
right: 0;
width: 50%;
background: #ffffff;
padding: 40px;
float: right;
}
.about-us-desc p{
margin-bottom: 40px;
}
.about-us-desc a{
padding: 10px 20px;
background: #2f55d4;
color: #ffffff;
font-weight: 700;
font-size: 18px;
line-height: 24px;
}
.bg-overlay {
background-color: rgba(40, 44, 50, 0.7);
position: absolute;
@ -1002,6 +1021,60 @@ p {
font-size: 13px;
}
/* contact css */
.contact-section{
color: #000;
overflow-x: hidden;
height: 100%;
background-repeat: no-repeat;
background-size: 100% 100%
}
.card{
padding: 30px 40px;
margin-top: 60px;
margin-bottom: 60px;
border: none !important;
box-shadow: 0 6px 12px 0 rgba(0,0,0,0.2)
}
.blue-text{
color: #00BCD4
}
.form-control-label{
margin-bottom: 0
}
input, textarea, button{
padding: 8px 15px;
border-radius: 5px !important;
margin: 5px 0px;box-sizing: border-box;
border: 1px solid #ccc;
font-size: 18px !important;
font-weight: 300
}
input:focus, textarea:focus{
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
border: 1px solid #00BCD4;
outline-width: 0;font-weight: 400
}
.btn-block{
text-transform: uppercase;
font-size: 15px !important;
font-weight: 400;
height: 43px;
cursor: pointer
}
.btn-block:hover{
color: #fff !important
}
button:focus{
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
outline-width: 0
}
@media (max-width: 768px) {
.section {
padding: 60px 0;

Binary file not shown.

After

Width:  |  Height:  |  Size: 660 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 302 KiB

@ -82,9 +82,7 @@
<img src="images/et-colored.png" alt="" class="logo-dark" height="50" />
</a>
</div>
<div class="buy-button">
<a href="post-a-job.html" class="btn btn-primary"><i class="mdi mdi-cloud-upload"></i> Post a Job</a>
</div><!--end login button-->
<!--end login button-->
<!-- End Logo container-->
<div class="menu-extras">
<div class="menu-item">
@ -104,6 +102,7 @@
<!-- Navigation Menu-->
<ul class="navigation-menu">
<li><a href="/">Home</a></li>
<li><a href="about">ABOUT</a></li>
<li class="has-submenu">
<a href="javascript:void(0)">Jobs</a><span class="menu-arrow"></span>
<ul class="submenu">
@ -115,14 +114,14 @@
</li>
<li class="has-submenu">
<a href="javascript:void(0)">Pages</a><span class="menu-arrow"></span>
<a href="javascript:void(0)">SERVICES</a><span class="menu-arrow"></span>
<ul class="submenu">
<li><a href="about.html">About us</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="team.html">Team</a></li>
<li><a href="faq.html">Faqs</a></li>
<li><a href="pricing.html">Pricing plans</a></li>
<li class="has-submenu"><a href="javascript:void(0)"> Candidates</a><span class="submenu-arrow"></span>
{{-- <li class="has-submenu"><a href="javascript:void(0)"> Candidates</a><span class="submenu-arrow"></span>
<ul class="submenu">
<li><a href="candidates-listing.html">Candidates Listing</a></li>
<li><a href="candidates-profile.html">Candidates Profile</a></li>
@ -149,7 +148,7 @@
<li><a href="recovery_passward.html">Forgot Password</a></li>
</ul>
</li>
<li><a href="components.html"> Components</a></li>
<li><a href="components.html"> Components</a></li> --}}
</ul>
</li>
<li>
@ -251,6 +250,6 @@
<script src="js/app.js"></script>
<script src="js/home.js"></script>
@yield('script')
</body>
</html>

@ -21,427 +21,83 @@
</div>
</div>
</div>
<div class="home-form-position">
<div class="row">
<div class="col-lg-12">
<div class="home-registration-form p-4 mb-3">
<form class="registration-form">
<div class="row">
<div class="col-lg-3 col-md-6">
<div class="registration-form-box">
<i class="fa fa-briefcase"></i>
<input type="text" id="exampleInputName1" class="form-control rounded registration-input-box" placeholder="Job keybords...">
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="registration-form-box">
<i class="fa fa-location-arrow"></i>
<select id="select-country" class="demo-default">
<option value="">Location</option>
<option value="AF">Afghanistan</option>
<option value="AX">&Aring;land Islands</option>
<option value="AL">Albania</option>
<option value="DZ">Algeria</option>
<option value="AS">American Samoa</option>
<option value="AD">Andorra</option>
<option value="AO">Angola</option>
<option value="AI">Anguilla</option>
<option value="AQ">Antarctica</option>
<option value="AG">Antigua and Barbuda</option>
<option value="AR">Argentina</option>
<option value="AM">Armenia</option>
<option value="AW">Aruba</option>
<option value="AU">Australia</option>
<option value="AT">Austria</option>
<option value="AZ">Azerbaijan</option>
<option value="BS">Bahamas</option>
<option value="BH">Bahrain</option>
<option value="BD">Bangladesh</option>
<option value="BB">Barbados</option>
<option value="BY">Belarus</option>
<option value="BE">Belgium</option>
<option value="BZ">Belize</option>
<option value="BJ">Benin</option>
<option value="BM">Bermuda</option>
<option value="BT">Bhutan</option>
<option value="BO">Bolivia, Plurinational State of</option>
<option value="BA">Bosnia and Herzegovina</option>
<option value="BW">Botswana</option>
<option value="BV">Bouvet Island</option>
<option value="BR">Brazil</option>
<option value="IO">British Indian Ocean Territory</option>
<option value="BN">Brunei Darussalam</option>
<option value="BG">Bulgaria</option>
<option value="BF">Burkina Faso</option>
<option value="BI">Burundi</option>
<option value="KH">Cambodia</option>
<option value="CM">Cameroon</option>
<option value="CA">Canada</option>
<option value="CV">Cape Verde</option>
<option value="KY">Cayman Islands</option>
<option value="CF">Central African Republic</option>
<option value="TD">Chad</option>
<option value="CL">Chile</option>
<option value="CN">China</option>
<option value="CX">Christmas Island</option>
<option value="CC">Cocos (Keeling) Islands</option>
<option value="CO">Colombia</option>
<option value="KM">Comoros</option>
<option value="CG">Congo</option>
<option value="CD">Congo, the Democratic Republic of the</option>
<option value="CK">Cook Islands</option>
<option value="CR">Costa Rica</option>
<option value="CI">C&ocirc;te d'Ivoire</option>
<option value="HR">Croatia</option>
<option value="CU">Cuba</option>
<option value="CY">Cyprus</option>
<option value="CZ">Czech Republic</option>
<option value="DK">Denmark</option>
<option value="DJ">Djibouti</option>
<option value="DM">Dominica</option>
<option value="DO">Dominican Republic</option>
<option value="EC">Ecuador</option>
<option value="EG">Egypt</option>
<option value="SV">El Salvador</option>
<option value="GQ">Equatorial Guinea</option>
<option value="ER">Eritrea</option>
<option value="EE">Estonia</option>
<option value="ET">Ethiopia</option>
<option value="FK">Falkland Islands (Malvinas)</option>
<option value="FO">Faroe Islands</option>
<option value="FJ">Fiji</option>
<option value="FI">Finland</option>
<option value="FR">France</option>
<option value="GF">French Guiana</option>
<option value="PF">French Polynesia</option>
<option value="TF">French Southern Territories</option>
<option value="GA">Gabon</option>
<option value="GM">Gambia</option>
<option value="GE">Georgia</option>
<option value="DE">Germany</option>
<option value="GH">Ghana</option>
<option value="GI">Gibraltar</option>
<option value="GR">Greece</option>
<option value="GL">Greenland</option>
<option value="GD">Grenada</option>
<option value="GP">Guadeloupe</option>
<option value="GU">Guam</option>
<option value="GT">Guatemala</option>
<option value="GG">Guernsey</option>
<option value="GN">Guinea</option>
<option value="GW">Guinea-Bissau</option>
<option value="GY">Guyana</option>
<option value="HT">Haiti</option>
<option value="HM">Heard Island and McDonald Islands</option>
<option value="VA">Holy See (Vatican City State)</option>
<option value="HN">Honduras</option>
<option value="HK">Hong Kong</option>
<option value="HU">Hungary</option>
<option value="IS">Iceland</option>
<option value="IN">India</option>
<option value="ID">Indonesia</option>
<option value="IR">Iran, Islamic Republic of</option>
<option value="IQ">Iraq</option>
<option value="IE">Ireland</option>
<option value="IM">Isle of Man</option>
<option value="IL">Israel</option>
<option value="IT">Italy</option>
<option value="JM">Jamaica</option>
<option value="JP">Japan</option>
<option value="JE">Jersey</option>
<option value="JO">Jordan</option>
<option value="KZ">Kazakhstan</option>
<option value="KE">Kenya</option>
<option value="KI">Kiribati</option>
<option value="KP">Korea, Democratic People's Republic of</option>
<option value="KR">Korea, Republic of</option>
<option value="KW">Kuwait</option>
<option value="KG">Kyrgyzstan</option>
<option value="LA">Lao People's Democratic Republic</option>
<option value="LV">Latvia</option>
<option value="LB">Lebanon</option>
<option value="LS">Lesotho</option>
<option value="LR">Liberia</option>
<option value="LY">Libyan Arab Jamahiriya</option>
<option value="LI">Liechtenstein</option>
<option value="LT">Lithuania</option>
<option value="LU">Luxembourg</option>
<option value="MO">Macao</option>
<option value="MK">Macedonia, the former Yugoslav Republic of</option>
<option value="MG">Madagascar</option>
<option value="MW">Malawi</option>
<option value="MY">Malaysia</option>
<option value="MV">Maldives</option>
<option value="ML">Mali</option>
<option value="MT">Malta</option>
<option value="MH">Marshall Islands</option>
<option value="MQ">Martinique</option>
<option value="MR">Mauritania</option>
<option value="MU">Mauritius</option>
<option value="YT">Mayotte</option>
<option value="MX">Mexico</option>
<option value="FM">Micronesia, Federated States of</option>
<option value="MD">Moldova, Republic of</option>
<option value="MC">Monaco</option>
<option value="MN">Mongolia</option>
<option value="ME">Montenegro</option>
<option value="MS">Montserrat</option>
<option value="MA">Morocco</option>
<option value="MZ">Mozambique</option>
<option value="MM">Myanmar</option>
<option value="NA">Namibia</option>
<option value="NR">Nauru</option>
<option value="NP">Nepal</option>
<option value="NL">Netherlands</option>
<option value="AN">Netherlands Antilles</option>
<option value="NC">New Caledonia</option>
<option value="NZ">New Zealand</option>
<option value="NI">Nicaragua</option>
<option value="NE">Niger</option>
<option value="NG">Nigeria</option>
<option value="NU">Niue</option>
<option value="NF">Norfolk Island</option>
<option value="MP">Northern Mariana Islands</option>
<option value="NO">Norway</option>
<option value="OM">Oman</option>
<option value="PK">Pakistan</option>
<option value="PW">Palau</option>
<option value="PS">Palestinian Territory, Occupied</option>
<option value="PA">Panama</option>
<option value="PG">Papua New Guinea</option>
<option value="PY">Paraguay</option>
<option value="PE">Peru</option>
<option value="PH">Philippines</option>
<option value="PN">Pitcairn</option>
<option value="PL">Poland</option>
<option value="PT">Portugal</option>
<option value="PR">Puerto Rico</option>
<option value="QA">Qatar</option>
<option value="RE">R&eacute;union</option>
<option value="RO">Romania</option>
<option value="RU">Russian Federation</option>
<option value="RW">Rwanda</option>
<option value="BL">Saint Barth&eacute;lemy</option>
<option value="SH">Saint Helena, Ascension and Tristan da Cunha</option>
<option value="KN">Saint Kitts and Nevis</option>
<option value="LC">Saint Lucia</option>
<option value="MF">Saint Martin (French part)</option>
<option value="PM">Saint Pierre and Miquelon</option>
<option value="VC">Saint Vincent and the Grenadines</option>
<option value="WS">Samoa</option>
<option value="SM">San Marino</option>
<option value="ST">Sao Tome and Principe</option>
<option value="SA">Saudi Arabia</option>
<option value="SN">Senegal</option>
<option value="RS">Serbia</option>
<option value="SC">Seychelles</option>
<option value="SL">Sierra Leone</option>
<option value="SG">Singapore</option>
<option value="SK">Slovakia</option>
<option value="SI">Slovenia</option>
<option value="SB">Solomon Islands</option>
<option value="SO">Somalia</option>
<option value="ZA">South Africa</option>
<option value="GS">South Georgia and the South Sandwich Islands</option>
<option value="ES">Spain</option>
<option value="LK">Sri Lanka</option>
<option value="SD">Sudan</option>
<option value="SR">Suriname</option>
<option value="SJ">Svalbard and Jan Mayen</option>
<option value="SZ">Swaziland</option>
<option value="SE">Sweden</option>
<option value="CH">Switzerland</option>
<option value="SY">Syrian Arab Republic</option>
<option value="TW">Taiwan, Province of China</option>
<option value="TJ">Tajikistan</option>
<option value="TZ">Tanzania, United Republic of</option>
<option value="TH">Thailand</option>
<option value="TL">Timor-Leste</option>
<option value="TG">Togo</option>
<option value="TK">Tokelau</option>
<option value="TO">Tonga</option>
<option value="TT">Trinidad and Tobago</option>
<option value="TN">Tunisia</option>
<option value="TR">Turkey</option>
<option value="TM">Turkmenistan</option>
<option value="TC">Turks and Caicos Islands</option>
<option value="TV">Tuvalu</option>
<option value="UG">Uganda</option>
<option value="UA">Ukraine</option>
<option value="AE">United Arab Emirates</option>
<option value="GB">United Kingdom</option>
<option value="US">United States</option>
<option value="UM">United States Minor Outlying Islands</option>
<option value="UY">Uruguay</option>
<option value="UZ">Uzbekistan</option>
<option value="VU">Vanuatu</option>
<option value="VE">Venezuela, Bolivarian Republic of</option>
<option value="VN">Viet Nam</option>
<option value="VG">Virgin Islands, British</option>
<option value="VI">Virgin Islands, U.S.</option>
<option value="WF">Wallis and Futuna</option>
<option value="EH">Western Sahara</option>
<option value="YE">Yemen</option>
<option value="ZM">Zambia</option>
<option value="ZW">Zimbabwe</option>
</select>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="registration-form-box">
<i class="fa fa-list-alt"></i>
<select id="select-category" class="demo-default">
<option value="">Categories...</option>
<option value="4">Accounting</option>
<option value="1">IT & Software</option>
<option value="3">Marketing</option>
<option value="5">Banking</option>
</select>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="registration-form-box">
<input type="submit" id="submit" name="send" class="submitBnt btn btn-primary btn-block" value="Submit">
</div>
</div>
</div>
</form>
</div>
</div>
</section>
<!-- end home -->
<!-- start about -->
<section class="section">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="about-img">
<img src="{{url('images/close-up.png')}}" class="img-fluid" alt="">
</div>
<div class="about-us-desc">
<h5>Why we started </h5>
<h1>It started out as a simple idea and evolved into our passion</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.</p>
<a href="">Discover our story ></a>
</div>
</div>
</div>
</div>
</section>
<!-- end home -->
<!-- end about -->
<!-- popular category start -->
<!-- How it Work start -->
<section class="section">
<div class="container">
<div class="row justify-content-center">
<div class="col-12">
<div class="section-title text-center mb-4 pb-2">
<h4 class="title title-line pb-5">Popular Category</h4>
<h4 class="title title-line pb-5">How It Work</h4>
<p class="text-muted para-desc mx-auto mb-1">Post a job to tell us about your project. We'll quickly match you with the right freelancers.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-6 mt-4 pt-2">
<a href="javascript:void(0)">
<div class="popu-category-box bg-light rounded text-center p-4">
<div class="popu-category-icon mb-3">
<i class="mdi mdi-account d-inline-block rounded-pill h3 text-primary"></i>
</div>
<div class="popu-category-content">
<h5 class="mb-2 text-dark title">Developer</h5>
<p class="text-success mb-0 rounded">780 Jobs</p>
</div>
</div>
</a>
</div>
<div class="col-lg-3 col-md-6 mt-4 pt-2">
<a href="javascript:void(0)">
<div class="popu-category-box bg-light rounded text-center p-4">
<div class="popu-category-icon mb-3">
<i class="mdi mdi-desktop-classic d-inline-block rounded-pill h3 text-primary"></i>
</div>
<div class="popu-category-content">
<h5 class="mb-2 text-dark title">Technology</h5>
<p class="text-success mb-0 rounded">1270 Jobs</p>
</div>
</div>
</a>
</div>
<div class="col-lg-3 col-md-6 mt-4 pt-2">
<a href="javascript:void(0)">
<div class="popu-category-box bg-light rounded text-center p-4">
<div class="popu-category-icon mb-3">
<i class="mdi mdi-bank d-inline-block rounded-pill h3 text-primary"></i>
</div>
<div class="popu-category-content">
<h5 class="mb-2 text-dark title">Government</h5>
<p class="text-success mb-0 rounded">2024 Jobs</p>
</div>
</div>
</a>
</div>
<div class="col-lg-3 col-md-6 mt-4 pt-2">
<a href="javascript:void(0)">
<div class="popu-category-box bg-light rounded text-center p-4">
<div class="popu-category-icon mb-3">
<i class="mdi mdi-auto-fix d-inline-block rounded-pill h3 text-primary"></i>
</div>
<div class="popu-category-content">
<h5 class="mb-2 text-dark title">Accounting / Finance</h5>
<p class="text-success mb-0 rounded">786 Jobs</p>
</div>
</div>
</a>
</div>
<div class="col-lg-3 col-md-6 mt-4 pt-2">
<a href="javascript:void(0)">
<div class="popu-category-box bg-light rounded text-center p-4">
<div class="popu-category-icon mb-3">
<i class="mdi mdi-office-building d-inline-block rounded-pill h3 text-primary"></i>
</div>
<div class="popu-category-content">
<h5 class="mb-2 text-dark title">Construction / Facilities</h5>
<p class="text-success mb-0 rounded">2156 Jobs</p>
</div>
</div>
</a>
</div>
<div class="col-lg-3 col-md-6 mt-4 pt-2">
<a href="javascript:void(0)">
<div class="popu-category-box bg-light rounded text-center p-4">
<div class="popu-category-icon mb-3">
<i class="mdi mdi-telegram d-inline-block rounded-pill h3 text-primary"></i>
</div>
<div class="popu-category-content">
<h5 class="mb-2 text-dark title">Tele-communications</h5>
<p class="text-success mb-0 rounded">256 Jobs</p>
</div>
<div class="col-md-4 mt-4 pt-2">
<div class="how-it-work-box bg-light p-4 text-center rounded shadow">
<div class="how-it-work-img position-relative rounded-pill mb-3">
<img src="images/how-it-work/img-1.png" alt="" class="mx-auto d-block" height="50">
</div>
</a>
<div>
<h5>Register an account</h5>
<p class="text-muted">Donec pede justo fringilla vel aliquet nec vulputate eget arcu. In enim justo rhoncus ut a, justo.</p>
<a href="#" class="text-primary">Read more <i class="mdi mdi-chevron-right"></i></a>
</div>
<div class="col-lg-3 col-md-6 mt-4 pt-2">
<a href="javascript:void(0)">
<div class="popu-category-box bg-light rounded text-center p-4">
<div class="popu-category-icon mb-3">
<i class="mdi mdi-television-classic d-inline-block rounded-pill h3 text-primary"></i>
</div>
<div class="popu-category-content">
<h5 class="mb-2 text-dark title">Design & Multimedia</h5>
<p class="text-success mb-0 rounded">585 Jobs</p>
</div>
<div class="col-md-4 mt-4 pt-2">
<div class="how-it-work-box bg-light p-4 text-center rounded shadow">
<div class="how-it-work-img position-relative rounded-pill mb-3">
<img src="images/how-it-work/img-2.png" alt="" class="mx-auto d-block" height="50">
</div>
</a>
<div>
<h5>Search your job</h5>
<p class="text-muted">Aliquam lorem ante dapibus in, viverra feugiatquis a tellus. Phasellus viverra nulla ut Quisque rutrum.</p>
<a href="#" class="text-primary">Read more <i class="mdi mdi-chevron-right"></i></a>
</div>
<div class="col-lg-3 col-md-6 mt-4 pt-2">
<a href="javascript:void(0)">
<div class="popu-category-box bg-light rounded text-center p-4">
<div class="popu-category-icon mb-3">
<i class="mdi mdi-human d-inline-block rounded-pill h3 text-primary"></i>
</div>
<div class="popu-category-content">
<h5 class="mb-2 text-dark title">Human Resource</h5>
<p class="text-success mb-0 rounded">548 Jobs</p>
</div>
<div class="col-md-4 mt-4 pt-2">
<div class="how-it-work-box bg-light p-4 text-center rounded shadow">
<div class="how-it-work-img position-relative rounded-pill mb-3">
<img src="images/how-it-work/img-3.png" alt="" class="mx-auto d-block" height="50">
</div>
</a>
<div>
<h5>Apply for job</h5>
<p class="text-muted">Nullam dictum felis eu pede mollis pretiumetus Integer tincidunt. Cras dapibus. semper nisi.</p>
<a href="#" class="text-primary">Read more <i class="mdi mdi-chevron-right"></i></a>
</div>
</div>
<div class="row justify-content-center">
<div class="col-12 text-center mt-4 pt-2">
<a href="javascript:void(0)" class="btn btn-primary-outline">Browse All Categories <i class="mdi mdi-chevron-right"></i></a>
</div>
</div>
</div>
</section>
<!-- popular category end -->
<!-- How it Work end -->
<!-- all jobs start -->
<section class="section bg-light">
@ -478,7 +134,6 @@
<div class="tab-pane fade show active" id="recent-job" role="tabpanel" aria-labelledby="recent-job-tab">
<div class="row">
<div class="col-lg-12">
<div class="job-box bg-white overflow-hidden border rounded mt-4 position-relative overflow-hidden">
<div class="lable text-center pt-2 pb-2">
<ul class="list-unstyled best text-white mb-0 text-uppercase">
@ -1424,115 +1079,6 @@
</section>
<!-- all jobs end -->
<!-- How it Work start -->
<section class="section">
<div class="container">
<div class="row justify-content-center">
<div class="col-12">
<div class="section-title text-center mb-4 pb-2">
<h4 class="title title-line pb-5">How It Work</h4>
<p class="text-muted para-desc mx-auto mb-1">Post a job to tell us about your project. We'll quickly match you with the right freelancers.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 mt-4 pt-2">
<div class="how-it-work-box bg-light p-4 text-center rounded shadow">
<div class="how-it-work-img position-relative rounded-pill mb-3">
<img src="images/how-it-work/img-1.png" alt="" class="mx-auto d-block" height="50">
</div>
<div>
<h5>Register an account</h5>
<p class="text-muted">Donec pede justo fringilla vel aliquet nec vulputate eget arcu. In enim justo rhoncus ut a, justo.</p>
<a href="#" class="text-primary">Read more <i class="mdi mdi-chevron-right"></i></a>
</div>
</div>
</div>
<div class="col-md-4 mt-4 pt-2">
<div class="how-it-work-box bg-light p-4 text-center rounded shadow">
<div class="how-it-work-img position-relative rounded-pill mb-3">
<img src="images/how-it-work/img-2.png" alt="" class="mx-auto d-block" height="50">
</div>
<div>
<h5>Search your job</h5>
<p class="text-muted">Aliquam lorem ante dapibus in, viverra feugiatquis a tellus. Phasellus viverra nulla ut Quisque rutrum.</p>
<a href="#" class="text-primary">Read more <i class="mdi mdi-chevron-right"></i></a>
</div>
</div>
</div>
<div class="col-md-4 mt-4 pt-2">
<div class="how-it-work-box bg-light p-4 text-center rounded shadow">
<div class="how-it-work-img position-relative rounded-pill mb-3">
<img src="images/how-it-work/img-3.png" alt="" class="mx-auto d-block" height="50">
</div>
<div>
<h5>Apply for job</h5>
<p class="text-muted">Nullam dictum felis eu pede mollis pretiumetus Integer tincidunt. Cras dapibus. semper nisi.</p>
<a href="#" class="text-primary">Read more <i class="mdi mdi-chevron-right"></i></a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- How it Work end -->
<!-- counter start -->
<section class="section bg-counter position-relative" style="background: url('https://via.placeholder.com/200X700//88929f/5a6270C/O https://placeholder.com/') center center;">
<div class="bg-overlay bg-overlay-gradient"></div>
<div class="container">
<div class="row" id="counter">
<div class="col-md-3 col-6">
<div class="home-counter pt-4 pb-4">
<div class="float-left counter-icon mr-3">
<i class="mdi mdi-bank h1 text-white"></i>
</div>
<div class="counter-content overflow-hidden">
<h1 class="counter-value text-white mb-1" data-count="120">10</h1>
<p class="counter-name text-white text-uppercase mb-0">Companies</p>
</div>
</div>
</div>
<div class="col-md-3 col-6">
<div class="home-counter pt-4 pb-4">
<div class="float-left counter-icon mr-3">
<i class="mdi mdi-file-document-box h1 text-white"></i>
</div>
<div class="counter-content overflow-hidden">
<h1 class="counter-value text-white mb-1" data-count="480">80</h1>
<p class="counter-name text-white text-uppercase mb-0">Applications</p>
</div>
</div>
</div>
<div class="col-md-3 col-6">
<div class="home-counter pt-4 pb-4">
<div class="float-left counter-icon mr-3">
<i class="mdi mdi-calendar-multiple-check h1 text-white"></i>
</div>
<div class="counter-content overflow-hidden">
<h1 class="counter-value text-white mb-1" data-count="120">10</h1>
<p class="counter-name text-white text-uppercase mb-0">Job Posted</p>
</div>
</div>
</div>
<div class="col-md-3 col-6">
<div class="home-counter pt-4 pb-4">
<div class="float-left counter-icon mr-3">
<i class="mdi mdi-account-multiple-plus h1 text-white"></i>
</div>
<div class="counter-content overflow-hidden">
<h1 class="counter-value text-white mb-1" data-count="200">10</h1>
<p class="counter-name text-white text-uppercase mb-0">Member</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- counter end -->
<!-- testimonial start -->
<section class="section">
@ -1594,157 +1140,129 @@
</div>
</div>
</div>
<div class="container mt-100 mt-60">
<div class="row justify-content-center">
<div class="col-12">
<div class="section-title text-center mb-4 pb-2">
<h4 class="title title-line pb-5">Our Client's</h4>
<p class="text-muted para-desc mx-auto mb-1">Post a job to tell us about your project. We'll quickly match you with the right freelancers.</p>
</div>
</div>
</div>
<div class="row align-items-center">
<div class="col-lg-2 col-md-4 col-6 mt-4 pt-2 text-center">
<img src="images/clients/1.png" height="50" alt="">
</div><!--end col-->
<div class="col-lg-2 col-md-4 col-6 mt-4 pt-2 text-center">
<img src="images/clients/2.png" height="50" alt="">
</div><!--end col-->
<div class="col-lg-2 col-md-4 col-6 mt-4 pt-2 text-center">
<img src="images/clients/3.png" height="50" alt="">
</div><!--end col-->
<div class="col-lg-2 col-md-4 col-6 mt-4 pt-2 text-center">
<img src="images/clients/4.png" height="50" alt="">
</div><!--end col-->
<div class="col-lg-2 col-md-4 col-6 mt-4 pt-2 text-center">
<img src="images/clients/1.png" height="50" alt="">
</div><!--end col-->
<div class="col-lg-2 col-md-4 col-6 mt-4 pt-2 text-center">
<img src="images/clients/2.png" height="50" alt="">
</div><!--end col-->
</div>
</div>
</section>
<!-- testimonial end -->
<!-- blog start -->
<section class="section bg-light">
<div class="container">
<div class="row justify-content-center">
<div class="col-12">
<div class="section-title text-center mb-4 pb-2">
<h4 class="title title-line pb-5">Career advice</h4>
<p class="text-muted para-desc mx-auto mb-1">Post a job to tell us about your project. We'll quickly match you with the right freelancers.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-6 mt-4 pt-2">
<div class="blog position-relative overflow-hidden shadow rounded">
<div class="position-relative overflow-hidden">
<img src="https://via.placeholder.com/800X533//88929f/5a6270C/O https://placeholder.com/" class="img-fluid rounded-top" alt="">
<div class="overlay rounded-top bg-dark"></div>
<div class="likes">
<ul class="list-unstyled mb-0">
<li class="list-inline-item mr-2"><a href="javascript:void(0)" class="text-white like"><i class="mdi mdi-heart-outline mr-1"></i>33</a></li>
<li class="list-inline-item"><a href="javascript:void(0)" class="text-white comments"><i class="mdi mdi-comment-outline mr-1"></i>08</a></li>
</ul>
</div>
</div>
<div class="content p-4">
<h4><a href="javascript:void(0)" class="title text-dark">How apps is the IT world</a></h4>
<p class="text-muted">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium, totam rem aperiam</p>
<a href="#" class="text-dark readmore">Read more <i class="mdi mdi-chevron-right"></i></a>
</div>
<div class="author">
<p class=" mb-0"><i class="mdi mdi-account text-light"></i> <a href="javascript:void(0)" class="text-light user">Dirio Walls</a></p>
<p class="text-light mb-0 date"><i class="mdi mdi-calendar-check"></i> 25 Sep, 2019</p>
</div>
</div>
</div><!--end col-->
<div class="col-lg-4 col-md-6 mt-4 pt-2">
<div class="blog position-relative overflow-hidden shadow rounded">
<div class="position-relative overflow-hidden">
<img src="https://via.placeholder.com/800X533//88929f/5a6270C/O https://placeholder.com/" class="img-fluid rounded-top" alt="">
<div class="overlay rounded-top bg-dark"></div>
<div class="likes">
<ul class="list-unstyled mb-0">
<li class="list-inline-item mr-2"><a href="javascript:void(0)" class="text-white like"><i class="mdi mdi-heart-outline mr-1"></i>33</a></li>
<li class="list-inline-item"><a href="javascript:void(0)" class="text-white comments"><i class="mdi mdi-comment-outline mr-1"></i>08</a></li>
</ul>
</div>
</div>
<div class="content p-4">
<h4><a href="javascript:void(0)" class="title text-dark">Vestibulum ante ipsum primis</a></h4>
<p class="text-muted">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium, totam rem aperiam</p>
<a href="#" class="text-dark readmore">Read more <i class="mdi mdi-chevron-right"></i></a>
</div>
<div class="author">
<p class=" mb-0"><i class="mdi mdi-account text-light"></i> <a href="javascript:void(0)" class="text-light user">Dirio Walls</a></p>
<p class="text-light mb-0 date"><i class="mdi mdi-calendar-check"></i> 25 Sep, 2019</p>
</div>
</div>
</div><!--end col-->
<div class="col-lg-4 col-md-6 mt-4 pt-2">
<div class="blog position-relative overflow-hidden shadow rounded">
<div class="position-relative overflow-hidden">
<img src="https://via.placeholder.com/800X533//88929f/5a6270C/O https://placeholder.com/" class="img-fluid rounded-top" alt="">
<div class="overlay rounded-top bg-dark"></div>
<div class="likes">
<ul class="list-unstyled mb-0">
<li class="list-inline-item mr-2"><a href="javascript:void(0)" class="text-white like"><i class="mdi mdi-heart-outline mr-1"></i>33</a></li>
<li class="list-inline-item"><a href="javascript:void(0)" class="text-white comments"><i class="mdi mdi-comment-outline mr-1"></i>08</a></li>
</ul>
<!-- subscribe start -->
<section class="section contact-section" style="background: url('images/contact-sec.png') ;">
<div class="container-fluid px-1 py-5 mx-auto">
<div class="row d-flex justify-content-center">
<div class="col-xl-7 col-lg-8 col-md-9 col-11 text-center">
<h3>Request a Demo</h3>
<p class="blue-text">Just answer a few questions<br> so that we can personalize the right experience for you.</p>
<div class="card">
<h5 class="text-center mb-4">Powering world-class companies</h5>
<form class="form-card" onsubmit="event.preventDefault()">
<div class="row justify-content-between text-left">
<div class="form-group col-sm-6 flex-column d-flex"> <label class="form-control-label px-3">Full name<span class="text-danger"> *</span></label>
<input type="text" id="fname" name="fname" placeholder="Enter your full name" onblur="validate(1)">
</div>
<div class="form-group col-sm-6 flex-column d-flex">
<label class="form-control-label px-3">Business email<span class="text-danger"> *</span></label>
<input type="text" id="email" name="email" placeholder="" onblur="validate(2)">
</div>
<div class="content p-4">
<h4><a href="javascript:void(0)" class="title text-dark">Maecenas tempus tellus eget</a></h4>
<p class="text-muted">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium, totam rem aperiam</p>
<a href="#" class="text-dark readmore">Read more <i class="mdi mdi-chevron-right"></i></a>
</div>
<div class="author">
<p class=" mb-0"><i class="mdi mdi-account text-light"></i> <a href="javascript:void(0)" class="text-light user">Dirio Walls</a></p>
<p class="text-light mb-0 date"><i class="mdi mdi-calendar-check"></i> 25 Sep, 2019</p>
<div class="row justify-content-between text-left">
<div class="form-group col-sm-6 flex-column d-flex"> <label class="form-control-label px-3">Phone number<span class="text-danger"> *</span></label>
<input type="text" id="mob" name="mob" placeholder="" onblur="validate(3)">
</div>
<div class="form-group col-sm-6 flex-column d-flex"> <label class="form-control-label px-3">Job title<span class="text-danger"> *</span></label>
<input type="text" id="job" name="job" placeholder="" onblur="validate(4)">
</div>
</div><!--end col-->
</div>
<div class="row justify-content-between text-left">
<div class="form-group col-12 flex-column d-flex"> <label class="form-control-label px-3">What would you be using Flinks for?<span class="text-danger"> *</span></label>
<input type="text" id="ans" name="ans" placeholder="" onblur="validate(5)">
</div>
</section>
<!-- blog end -->
<!-- subscribe start -->
<section class="section">
<div class="container">
<div class="row">
<div class="col-lg-4 col-md-5">
<div class="float-left position-relative notification-icon mr-2">
<i class="mdi mdi-bell-outline text-primary"></i>
<span class="badge badge-pill badge-danger">1</span>
</div>
<h5 class="mt-2 mb-0">Your Job Notification</h5>
</div>
<div class="col-lg-8 col-md-7 mt-4 mt-sm-0">
<form>
<div class="form-group mb-0">
<div class="input-group mb-0">
<input name="email" id="email" type="email" class="form-control" placeholder="Your email :" required="" aria-describedby="newssubscribebtn">
<div class="input-group-append">
<button class="btn btn-primary submitBnt" type="submit" id="newssubscribebtn">Subscribe</button>
</div>
<div class="row justify-content-end">
<div class="form-group col-sm-6">
<button type="submit" class="btn-block btn-primary">Request a demo</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
<!-- subscribe end -->
@endsection
@section('script')
<script>
function validate(val) {
v1 = document.getElementById("fname");
v2 = document.getElementById("email");
v3 = document.getElementById("mob");
v4 = document.getElementById("job");
v5 = document.getElementById("ans");
flag1 = true;
flag2 = true;
flag3 = true;
flag4 = true;
flag5 = true;
if(val>=1 || val==0) {
if(v1.value == "") {
v1.style.borderColor = "red";
flag1 = false;
}
else {
v1.style.borderColor = "green";
flag1 = true;
}
}
if(val>=2 || val==0) {
if(v2.value == "") {
v2.style.borderColor = "red";
flag2 = false;
}
else {
v2.style.borderColor = "green";
flag2 = true;
}
}
if(val>=3 || val==0) {
if(v3.value == "") {
v3.style.borderColor = "red";
flag3 = false;
}
else {
v3.style.borderColor = "green";
flag3 = true;
}
}
if(val>=4 || val==0) {
if(v4.value == "") {
v4.style.borderColor = "red";
flag4 = false;
}
else {
v4.style.borderColor = "green";
flag4 = true;
}
}
if(val>=5 || val==0) {
if(v5.value == "") {
v5.style.borderColor = "red";
flag5 = false;
}
else {
v5.style.borderColor = "green";
flag5 = true;
}
}
flag = flag1 && flag2 && flag3 && flag4 && flag5;
return flag;
}
</script>
@endsection
Loading…
Cancel
Save