add preview exemples in main exemple
This commit is contained in:
parent
6835bca7d6
commit
04265d8ab8
1 changed files with 69 additions and 1 deletions
70
index.html
70
index.html
|
@ -70,7 +70,7 @@
|
||||||
<ol class="breadcrumb">
|
<ol class="breadcrumb">
|
||||||
<li class="breadcrumb-item"><a href="#">Accueil</a></li>
|
<li class="breadcrumb-item"><a href="#">Accueil</a></li>
|
||||||
<li class="breadcrumb-item"><a href="#">Contenus</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>
|
</ol>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
|
@ -139,6 +139,74 @@ In id suscipit elit.</code></pre>
|
||||||
|
|
||||||
</article>
|
</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> <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> <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> <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> <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">
|
<section class="commentaires">
|
||||||
<h3>Commentaires :</h3>
|
<h3>Commentaires :</h3>
|
||||||
|
|
||||||
|
|
Reference in a new issue