--- a/integration/v2/18-19-20-21-collection_vue_mosaique.html Wed Jun 26 18:22:30 2013 +0200
+++ b/integration/v2/18-19-20-21-collection_vue_mosaique.html Thu Jun 27 11:09:25 2013 +0200
@@ -156,23 +156,25 @@
<div class="clearfix">
<div class="filters-wrap float-left">
<ul class="filters">
- <li class="box-shadow-2"><a class="display-keyword" data-keyword="azerty" href="#">
- Paris, musée Victor Hugo <a class="icon-action cross" href="#"></a>
+ <li class="box-shadow-2"><a class="display-keyword" data-keyword="Musée Grévin" href="#">
+ Musée Grévin <a class="icon-action cross" href="#"></a>
</a></li>
- <li class="box-shadow-2"><a class="display-keyword" data-keyword="lorem" href="#">
- Bonjour hello world lorem ipsum dolor <a class="icon-action cross" href="#"></a>
+ <li class="box-shadow-2"><a class="display-keyword" data-keyword="Beaux Arts" href="#">
+ Beaux Arts <a class="icon-action cross" href="#"></a>
</a></li>
- <li class="box-shadow-2"><a class="display-keyword" data-keyword="ipsum" href="#">
- ipsum tag <a class="icon-action cross" href="#"></a>
+ <li class="box-shadow-2"><a class="display-keyword" data-keyword="éè" href="#">
+ éè <a class="icon-action cross" href="#"></a>
</a></li>
- <li class="box-shadow-2"><a class="display-keyword" data-keyword="hello" href="#">
- hello tag tag it <a class="icon-action cross" href="#"></a>
+ <li class="box-shadow-2"><a class="display-keyword" data-keyword="über ällës" href="#">
+ über ällës <a class="icon-action cross" href="#"></a>
</a></li>
</ul>
</div>
<ul class="list-projets-5 mosaic float-left clearfix masonry-177">
- <li class="item-masonry keyword-azerty">
+
+
+ <li class="item-masonry" data-keywords="Musée Grévin, über ällës, Beaux Arts, éè">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x224.png" alt="">
@@ -198,85 +200,8 @@
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minus aut nostrum omnis cumque maxime delectus numquam natus sapiente enim reiciendis nulla animi praesentium odio cupiditate temporibus! Nisi alias eius animi.</p>
</div>
</li>
- <li class="item-masonry keyword-ipsum">
- <div class="curtain"></div>
- <div class="visuel-project">
- <img src="img/177x264.png" alt="">
- <div class="tools toggle">
- <div class="title-project">
- <h3>Dolores ipsum des dolores</h3>
- <h4>Théodore Chasseriau</h4>
- </div>
- <ul class="clearfix">
- <li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
- <li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
- <li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
- <li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
- <li><a title="Supprimer" class="tool trash" href="#"></a></li>
- </ul>
- </div>
- </div>
- <div class="content-project">
- <div class="title-project">
- <h3>Dolores ipsum des dolores</h3>
- <h4>Théodore Chasseriau</h4>
- </div>
- <p>Lorem ipsum dolor</p>
- </div>
- </li>
- <li class="item-masonry keyword-azerty">
- <div class="curtain"></div>
- <div class="visuel-project">
- <img src="img/177x232.png" alt="">
- <div class="tools toggle">
- <div class="title-project">
- <h3>azerty qwerty allo hello</h3>
- <h4>Théodore Chasseriau</h4>
- </div>
- <ul class="clearfix">
- <li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
- <li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
- <li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
- <li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
- <li><a title="Supprimer" class="tool trash" href="#"></a></li>
- </ul>
- </div>
- </div>
- <div class="content-project">
- <div class="title-project">
- <h3>azerty qwerty allo hello</h3>
- <h4>Théodore Chasseriau</h4>
- </div>
- <p>azerty qwerty allo hello azerty qwerty allo hello</p>
- </div>
- </li>
- <li class="item-masonry keyword-hello">
- <div class="curtain"></div>
- <div class="visuel-project">
- <img src="img/177x224.png" alt="">
- <div class="tools toggle">
- <div class="title-project">
- <h3>Sapho</h3>
- <h4>Théodore Chasseriau</h4>
- </div>
- <ul class="clearfix">
- <li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
- <li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
- <li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
- <li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
- <li><a title="Supprimer" class="tool trash" href="#"></a></li>
- </ul>
- </div>
- </div>
- <div class="content-project">
- <div class="title-project">
- <h3>Sapho</h3>
- <h4>Théodore Chasseriau</h4>
- </div>
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minus aut nostrum omnis cumque maxime delectus numquam natus sapiente enim reiciendis nulla animi praesentium odio cupiditate temporibus! Nisi alias eius animi.</p>
- </div>
- </li>
- <li class="item-masonry keyword-azerty">
+
+ <li class="item-masonry" data-keywords="Beaux Arts">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x264.png" alt="">
@@ -302,33 +227,8 @@
<p>Lorem ipsum dolor</p>
</div>
</li>
- <li class="item-masonry keyword-ipsum">
- <div class="curtain"></div>
- <div class="visuel-project">
- <img src="img/177x232.png" alt="">
- <div class="tools toggle">
- <div class="title-project">
- <h3>azerty qwerty allo hello</h3>
- <h4>Théodore Chasseriau</h4>
- </div>
- <ul class="clearfix">
- <li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
- <li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
- <li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
- <li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
- <li><a title="Supprimer" class="tool trash" href="#"></a></li>
- </ul>
- </div>
- </div>
- <div class="content-project">
- <div class="title-project">
- <h3>azerty qwerty allo hello</h3>
- <h4>Théodore Chasseriau</h4>
- </div>
- <p>azerty qwerty allo hello azerty qwerty allo hello</p>
- </div>
- </li>
- <li class="item-masonry keyword-azerty">
+
+ <li class="item-masonry" data-keywords="éè">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x232.png" alt="">
@@ -354,7 +254,35 @@
<p>azerty qwerty allo hello azerty qwerty allo hello</p>
</div>
</li>
- <li class="item-masonry keyword-lorem">
+
+ <li class="item-masonry" data-keywords="über ällës">
+ <div class="curtain"></div>
+ <div class="visuel-project">
+ <img src="img/177x224.png" alt="">
+ <div class="tools toggle">
+ <div class="title-project">
+ <h3>Sapho</h3>
+ <h4>Théodore Chasseriau</h4>
+ </div>
+ <ul class="clearfix">
+ <li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
+ <li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
+ <li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
+ <li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
+ <li><a title="Supprimer" class="tool trash" href="#"></a></li>
+ </ul>
+ </div>
+ </div>
+ <div class="content-project">
+ <div class="title-project">
+ <h3>Sapho</h3>
+ <h4>Théodore Chasseriau</h4>
+ </div>
+ <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minus aut nostrum omnis cumque maxime delectus numquam natus sapiente enim reiciendis nulla animi praesentium odio cupiditate temporibus! Nisi alias eius animi.</p>
+ </div>
+ </li>
+
+ <li class="item-masonry" data-keywords="Musée Grévin, über ällës">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x224.png" alt="">
@@ -380,7 +308,8 @@
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minus aut nostrum omnis cumque maxime delectus numquam natus sapiente enim reiciendis nulla animi praesentium odio cupiditate temporibus! Nisi alias eius animi.</p>
</div>
</li>
- <li class="item-masonry keyword-hello">
+
+ <li class="item-masonry" data-keywords="Beaux Arts">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x264.png" alt="">
@@ -406,7 +335,8 @@
<p>Lorem ipsum dolor</p>
</div>
</li>
- <li class="item-masonry keyword-lorem">
+
+ <li class="item-masonry" data-keywords="éè">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x232.png" alt="">
@@ -432,6 +362,33 @@
<p>azerty qwerty allo hello azerty qwerty allo hello</p>
</div>
</li>
+
+ <li class="item-masonry" data-keywords="über ällës">
+ <div class="curtain"></div>
+ <div class="visuel-project">
+ <img src="img/177x224.png" alt="">
+ <div class="tools toggle">
+ <div class="title-project">
+ <h3>Sapho</h3>
+ <h4>Théodore Chasseriau</h4>
+ </div>
+ <ul class="clearfix">
+ <li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
+ <li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
+ <li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
+ <li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
+ <li><a title="Supprimer" class="tool trash" href="#"></a></li>
+ </ul>
+ </div>
+ </div>
+ <div class="content-project">
+ <div class="title-project">
+ <h3>Sapho</h3>
+ <h4>Théodore Chasseriau</h4>
+ </div>
+ <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minus aut nostrum omnis cumque maxime delectus numquam natus sapiente enim reiciendis nulla animi praesentium odio cupiditate temporibus! Nisi alias eius animi.</p>
+ </div>
+ </li>
</ul>
</div>