Mercurial Mercurial > platform / diff
summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | file | latest | revisions | annotate | diff | comparison | raw | help
Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
crea/inte-crea/home.html
changeset 211 7d0146012cd5
parent 210 76a76267a1c1
child 212 37dd17a1e48b 
--- a/crea/inte-crea/home.html	Tue Oct 25 18:14:00 2011 +0200
+++ b/crea/inte-crea/home.html	Wed Oct 26 16:51:02 2011 +0200
@@ -4,6 +4,7 @@
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <title>Plateforme LDT : Home</title>
     <link rel="stylesheet" href="css/ldt-commun.css" type="text-css" />
+    <link rel="stylesheet" href="css/ldt-home.css" type="text-css" />
 </head>
 <body>
 
@@ -39,29 +40,150 @@
             <li class="li_h2">
                 <h2>Derniers médias</h2>
             </li>
-            <li class="cols_4">
-                <img src="img/placeholder.png" width="300" height="225" />
+            <li class="li_media">
+                <a href="#"><img src="img/placeholder_16_9.jpg" width="294" height="165" /></a>
                 <div class="bulle_annot">250</div>
                 <p><a href="#"><b>ENMI 2011 - La confiance : Bernard Stiegler</b></a></p>
                 <p>par <a class="under" href="#">IRI</a> | 1h30</p>
             </li>
-            <li class="cols_4">
-                <img src="img/placeholder.png" width="300" height="225" />
+            <li class="li_media">
+                <a href="#"><img src="img/placeholder_16_9.jpg" width="294" height="165" /></a>
                 <div class="bulle_annot">250</div>
                 <p><a href="#"><b>ENMI 2011 - La confiance : Bernard Stiegler</b></a></p>
                 <p>par <a class="under" href="#">IRI</a> | 1h30</p>
             </li>
-            <li class="cols_4">
-                <img src="img/placeholder.png" width="300" height="225" />
+            <li class="li_media">
+                <a href="#"><img src="img/placeholder_16_9.jpg" width="294" height="165" /></a>
                 <div class="bulle_annot">250</div>
                 <p><a href="#"><b>ENMI 2011 - La confiance : Bernard Stiegler</b></a></p>
                 <p>par <a class="under" href="#">IRI</a> | 1h30</p>
             </li>
         </ul>
+        
+<!-- MEDIAS LES PLUS ANNOTÉS -->
+
+        <ul class="floatlist" id="plus_annotes">
+            <li class="li_h2">
+                <h2>Médias les plus annotés</h2>
+            </li>
+            <li class="li_media">
+                <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
+                <div class="bulle_annot">120</div>
+                <p><a href="#"><b>Lorem Ipsum</b></a></p>
+                <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
+            </li>
+            <li class="li_media">
+                <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
+                <div class="bulle_annot">120</div>
+                <p><a href="#"><b>Lorem Ipsum</b></a></p>
+                <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
+            </li>
+            <li class="li_media">
+                <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
+                <div class="bulle_annot">120</div>
+                <p><a href="#"><b>Lorem Ipsum</b></a></p>
+                <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
+            </li>
+            <li class="li_media">
+                <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
+                <div class="bulle_annot">120</div>
+                <p><a href="#"><b>Lorem Ipsum</b></a></p>
+                <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
+            </li>
+            <li class="li_media">
+                <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
+                <div class="bulle_annot">120</div>
+                <p><a href="#"><b>Lorem Ipsum</b></a></p>
+                <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
+            </li>
+            <li class="li_media">
+                <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
+                <div class="bulle_annot">120</div>
+                <p><a href="#"><b>Lorem Ipsum</b></a></p>
+                <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
+            </li>
+            <li class="li_media">
+                <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
+                <div class="bulle_annot">120</div>
+                <p><a href="#"><b>Lorem Ipsum</b></a></p>
+                <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
+            </li>
+            <li class="li_media">
+                <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
+                <div class="bulle_annot">120</div>
+                <p><a href="#"><b>Lorem Ipsum</b></a></p>
+                <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
+            </li>
+        </ul>
+
+<!-- GROUPES ACTIFS -->
+
+        <ul class="floatlist" id="groupes_actifs">
+            <li class="li_h2">
+                <h2>Groupes actifs</h2>
+            </li>
+            <li class="li_media">
+                <div class="img_groupes_actifs">
+                    <a href="#"><img src="img/placeholder_4_3.jpg" width="54" height="40" /></a>
+                </div>
+                <div class="txt_groupes_actifs">
+                    <div class="bulle_people">57</div>
+                    <div class="bulle_annot">32</div>
+                    <p><a href="#" class="under"><b>Regards sur le numérique</b></a></p>
+                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod …</p>
+                </div>
+            </li>
+            <li class="li_media">
+                <div class="img_groupes_actifs">
+                    <a href="#"><img src="img/placeholder_4_3.jpg" width="54" height="40" /></a>
+                    <div class="lock_group"></div>
+                </div>
+                <div class="txt_groupes_actifs">
+                    <div class="bulle_people">57</div>
+                    <div class="bulle_annot">32</div>
+                    <p><a href="#" class="under"><b>Regards sur le numérique</b></a></p>
+                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod …</p>
+                </div>
+            </li>
+            <li class="li_media">
+                <div class="img_groupes_actifs">
+                    <a href="#"><img src="img/placeholder_4_3.jpg" width="54" height="40" /></a>
+                </div>
+                <div class="txt_groupes_actifs">
+                    <div class="bulle_people">57</div>
+                    <div class="bulle_annot">32</div>
+                    <p><a href="#" class="under"><b>Regards sur le numérique</b></a></p>
+                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod …</p>
+                </div>
+            </li>
+            <li class="li_media">
+                <div class="img_groupes_actifs">
+                    <a href="#"><img src="img/placeholder_4_3.jpg" width="54" height="40" /></a>
+                    <div class="lock_group"></div>
+                </div>
+                <div class="txt_groupes_actifs">
+                    <div class="bulle_people">57</div>
+                    <div class="bulle_annot">32</div>
+                    <p><a href="#" class="under"><b>Regards sur le numérique</b></a></p>
+                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod …</p>
+                </div>
+            </li>
+            <li class="li_media">
+                <div class="img_groupes_actifs">
+                    <a href="#"><img src="img/placeholder_4_3.jpg" width="54" height="40" /></a>
+                </div>
+                <div class="txt_groupes_actifs">
+                    <div class="bulle_people">57</div>
+                    <div class="bulle_annot">32</div>
+                    <p><a href="#" class="under"><b>Regards sur le numérique</b></a></p>
+                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod …</p>
+                </div>
+            </li>
+        </ul>
 
 <!-- FOOTER COMMUN -->
 
-        <ul class="full_width" id="footer">
+        <ul id="footer">
             <li>
                 <a href="#">V.01.15</a>
             </li>
platform