You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
135 lines
7.3 KiB
135 lines
7.3 KiB
6 years ago
|
<div class="card bg-white border-grey my-4 bg-shadow pos-relative">
|
||
|
|
<div class="card-body px-lg-3 py-lg-4">
|
||
|
|
<h4 class="my-0">
|
||
|
|
Project extended
|
||
|
|
</h4>
|
||
|
|
<a data-cbp-close class="btn btn-link btn-icon btn-sm pos-absolute pos-r pos-t pos-zindex-11 mt-1 mr-1 cbp-popup-close-icon"><i class="ion-ios-close-empty icon-2x"></i></a>
|
||
|
|
</div>
|
||
|
|
<div class="owl-dots-center owl-nav-over owl-nav-over-lg owl-nav-over-hover" data-toggle="owl-carousel" data-owl-carousel-settings='{"items":1, "center":true, "autoplay":true, "loop":true, "dots":false, "nav":true, "animateOut":"fadeOutDown"}'>
|
||
|
|
|
||
|
|
<!--Project item 1-->
|
||
|
|
<div class="item">
|
||
|
|
<img src="assets/img/projects/project-1-cropped.jpg" alt="Project 1" class="img-fluid" />
|
||
|
|
<div class="bg-light p-3">
|
||
|
|
<h5 class="my-0 op-8">
|
||
|
|
Screenshot 1
|
||
|
|
</h5>
|
||
|
|
<p class="mb-0 op-8 text-sm">At rusticus suscipit. Commodo distineo gilvus nobis pala tincidunt torqueo ullamcorper. Inhibeo premo ulciscor utinam verto. Abdo antehabeo diam facilisi genitus imputo nunc quadrum tamen ulciscor.</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!--Project item 2-->
|
||
|
|
<div class="item">
|
||
|
|
<img src="assets/img/projects/project-2-cropped.jpg" alt="Project 2" class="img-fluid" />
|
||
|
|
<div class="bg-light p-3">
|
||
|
|
<h5 class="my-0 op-8">
|
||
|
|
Screenshot 2
|
||
|
|
</h5>
|
||
|
|
<p class="mb-0 op-8 text-sm">Commodo duis immitto quis. Camur consectetuer nisl rusticus sagaciter. Euismod ille te voco. Ad melior minim proprius. Esca iusto macto proprius quidem veniam.</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!--Project item 3-->
|
||
|
|
<div class="item">
|
||
|
|
<img src="assets/img/projects/project-3-cropped.jpg" alt="Project 3" class="img-fluid" />
|
||
|
|
<div class="bg-light p-3">
|
||
|
|
<h5 class="my-0 op-8">
|
||
|
|
Screenshot 3
|
||
|
|
</h5>
|
||
|
|
<p class="mb-0 op-8 text-sm">Commodo cui dignissim esse in meus quis si velit vero. Commoveo consectetuer consequat pagus pecus populus refoveo scisco tincidunt. Conventio dolor os refero.</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!--Project item 4-->
|
||
|
|
<div class="item">
|
||
|
|
<img src="assets/img/projects/project-4-cropped.jpg" alt="Project 4" class="img-fluid" />
|
||
|
|
<div class="bg-light p-3">
|
||
|
|
<h5 class="my-0 op-8">
|
||
|
|
Screenshot 4
|
||
|
|
</h5>
|
||
|
|
<p class="mb-0 op-8 text-sm">Antehabeo cogo fere importunus luctus praemitto refoveo secundum sed virtus. Appellatio lenis probo proprius refoveo saepius tation ulciscor. Augue brevitas populus refero.</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card-body p-lg-5">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-md-6 pb-4">
|
||
|
|
<h4 class="mt-0 mb-3 h5 text-uppercase">
|
||
|
|
Details
|
||
|
|
</h4>
|
||
|
|
<dl class="row text-sm">
|
||
|
|
<dt class="col-sm-4"><i class="la la-thumb-tack"></i> Client:</dt>
|
||
|
|
<dd class="col-sm-8"><a href="https://wrapbootstrap.com/theme/appstrap-responsive-website-template-WB0C6D0H4?ref=tme">Themelize.me</a></dd>
|
||
|
|
<dt class="col-sm-4"><i class="la la-calendar"></i> Date:</dt>
|
||
|
|
<dd class="col-sm-8">Nov 2017</dd>
|
||
|
|
<dt class="col-sm-4"><i class="la la-calendar-check-o"></i> Completion:</dt>
|
||
|
|
<dd class="col-sm-8">May 2018</dd>
|
||
|
|
<dt class="col-sm-4"><i class="la la-tags"></i> Category:</dt>
|
||
|
|
<dd class="col-sm-8">Web</dd>
|
||
|
|
<dt class="col-sm-4"><i class="la la-money"></i> Budget:</dt>
|
||
|
|
<dd class="col-sm-8">$3000-10000</dd>
|
||
|
|
<dt class="col-sm-4"><i class="la la-clock-o"></i> Hours:</dt>
|
||
|
|
<dd class="col-sm-8">2000 hours</dd>
|
||
|
|
</dl>
|
||
|
|
</div>
|
||
|
|
<div class="col-md-6 pb-4">
|
||
|
|
<h4 class="mt-0 mb-3 h5 text-uppercase">
|
||
|
|
Technologies
|
||
|
|
</h4>
|
||
|
|
<div class="mb-4">
|
||
|
|
<h5 class="d-flex mt-0 op-8">
|
||
|
|
<i class="la la-fw la-html5 mr-2"></i> HTML5 (66%)
|
||
|
|
</h5>
|
||
|
|
<div class="progress">
|
||
|
|
<div class="progress-bar progress-bar-sm py-1 w-66 bg-primary" data-toggle="progress-bar-animated-progress" role="progressbar" aria-valuenow="66" aria-valuemin="0" aria-valuemax="100"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="mb-4">
|
||
|
|
<h5 class="d-flex mt-0 op-8">
|
||
|
|
<i class="la la-fw la-css3 mr-2"></i> CSS3 (67%)
|
||
|
|
</h5>
|
||
|
|
<div class="progress">
|
||
|
|
<div class="progress-bar progress-bar-sm py-1 w-67 bg-primary" data-toggle="progress-bar-animated-progress" role="progressbar" aria-valuenow="67" aria-valuemin="0" aria-valuemax="100"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="mb-4">
|
||
|
|
<h5 class="d-flex mt-0 op-8">
|
||
|
|
<i class="la la-fw la-android mr-2"></i> Android (98%)
|
||
|
|
</h5>
|
||
|
|
<div class="progress">
|
||
|
|
<div class="progress-bar progress-bar-sm py-1 w-98 bg-primary" data-toggle="progress-bar-animated-progress" role="progressbar" aria-valuenow="98" aria-valuemin="0" aria-valuemax="100"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-md-6">
|
||
|
|
<h4 class="mt-0 mb-3 h5 text-uppercase">
|
||
|
|
Goals
|
||
|
|
</h4>
|
||
|
|
<p>Antehabeo appellatio interdico luptatum nisl secundum. Abdo ideo lobortis tation tego vicis vindico. Cogo in mauris refoveo. Ad consectetuer ex exerci facilisi immitto nulla odio. Caecus comis ea ille inhibeo lenis nisl ulciscor.</p>
|
||
|
|
<p>Adipiscing exerci fere feugiat gravis in populus tum ulciscor. Jumentum minim paratus suscipere tamen veniam. Hos scisco tamen vindico. Distineo eros jus similis tego valetudo.</p>
|
||
|
|
</div>
|
||
|
|
<div class="col-md-6">
|
||
|
|
<h4 class="mt-0 mb-3 h5 text-uppercase">
|
||
|
|
Challenges
|
||
|
|
</h4>
|
||
|
|
<p>Eum jus pecus typicus verto. Antehabeo capto genitus macto pagus refoveo singularis sit tum venio. Augue neo praesent sino. Aptent bene conventio dolor exerci fere feugiat valetudo.</p>
|
||
|
|
<p>At augue decet enim genitus mauris similis veniam. Commoveo humo iusto modo os populus scisco valde ymo. Accumsan consectetuer eligo inhibeo mauris occuro praesent si venio. Abdo eum pneum.</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- Call out -->
|
||
|
|
<div class="bg-light mt-4 mb-3">
|
||
|
|
<div class="container-fluid">
|
||
|
|
<div class="row p-3">
|
||
|
|
<div class="col-lg-6 op-9" data-bg-img="assets/img/projects/project-4.jpg"></div>
|
||
|
|
<div class="col-lg-6 p-4 d-lg-flex align-items-lg-center flex-lg-wrap">
|
||
|
|
<div class="mb-3 d-flex align-items-start justify-content-center"><i class="la la-check-circle icon-2x mr-2"></i> Camur ea lenis meus pagus pecus ullamcorper. Aptent natu valetudo.</div>
|
||
|
|
<div class="mb-3 d-flex align-items-start justify-content-center"><i class="la la-check-circle icon-2x mr-2"></i> Abico feugiat humo immitto vel. Antehabeo erat euismod exerci importunus in.</div>
|
||
|
|
<div class="mb-3 d-flex align-items-start justify-content-center"><i class="la la-check-circle icon-2x mr-2"></i> Capto minim premo voco. Blandit commodo dolor jus pertineo uxor verto.</div>
|
||
|
|
<div class="mb-0 d-flex align-items-start justify-content-center"><i class="la la-check-circle icon-2x mr-2"></i> Ad hendrerit nutus occuro singularis. Ea imputo pertineo probo.</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<a href="https://wrapbootstrap.com/theme/appstrap-responsive-website-template-WB0C6D0H4?ref=tme" title="View Online" class="btn btn-primary btn-bold btn-flat btn-block rounded-0 p-4">View Online <i class="fa fa-chevron-right ml-2"></i></a>
|
||
|
|
</div>
|
||
|
|
</div>
|