integration/documentaire.html
changeset 14 1d931d99393b
parent 11 95df5542a1ce
child 18 bf333fd74eee
equal deleted inserted replaced
12:7c1ff03a40a7 14:1d931d99393b
    10 
    10 
    11 
    11 
    12 
    12 
    13         <link rel="stylesheet" href="css/reset.css" />
    13         <link rel="stylesheet" href="css/reset.css" />
    14         <link rel="stylesheet" href="css/style.css" />
    14         <link rel="stylesheet" href="css/style.css" />
    15         <link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.8.24.custom.css">
    15         <link rel="stylesheet" href="css/ui-blue/jquery-ui-1.9.0.custom.min.css">
    16         <script src="js/vendor/modernizr-2.6.1.min.js"></script>
    16         <script src="js/vendor/modernizr-2.6.1.min.js"></script>
    17     </head>
    17     </head>
    18     <body>
    18     <body>
    19 
    19 
    20 
    20 
    21 
    21 
    22         <div class="wrap">
    22         <div class="wrap">
    23             <div class="header">
    23             <div class="header">
       
    24 
       
    25                 <div class="logo">
       
    26                   <div class="date">
       
    27                       <span class="year">5</span>
       
    28                       <span class="text">années archivées</span>
       
    29                   </div>
       
    30                 </div>
    24 
    31 
    25                 <div class="recherche-wrap">
    32                 <div class="recherche-wrap">
    26                     <h1><img src="img/mediapart-by-periplus.jpg" alt="" /></h1>
    33                     <h1><img src="img/mediapart-by-periplus.jpg" alt="" /></h1>
    27                     <form action="#">
    34                     <form action="#">
    28                         <p >
    35                         <p >
   102                         </ul>
   109                         </ul>
   103                         <a class="documentaire-lien" title="Voir les dossiers"  href="#"></a>
   110                         <a class="documentaire-lien" title="Voir les dossiers"  href="#"></a>
   104                         <h2></h2>
   111                         <h2></h2>
   105                         <ul>
   112                         <ul>
   106                             <li class="clearfix">
   113                             <li class="clearfix">
   107                                 <atitle="Voir le dossier"  href="#">
   114                                 <a title="Voir le dossier"  href="#">
   108                                 <img src="img/documentaire-visuel.jpg" alt="" />
   115                                 <img src="img/documentaire-visuel.jpg" alt="" />
   109                                 <span class="documentaire-texte">
   116                                 <span class="documentaire-texte">
   110                                     <h3>Terrorisme</h3>
   117                                     <h3>Terrorisme</h3>
   111                                     <p>relation entre elation entre</p>
   118                                     <p>relation entre elation entre</p>
   112                                 </span>
   119                                 </span>
   137                 <div class="content clearfix">
   144                 <div class="content clearfix">
   138                     
   145                     
   139                     
   146                     
   140 
   147 
   141                     <div class="content-left documentaire">
   148                     <div class="content-left documentaire">
   142                       
   149                         <div class="widget-wrapper">
   143                         <div class="widget-wrap">
   150                           <div class="widget-wrap">
   144                             <div class="widget recherche">
   151                               <div class="widget recherche">
   145                                 <h3><a href="#">RECHERCHE</a></h3>
   152                                   <h3><a href="#">RECHERCHE</a></h3>
   146                                 <div class="widget-inner">
   153                                   <div class="widget-inner">
   147                                     <form action="#" method="">
   154                                       <form action="#" method="">
   148                                         <p class="clearfix">
   155                                           <p class="clearfix">
   149                                             <input type="text" name="" placeholder="Rechercher" />
   156                                               <input type="text" name="" placeholder="Rechercher" />
   150                                             <input title="Rechercher" type="submit" value="" />
   157                                               <input title="Rechercher" type="submit" value="" />
   151                                         </p>
   158                                           </p>
   152                                     </form>
   159                                       </form>
   153                                 </div>
   160                                   </div>
   154                             </div><!-- recherche -->
   161                               </div><!-- recherche -->
   155                             <div class="widget classer">
   162                               <div class="widget classer">
   156                                 <h3><a href="#">CLASSER</a></h3>
   163                                   <h3><a href="#">CLASSER</a></h3>
   157                                 <div class="widget-inner">
   164                                   <div class="widget-inner">
   158                                     <form action="#" class="filtre-categorie">
   165                                       <form action="#" class="filtre-categorie">
   159                                         <p><input type="checkbox"> <label for="">International</label> </p>
   166                                           <p><input type="checkbox"> <label for="">International</label> </p>
   160                                         <p><input type="checkbox"> <label for="">International</label> </p>
   167                                           <p><input type="checkbox"> <label for="">International</label> </p>
   161                                         <p><input type="checkbox"> <label for="">International</label> </p>
   168                                           <p><input type="checkbox"> <label for="">International</label> </p>
   162                                     </form>
   169                                       </form>
   163                                 </div>
   170                                   </div>
   164                             </div><!-- classer -->
   171                               </div><!-- classer -->
   165                             <div class="widget filtre">
   172                               <div class="widget filtre">
   166                                 <h3><a href="#">FILTRES</a></h3>
   173                                   <h3><a href="#">FILTRES</a></h3>
   167                                 <div class="widget-inner">
   174                                   <div class="widget-inner">
   168                                     <form action="#" class="filtre-date">
   175                                       <form action="#" class="filtre-date">
   169                                         <p>
   176                                           <p>
   170                                             <label for="">De :</label>
   177                                               <label for="">De :</label>
   171                                             <input type="text" name="dateBegin" class="dateBegin" />
   178                                               <input type="text" name="dateBegin" class="dateBegin" />
   172                                         </p>
   179                                           </p>
   173                                         <p>
   180                                           <p>
   174                                             <label for="">à :</label>
   181                                               <label for="">à :</label>
   175                                             <input type="text" name="dateEnd" class="dateEnd" />
   182                                               <input type="text" name="dateEnd" class="dateEnd" />
   176                                         </p>
   183                                           </p>
   177                                     </form>
   184                                       </form>
   178                                     <h4>Catégories :</h4>
   185                                       <h4>Catégories :</h4>
   179                                     <form action="#" class="filtre-categorie">
   186                                       <form action="#" class="filtre-categorie">
   180                                         <p><input type="checkbox"> <label for="">International</label> </p>
   187                                           <p><input type="checkbox"> <label for="">International</label> </p>
   181                                         <p><input type="checkbox"> <label for="">International</label> </p>
   188                                           <p><input type="checkbox"> <label for="">International</label> </p>
   182                                         <p><input type="checkbox"> <label for="">International</label> </p>
   189                                           <p><input type="checkbox"> <label for="">International</label> </p>
   183                                     </form>
   190                                       </form>
   184                                 </div>
   191                                   </div>
   185                             </div><!-- filtre -->
   192                               </div><!-- filtre -->
   186    
   193      
   187 
   194 
       
   195                           </div>
   188                         </div>
   196                         </div>
   189                     </div>
   197                     </div>
   190 
   198 
   191                     <div class="content-right">
   199                     <div class="content-right">
   192                         
   200                         
   357                         </ul>
   365                         </ul>
   358                     </div>
   366                     </div>
   359                     <div class="footer-partenaire">
   367                     <div class="footer-partenaire">
   360                         <h2>Partenaires</h2>
   368                         <h2>Partenaires</h2>
   361                         <ul>
   369                         <ul>
   362                             <li><a href="#"><img src="img/logo-iri.jpg" alt="" /></a></li>
   370                             <li><a title="iri" href="http://www.iri.centrepompidou.fr/" class="iri"></a></li>
   363                             <li><a href="#"><img src="img/logo-cea.jpg" alt="" /></a></li>
   371                             <li><a title="cea" href="http://www.cea.fr/" class="cea"></a></li>
   364                             <li><a href="#"><img src="img/logo-alcatel.jpg" alt="" /></a></li>
   372                             <li><a title="Alcatel" href="http://www.alcatel-lucent.com" class="alcatel"></a></li>
   365                         </ul>
   373                         </ul>
   366                     </div>
   374                     </div>
   367                     <div class="footer-texte">
   375                     <div class="footer-texte">
   368                         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
   376                         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
   369                         tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
   377                         tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,