kazhnuz/bluesky-bootstrap-theme
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

add preview exemples in main exemple

Browse source
This commit is contained in:
Kazhnuz 2018-06-09 18:06:14 +02:00
parent 6835bca7d6
commit 04265d8ab8
1 changed files with 69 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

70
index.html
View file

@ -70,7 +70,7 @@
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Accueil</a></li>
<li class="breadcrumb-item"><a href="#">Contenus</a></li>
<li class="breadcrumb-item active" aria-current="page">#Inktober2017 - Day 29. Masked</li>
<li class="breadcrumb-item active" aria-current="page">Article exemple</li>
</ol>
</nav>
@ -139,6 +139,74 @@ In id suscipit elit.</code></pre>
</article>
<div class="previews-section prev-col-3">
<div class="preview-container">
<article class="card card-preview">
<a href="#" class="preview-link">
<div class="preview-item">
<div class="preview-content"><p class="p-img"><img src="img/wmap.png" alt="Card image cap"></p></div>
<div class="preview-overlay"><h1>Image Exemple</h1></div>
</div>
</a>
<aside class="card-body">
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
<div class="align-left"><i class="fa fa-tags"></i>&nbsp; <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
</aside>
</article>
</div>
<div class="preview-container">
<article class="card card-preview">
<a href="#" class="preview-link">
<div class="preview-item">
<div class="preview-content"><p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. Sed posuere lectus eu orci tristique maximus. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p></div>
<div class="preview-overlay"><h1>Text Exemple</h1></div>
</div>
</a>
<aside class="card-body">
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
<div class="align-left"><i class="fa fa-tags"></i>&nbsp; <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
</aside>
</article>
</div>
<div class="preview-container">
<article class="card card-preview">
<a href="#" class="preview-link">
<div class="preview-item">
<div class="preview-content"><p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. Sed posuere lectus eu orci tristique maximus. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p></div>
<div class="preview-overlay"><h1>Text Exemple</h1></div>
</div>
</a>
<aside class="card-body">
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
<div class="align-left"><i class="fa fa-tags"></i>&nbsp; <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
</aside>
</article>
</div>
<div class="preview-container">
<article class="card card-preview">
<a href="#" class="preview-link">
<div class="preview-item">
<div class="preview-content"><p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. Sed posuere lectus eu orci tristique maximus. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p></div>
<div class="preview-overlay"><h1>Text Exemple</h1></div>
</div>
</a>
<aside class="card-body">
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
<div class="align-left"><i class="fa fa-tags"></i>&nbsp; <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
</aside>
</article>
</div>
</div>
<section class="commentaires">
<h3>Commentaires :</h3>