integration/image.html
changeset 2 4354d94c6d85
child 3 3c62d8c7fb39
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/integration/image.html	Fri Jan 18 18:27:32 2013 +0100
@@ -0,0 +1,148 @@
+<!DOCTYPE html>
+<html lang="fr">
+    <head>
+        <meta charset="utf-8" />
+        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+        <title>eGonomy &raquo; Image</title>
+        
+        <link rel="stylesheet" type="text/css" href="css/egonomy.css" />
+    </head>
+
+    <body>
+        <div class="header-wrap fullwidth">
+            <header>
+                <h1 class="column column-third">TagItAll by eGonomy</h1>
+                <form class="column column-third">
+                    <input class="search-field" type="search" placeholder="Rechercher" />
+                </form>
+                <nav class="column column-third">
+                    <a href="#">Se connecter</a>
+                </nav>
+            </header>
+        </div>
+        <div class="main-wrap fullwidth">
+
+            <div class="main">
+                <div class="fullwidth">
+                    <div class="column column-half">
+                        <h2>Titre de l'image</h2>
+                        <div class="fullphoto placeholder">
+                            Photo à annoter
+                        </div>
+                    </div>
+                    <div class="column column-half">
+                        <table class="image-metadata">
+                            <tr>
+                                <th>Description&nbsp;:</th>
+                                <td>Lorem Ipsum, Ceci est la description de l'&oelig;uvre représentée dans l'image.</td>
+                            </tr>
+                            <tr>
+                                <th>Localisation&nbsp;:</th>
+                                <td>Musée du Louvre, Paris.</td>
+                            </tr>
+                        </table>
+                        <h2>Mots-clés</h2>
+                        <table class="image-keywords">
+                            <thead>
+                                <tr>
+                                    <th>Mot-clé</th>
+                                    <th>Relation à l'image</th>
+                                    <th>Source / Annoté par</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>Louis XV</td>
+                                    <td>est représenté(e)</td>
+                                    <td>Import Base RMN</td>
+                                </tr>
+                                <tr>
+                                    <td>Marcel Duchamp</td>
+                                    <td>est l'auteur</td>
+                                    <td>Import Base RMN</td>
+                                </tr>
+                                <tr>
+                                    <td>Paris</td>
+                                    <td>est représenté(e)</td>
+                                    <td>Enrichissement Pertimm</td>
+                                </tr>
+                                <tr>
+                                    <td>Liberté</td>
+                                    <td>est symbolisé(e)</td>
+                                    <td>Julien75</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                        <div class="fullwidth">
+                            <a href="#" class="add-button">+ Ajouter un mot-clé</a>
+                        </div>
+                        <div class="fullwidth">
+                            <a href="#" class="big-button">Créer un fragment</a>
+                            <a href="#" class="big-button">Créer un Renkan</a>
+                        </div>
+                    </div>
+                </div>
+                <div class="fullwidth">
+                    <div class="column column-half">
+                        <h2>Fragments de cette image</h2>
+                        <div class="fullwidth">
+                            <div class="subcol subcol-half-fourth">
+                                <div class="img-eighth placeholder"></div>
+                                <h3>Titre du fragment</h3>
+                                <p>Annoté par <strong>Julien75</strong></p>
+                            </div>
+                            <div class="subcol subcol-half-fourth">
+                                <div class="img-eighth placeholder"></div>
+                                <h3>Titre du fragment</h3>
+                                <p>Annoté par <strong>Julien75</strong></p>
+                            </div>
+                            <div class="subcol subcol-half-fourth">
+                                <div class="img-eighth placeholder"></div>
+                                <h3>Titre du fragment</h3>
+                                <p>Annoté par <strong>Julien75</strong></p>
+                            </div>
+                            <div class="subcol subcol-half-fourth">
+                                <div class="img-eighth placeholder"></div>
+                                <h3>Titre du fragment</h3>
+                                <p>Annoté par <strong>Julien75</strong></p>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="column column-half">
+                        <h2>Renkans utilisant cette image</h2>
+                        <div class="fullwidth">
+                            <div class="subcol subcol-half-fourth">
+                                <div class="img-eighth placeholder"></div>
+                                <h3>Titre du Renkan</h3>
+                                <p>Créé par <strong>Julien75</strong></p>
+                            </div>
+                            <div class="subcol subcol-half-fourth">
+                                <div class="img-eighth placeholder"></div>
+                                <h3>Titre du Renkan</h3>
+                                <p>Créé par <strong>Julien75</strong></p>
+                            </div>
+                            <div class="subcol subcol-half-fourth">
+                                <div class="img-eighth placeholder"></div>
+                                <h3>Titre du Renkan</h3>
+                                <p>Créé par <strong>Julien75</strong></p>
+                            </div>
+                            <div class="subcol subcol-half-fourth">
+                                <div class="img-eighth placeholder"></div>
+                                <h3>Titre du Renkan</h3>
+                                <p>Créé par <strong>Julien75</strong></p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                
+                <footer class="fullwidth">
+                    <ul class="footer-list">
+                        <li>&copy; IRI 2013</li>
+                    </ul>
+                </footer>
+            
+            </div>
+
+        </div>
+    </body>
+</html>