Skip to content

Instantly share code, notes, and snippets.

@subaida77

subaida77/gist:0f2a0c2faa6a894ff5ddbcae7574e2e6

Last active March 12, 2021 11:50
Show Gist options
  • Save subaida77/0f2a0c2faa6a894ff5ddbcae7574e2e6 to your computer and use it in GitHub Desktop.
Save subaida77/0f2a0c2faa6a894ff5ddbcae7574e2e6 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.txt
//v14
<div class="mx-n4 page-dots-custom-1" data-flickity='{"pageDots": true, "prevNextButtons": false, "cellAlign": "left", "wrapAround": true, "imagesLoaded": true}'>
<div class="col-12 col-md-6 col-xl-4 pb-4 pb-md-7">
<!-- Card -->
<div class="card border shadow p-2 sk-fade font-montserrat font-size-sm">
<!-- Image -->
<div class="card-zoom position-relative">
<div class="badge-float sk-fade-top top-0 right-0 mt-4 mr-4">
<a href="@@webRoot/course-single-v2.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 mr-1 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-eye.svg")
</a>
<a href="@@webRoot/course-single-v2.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-heart.svg")
</a>
</div>
<a href="@@webRoot/course-single-v2.html" class="card-img sk-thumbnail d-block">
<img class="rounded shadow-light-lg" src="assets/img/products/product-7.jpg" alt="...">
</a>
<span class="badge sk-fade-bottom badge-lg badge-orange badge-pill badge-float bottom-0 left-0 mb-4 ml-4">
<span class="text-white text-uppercase font-weight-bold font-size-xs">BEST SELLER</span>
</span>
</div>
<!-- Footer -->
<div class="card-footer px-2 pb-2 mb-1 pt-4 position-relative">
<a href="#" class="d-block">
<div class="avatar avatar-xl badge-float position-absolute top-0 right-0 mt-n6 mr-5 rounded-circle shadow border border-white border-w-lg">
<img src="assets/img/avatars/avatar-1.jpg" alt="..." class="avatar-img rounded-circle">
</div>
</a>
<!-- Preheading -->
<a href="@@webRoot/course-single-v2.html"><span class="mb-1 d-inline-block text-gray-800">Photography</span></a>
<!-- Heading -->
<div class="position-relative">
<a href="@@webRoot/course-single-v2.html" class="d-block stretched-link"><h6 class="line-clamp-2 h-md-48 font-weight-semi-bold mr-md-6 mr-lg-10 mr-xl-4 mb-2">Fashion Photography From Professional</h6></a>
<div class="d-lg-flex align-items-end flex-wrap mb-n1">
<div class="star-rating mb-2 mb-lg-0 mr-lg-3">
<div class="rating" style="width:50%;"></div>
</div>
<div class="font-size-sm">
<span>5.45 (5.8k+ reviews)</span>
</div>
</div>
<div class="row mx-n2 align-items-end">
<div class="col px-2">
<ul class="nav mx-n3">
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-reader.svg")
</div>
<div class="font-size-sm">5 lessons</div>
</div>
</li>
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-clock.svg")
</div>
<div class="font-size-sm">8h 12m</div>
</div>
</li>
</ul>
</div>
<div class="col-auto px-2 text-right">
<del class="font-size-sm">$959</del>
<ins class="h4 mb-0 d-block mb-lg-n1 font-weight-semi-bold">$415.99</ins>
</div>
</div>
</div>
</div>
</div>
</div>
-----------v11
<div class="mx-n4 mb-3 flickity-dot-light" data-flickity='{"pageDots": true, "prevNextButtons": false, "cellAlign": "left", "wrapAround": true, "imagesLoaded": true}'>
<div class="col-12 col-md-6 col-xl-4 pb-4 pb-md-7">
<!-- Card -->
<div class="card border shadow p-2 sk-fade">
<!-- Image -->
<div class="card-zoom position-relative">
<div class="badge-float sk-fade-top top-0 right-0 mt-4 mr-4">
<a href="@@webRoot/course-single-v3.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 mr-1 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-eye.svg")
</a>
<a href="@@webRoot/course-single-v3.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-heart.svg")
</a>
</div>
<a href="@@webRoot/course-single-v3.html" class="card-img sk-thumbnail img-ratio-9 d-block">
<img class="rounded shadow-light-lg" src="assets/img/products/product-7.jpg" alt="...">
</a>
<span class="badge sk-fade-bottom badge-lg badge-orange badge-pill badge-float bottom-0 left-0 mb-4 ml-4">
<span class="text-white text-uppercase font-weight-bold font-size-xs">BEST SELLER</span>
</span>
</div>
<!-- Footer -->
<div class="card-footer px-2 pb-2 mb-1 pt-4 position-relative">
<a href="#" class="d-block">
<div class="avatar avatar-xl badge-float position-absolute top-0 right-0 mt-n6 mr-5 rounded-circle shadow border border-white border-w-lg">
<img src="assets/img/avatars/avatar-1.jpg" alt="..." class="avatar-img rounded-circle">
</div>
</a>
<!-- Preheading -->
<a href="@@webRoot/course-single-v3.html"><span class="mb-1 d-inline-block text-gray-800">Photography</span></a>
<!-- Heading -->
<div class="position-relative">
<a href="@@webRoot/course-single-v3.html" class="d-block stretched-link"><h4 class="line-clamp-2 h-md-48 h-lg-58 mr-md-6 mr-lg-10 mr-xl-4 mb-2">Fashion Photography From Professional</h4></a>
<div class="d-lg-flex align-items-end flex-wrap mb-n1">
<div class="star-rating mb-2 mb-lg-0 mr-lg-3">
<div class="rating" style="width:50%;"></div>
</div>
<div class="font-size-sm">
<span>5.45 (5.8k+ reviews)</span>
</div>
</div>
<div class="row mx-n2 align-items-end">
<div class="col px-2">
<ul class="nav mx-n3">
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-reader.svg")
</div>
<div class="font-size-sm">5 lessons</div>
</div>
</li>
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-clock.svg")
</div>
<div class="font-size-sm">8h 12m</div>
</div>
</li>
</ul>
</div>
<div class="col-auto px-2 text-right">
<del class="font-size-sm">$959</del>
<ins class="h4 mb-0 d-block mb-lg-n1">$415.99</ins>
</div>
</div>
</div>
</div>
</div>
</div>
-------v13
<div class="mx-n4" data-flickity='{"pageDots": true, "prevNextButtons": false, "cellAlign": "left", "wrapAround": true, "imagesLoaded": true}'>
<div class="col-12 col-md-6 col-xl-4 pb-4 pb-md-7">
<!-- Card -->
<div class="card border shadow p-2 sk-fade font-montserrat font-size-sm">
<!-- Image -->
<div class="card-zoom position-relative">
<div class="badge-float sk-fade-top top-0 right-0 mt-4 mr-4">
<a href="@@webRoot/course-single-v1.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 mr-1 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-eye.svg")
</a>
<a href="@@webRoot/course-single-v1.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-heart.svg")
</a>
</div>
<a href="@@webRoot/course-single-v1.html" class="card-img sk-thumbnail d-block">
<img class="rounded shadow-light-lg" src="assets/img/products/product-7.jpg" alt="...">
</a>
<span class="badge sk-fade-bottom badge-lg badge-orange badge-pill badge-float bottom-0 left-0 mb-4 ml-4">
<span class="text-white text-uppercase font-weight-bold font-size-xs">BEST SELLER</span>
</span>
</div>
<!-- Footer -->
<div class="card-footer px-2 pb-2 mb-1 pt-4 position-relative">
<a href="#" class="d-block">
<div class="avatar avatar-xl badge-float position-absolute top-0 right-0 mt-n6 mr-5 rounded-circle shadow border border-white border-w-lg">
<img src="assets/img/avatars/avatar-1.jpg" alt="..." class="avatar-img rounded-circle">
</div>
</a>
<!-- Preheading -->
<a href="@@webRoot/course-single-v1.html"><span class="mb-1 d-inline-block text-gray-800">Photography</span></a>
<!-- Heading -->
<div class="position-relative">
<a href="@@webRoot/course-single-v1.html" class="d-block stretched-link"><h6 class="line-clamp-2 h-md-48 font-weight-semi-bold mr-md-6 mr-lg-10 mr-xl-4 mb-2">Fashion Photography From Professional</h6></a>
<div class="d-lg-flex align-items-end flex-wrap mb-n1">
<div class="star-rating mb-2 mb-lg-0 mr-lg-3">
<div class="rating" style="width:50%;"></div>
</div>
<div class="font-size-sm">
<span>5.45 (5.8k+ reviews)</span>
</div>
</div>
<div class="row mx-n2 align-items-end">
<div class="col px-2">
<ul class="nav mx-n3">
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-reader.svg")
</div>
<div class="font-size-sm">5 lessons</div>
</div>
</li>
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-clock.svg")
</div>
<div class="font-size-sm">8h 12m</div>
</div>
</li>
</ul>
</div>
<div class="col-auto px-2 text-right">
<del class="font-size-sm">$959</del>
<ins class="h4 mb-0 d-block mb-lg-n1 font-weight-semi-bold">$415.99</ins>
</div>
</div>
</div>
</div>
</div>
</div>
--------v6
<div class="mx-n4 flickity-button-outset" data-flickity='{"pageDots": true, "prevNextButtons": true, "cellAlign": "left", "wrapAround": true, "imagesLoaded": true}'>
<div class="col-md-6 col-xl-4 col-wd-3 pb-4 pb-md-7">
<!-- Card -->
<div class="card border shadow p-2 rounded-lg sk-fade">
<!-- Image -->
<div class="card-zoom position-relative">
<div class="badge-float sk-fade-top top-0 right-0 mt-4 mr-4">
<a href="@@webRoot/course-single-v5.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 mr-1 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-eye.svg")
</a>
<a href="@@webRoot/course-single-v5.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-heart.svg")
</a>
</div>
<a href="@@webRoot/course-single-v5.html" class="card-img sk-thumbnail img-ratio-9 d-block">
<img class="rounded shadow-light-lg" src="assets/img/products/product-7.jpg" alt="...">
</a>
<span class="badge sk-fade-bottom badge-lg badge-orange badge-pill badge-float bottom-0 left-0 mb-4 ml-4">
<span class="text-white text-uppercase font-weight-bold font-size-xs">BEST SELLER</span>
</span>
</div>
<!-- Footer -->
<div class="card-footer px-2 pb-2 mb-1 pt-4 position-relative">
<a href="@@webRoot/course-single-v5.html" class="d-block">
<div class="avatar avatar-xl badge-float position-absolute top-0 right-0 mt-n6 mr-5 rounded-circle shadow border border-white border-w-lg">
<img src="assets/img/avatars/avatar-1.jpg" alt="..." class="avatar-img rounded-circle">
</div>
</a>
<!-- Preheading -->
<a href="@@webRoot/course-single-v5.html"><span class="mb-1 d-inline-block text-gray-800">Photography</span></a>
<!-- Heading -->
<div class="position-relative">
<a href="@@webRoot/course-single-v5.html" class="d-block stretched-link"><h4 class="line-clamp-2 h-md-48 h-lg-58 mr-md-6 mr-lg-10 mr-xl-4 mb-2">Fashion Photography From Professional</h4></a>
<div class="d-lg-flex align-items-end flex-wrap mb-n1">
<div class="star-rating mb-2 mb-lg-0 mr-lg-3">
<div class="rating" style="width:50%;"></div>
</div>
<div class="font-size-sm">
<span>5.45 (5.8k+ reviews)</span>
</div>
</div>
<div class="row mx-n2 align-items-end">
<div class="col px-2">
<ul class="nav mx-n3">
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-reader.svg")
</div>
<div class="font-size-sm">5 lessons</div>
</div>
</li>
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-clock.svg")
</div>
<div class="font-size-sm">8h 12m</div>
</div>
</li>
</ul>
</div>
<div class="col-auto px-2 text-right">
<del class="font-size-sm">$959</del>
<ins class="h4 mb-0 d-block mb-lg-n1">$415.99</ins>
</div>
</div>
</div>
</div>
</div>
</div>
-----------v8
<div class="mx-n4 mb-3" data-flickity='{"pageDots": true, "prevNextButtons": false, "cellAlign": "left", "wrapAround": true, "imagesLoaded": true}'>
<div class="col-12 col-md-6 col-xl-4 pb-4 pb-md-7">
<!-- Card -->
<div class="card border shadow p-2 sk-fade">
<!-- Image -->
<div class="card-zoom position-relative">
<div class="badge-float sk-fade-top top-0 right-0 mt-4 mr-4">
<a href="@@webRoot/course-single-v2.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 mr-1 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-eye.svg")
</a>
<a href="@@webRoot/course-single-v2.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-heart.svg")
</a>
</div>
<a href="@@webRoot/course-single-v2.html" class="card-img sk-thumbnail d-block">
<img class="rounded shadow-light-lg" src="assets/img/products/product-7.jpg" alt="...">
</a>
<span class="badge sk-fade-bottom badge-lg badge-orange badge-pill badge-float bottom-0 left-0 mb-4 ml-4">
<span class="text-white text-uppercase font-weight-bold font-size-xs">BEST SELLER</span>
</span>
</div>
<!-- Footer -->
<div class="card-footer px-2 pb-2 mb-1 pt-4 position-relative">
<a href="#" class="d-block">
<div class="avatar avatar-xl badge-float position-absolute top-0 right-0 mt-n6 mr-5 rounded-circle shadow border border-white border-w-lg">
<img src="assets/img/avatars/avatar-1.jpg" alt="..." class="avatar-img rounded-circle">
</div>
</a>
<!-- Preheading -->
<a href="@@webRoot/course-single-v2.html"><span class="mb-1 d-inline-block text-gray-800">Photography</span></a>
<!-- Heading -->
<div class="position-relative">
<a href="@@webRoot/course-single-v2.html" class="d-block stretched-link"><h4 class="line-clamp-2 h-md-48 h-lg-58 mr-md-6 mr-lg-10 mr-xl-4 mb-2">Fashion Photography From Professional</h4></a>
<div class="d-lg-flex align-items-end flex-wrap mb-n1">
<div class="star-rating mb-2 mb-lg-0 mr-lg-3">
<div class="rating" style="width:50%;"></div>
</div>
<div class="font-size-sm">
<span>5.45 (5.8k+ reviews)</span>
</div>
</div>
<div class="row mx-n2 align-items-end">
<div class="col px-2">
<ul class="nav mx-n3">
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-reader.svg")
</div>
<div class="font-size-sm">5 lessons</div>
</div>
</li>
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-clock.svg")
</div>
<div class="font-size-sm">8h 12m</div>
</div>
</li>
</ul>
</div>
<div class="col-auto px-2 text-right">
<del class="font-size-sm">$959</del>
<ins class="h4 mb-0 d-block mb-lg-n1">$415.99</ins>
</div>
</div>
</div>
</div>
</div>
</div>
----------v15
<div class="mx-n4 flickity-button-outset flickity-dot-light" data-flickity='{"pageDots": true, "prevNextButtons": false, "cellAlign": "left", "wrapAround": true, "imagesLoaded": true}'>
<div class="col-12 col-md-6 col-xl-4 pb-4 pb-md-7">
<!-- Card -->
<div class="card border rounded-xl shadow p-2 sk-fade font-nunito">
<!-- Image -->
<div class="card-zoom position-relative">
<div class="badge-float sk-fade-top top-0 right-0 mt-4 mr-4">
<a href="@@webRoot/course-single-v4.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 mr-1 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-eye.svg")
</a>
<a href="@@webRoot/course-single-v4.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-heart.svg")
</a>
</div>
<a href="@@webRoot/course-single-v4.html" class="card-img sk-thumbnail d-block">
<img class="rounded shadow-light-lg" src="assets/img/products/product-17.jpg" alt="...">
</a>
<span class="badge sk-fade-bottom badge-lg badge-orange badge-pill badge-float bottom-0 left-0 mb-4 ml-4">
<span class="text-white text-uppercase font-weight-bold font-size-xs">BEST SELLER</span>
</span>
</div>
<!-- Footer -->
<div class="card-footer px-2 pb-2 mb-1 pt-4 position-relative">
<a href="@@webRoot/course-single-v4.html" class="d-block">
<div class="avatar avatar-xl badge-float position-absolute top-0 right-0 mt-n6 mr-5 rounded-circle shadow border border-white border-w-lg">
<img src="assets/img/avatars/avatar-1.jpg" alt="..." class="avatar-img rounded-circle">
</div>
</a>
<!-- Preheading -->
<a href="@@webRoot/course-single-v4.html"><span class="mb-1 d-inline-block text-gray-800">Photography</span></a>
<!-- Heading -->
<div class="position-relative">
<a href="@@webRoot/course-single-v4.html" class="d-block stretched-link"><h5 class="line-clamp-2 h-md-48 font-weight-bold mr-xl-3">Fashion Photography From Professional</h5></a>
<div class="d-lg-flex align-items-end flex-wrap mb-n1">
<div class="star-rating mb-2 mb-lg-0 mr-lg-3">
<div class="rating" style="width:50%;"></div>
</div>
<div class="font-size-sm">
<span>5.45 (5.8k+ reviews)</span>
</div>
</div>
<div class="row mx-n2 align-items-end">
<div class="col px-2">
<ul class="nav mx-n3">
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-reader.svg")
</div>
<div class="font-size-sm">5 lessons</div>
</div>
</li>
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-clock.svg")
</div>
<div class="font-size-sm">8h 12m</div>
</div>
</li>
</ul>
</div>
<div class="col-auto px-2 text-right">
<del class="font-size-sm">$959</del>
<ins class="h5 font-weight-bold mb-0 d-block mb-lg-n1">$415.99</ins>
</div>
</div>
</div>
</div>
</div>
</div>
-----v10----
<div class="mx-n4 flickity-button-outset" id="courses" data-flickity='{"pageDots": true, "prevNextButtons": true, "cellAlign": "left", "wrapAround": true, "imagesLoaded": true}'>
<div class="col-md-6 col-xl-3 pb-4 pb-md-7">
<!-- Card -->
<div class="card border shadow sk-fade">
<!-- Image -->
<div class="card-zoom position-relative rounded-bottom-0">
<div class="badge-float sk-fade-top top-0 right-0 mt-4 mr-4">
<a href="@@webRoot/course-single-v3.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 mr-1 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-eye.svg")
</a>
<a href="@@webRoot/course-single-v3.html" class="btn btn-xs btn-dark text-white rounded-circle lift opacity-dot-7 p-2 d-inline-flex justify-content-center align-items-center w-36 h-36">
<!-- Icon -->
@@include("assets/img/icons/icon-heart.svg")
</a>
</div>
<a href="@@webRoot/course-single-v3.html" class="card-img sk-thumbnail img-ratio-10 d-block rounded-bottom-0">
<img class="shadow-light-lg" src="assets/img/products/product-15.jpg" alt="...">
</a>
<span class="badge sk-fade-top badge-lg badge-orange badge-pill badge-float top-0 left-0 mt-4 ml-4">
<span class="text-white text-uppercase font-weight-bold font-size-xs">BEST SELLER</span>
</span>
<div class="card-float sk-fade-bottom bottom-0 left-0 mb-3 ml-4">
<ins class="h5 mb-0 text-white">$21.99</ins>
</div>
</div>
<!-- Footer -->
<div class="card-footer p-4 position-relative">
<div class="avatar avatar-lg badge-float position-absolute top-0 right-0 mt-n5 mr-5 rounded-circle shadow border border-white border-w-lg">
<img src="assets/img/avatars/avatar-1.jpg" alt="..." class="avatar-img rounded-circle">
</div>
<!-- Preheading -->
<a href="@@webRoot/course-single-v3.html"><span class="mb-1 d-inline-block text-gray-800">Photography</span></a>
<!-- Heading -->
<a href="@@webRoot/course-single-v3.html" class="d-block"><h5 class="line-clamp-2 h-48 h-lg-58 mb-1">Fashion Photography From Professional</h5></a>
<ul class="nav mx-n3">
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-reader.svg")
</div>
<div class="font-size-sm">5 lessons</div>
</div>
</li>
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-clock.svg")
</div>
<div class="font-size-sm">8h 12m</div>
</div>
</li>
</ul>
</div>
</div>
</div>
----v2-----
<div class="mx-n4" data-flickity='{"pageDots": true, "prevNextButtons": false, "cellAlign": "left", "wrapAround": true, "imagesLoaded": true}'>
<div class="col-md-6 col-lg-4 col-xl-3 pb-4 pb-md-5">
<!-- Card -->
<div class="card border shadow p-2 sk-fade">
<!-- Image -->
<div class="card-zoom position-relative">
<a href="@@webRoot/course-single-v3.html" class="card-img sk-thumbnail img-ratio-3 d-block">
<img class="rounded shadow-light-lg" src="assets/img/products/product-15.jpg" alt="...">
</a>
<span class="sk-fade-right badge-float bottom-0 right-0 mb-2 mr-2">
<ins class="h5 mb-0 text-white">$415.99</ins>
</span>
</div>
<!-- Footer -->
<div class="card-footer px-2 pb-2 mb-1 pt-4 position-relative">
<!-- Preheading -->
<a href="@@webRoot/course-single-v3.html"><span class="mb-1 d-inline-block text-gray-800">Photography</span></a>
<!-- Heading -->
<div class="position-relative">
<a href="@@webRoot/course-single-v3.html" class="d-block stretched-link"><h5 class="line-clamp-2 h-md-48 h-lg-58 mr-md-8 mr-lg-10 mr-xl-4 mb-2">Fashion Photography From Professional</h5></a>
<div class="row mx-n2 align-items-end">
<div class="col px-2">
<ul class="nav mx-n3">
<li class="nav-item px-3">
<div class="d-flex align-items-center">
<div class="mr-2 d-flex icon-uxs text-secondary">
<!-- Icon -->
@@include("assets/img/icons/icon-reader.svg")
</div>
<div class="font-size-sm">5 lessons</div>
</div>
</li>
</ul>
</div>
<div class="col-auto px-2 text-right">
<div class="star-rating mb-2 mb-lg-0">
<div class="rating" style="width:100%;"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Raw
gistfile2.txt
//v14
font-montserrat font-size-sm">
font-weight-semi-bold //title css,tag
font-weight-semi-bold //ins rate
//v11
img-ratio-9 /img link
//v13
font-montserrat font-size-sm
font-weight-semi-bold //title css,tag
font-weight-semi-bold //ins rate
//v6
rounded-lg //card div
img-ratio-9
//v8
//v15
rounded-xl font-nunito
font-weight-bold mr-xl-3 //title css and tag
font-weight-bold<ins>
//v10
img-ratio-10 rounded-bottom-0 //img linkcss
shadow-light-lg //img
sk-fade-bottom top-0 // badge
//v2
col-md-6 col-lg-4 col-xl-3 pb-4 pb-md-5
img-ratio-3
mr-md-8 mr-lg-10 mr-xl-4 mb-2//title
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment