dépôts / lhc / web / clavettes.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: 08c2776)
[HTML+CSS]+page_atelier
authorJohan GIRAUD <johangiraud1@gmail.com>
Thu, 5 Feb 2015 10:26:34 +0000 (11:26 +0100)
committerJohan GIRAUD <johangiraud1@gmail.com>
Thu, 5 Feb 2015 10:26:34 +0000 (11:26 +0100)
css/habillage_page_atelier.css [new file with mode: 0644] patch | blob
css/habillage_page_atelier.scss [new file with mode: 0644] patch | blob
images/logo-heureux-cyclage.png [new file with mode: 0644] patch | blob
images/map.png [new file with mode: 0644] patch | blob
images/siteon3.jpg [new file with mode: 0644] patch | blob
page_atelier.html [new file with mode: 0644] patch | blob

diff --git a/css/habillage_page_atelier.css b/css/habillage_page_atelier.css
new file mode 100644 (file)
index 0000000..fe3fe06
--- /dev/null
+++ b/css/habillage_page_atelier.css
@@ -0,0 +1,46 @@
+header img {
+  width: 70px;
+  height: 101px;
+  position: absolute; }
+
+/*1ERE COLONNE*/
+#ateliers {
+  margin: 0 10px 15px 0;
+  background-color: #edff64; }
+
+#ateliers p {
+  padding: 0 0 0 15px; }
+
+.logoatelier img {
+  width: 100%;
+  padding: 0 15px 0 0; }
+
+address {
+  font-size: 1.2em; }
+
+/*2EME COLONNE*/
+.historique {
+  background-color: #ffd2a1;
+  margin: 0 15px 15px 15px; }
+
+.historique h1 {
+  width: 100%; }
+
+#atelierdescription img {
+  width: 100%; }
+
+/*3EME COLONNE*/
+.map {
+  background-color: #ba59f7;
+  width: 100%;
+  margin: 0 15px 15px 10px; }
+
+.map img {
+  width: 100%; }
+
+.agenda {
+  margin: 0 0 15px 10px;
+  padding-right: 0;
+  background-color: #edff64; }
+
+/*# sourceMappingURL=habillage_page_atelier.css.map */
diff --git a/css/habillage_page_atelier.scss b/css/habillage_page_atelier.scss
new file mode 100644 (file)
index 0000000..66821aa
--- /dev/null
+++ b/css/habillage_page_atelier.scss
@@ -0,0 +1,52 @@
+header img{
+       width:70px;
+       height: 101px;
+       position: absolute;
+}
+
+/*1ERE COLONNE*/
+#ateliers{
+       margin:0 10px 15px 0;
+       background-color: #edff64;
+
+}
+#ateliers p{
+       padding:0 0 0 15px;
+}
+.logoatelier img{
+       width:100%;
+       padding: 0 15px 0 0;
+}
+address{
+       font-size: 1.2em;
+}
+
+/*2EME COLONNE*/
+.historique{
+       background-color: #ffd2a1;
+       margin:0 15px 15px 15px;
+}
+.historique h1{
+       width:100%;
+}
+
+#atelierdescription img{
+       width: 100%;
+
+}
+
+/*3EME COLONNE*/
+.map{
+       background-color: #ba59f7;
+       width: 100%;
+       margin:0 15px 15px 10px;
+
+}
+.map img{
+       width:100%;
+}
+.agenda{
+       margin:0 0 15px 10px;
+       padding-right: 0;
+       background-color: #edff64;
+}
\ No newline at end of file
diff --git a/images/logo-heureux-cyclage.png b/images/logo-heureux-cyclage.png
new file mode 100644 (file)
index 0000000..6e742e1
Binary files /dev/null and b/images/logo-heureux-cyclage.png differ
diff --git a/images/map.png b/images/map.png
new file mode 100644 (file)
index 0000000..8259a17
Binary files /dev/null and b/images/map.png differ
diff --git a/images/siteon3.jpg b/images/siteon3.jpg
new file mode 100644 (file)
index 0000000..09f79c9
Binary files /dev/null and b/images/siteon3.jpg differ
diff --git a/page_atelier.html b/page_atelier.html
new file mode 100644 (file)
index 0000000..8520211
--- /dev/null
+++ b/page_atelier.html
@@ -0,0 +1,94 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<title>Page atelier</title>
+<meta charset="utf-8">
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<link rel="stylesheet" href="css/habillage.css">
+<link rel="stylesheet" href="css/habillage_page_atelier.css">
+</head>
+<body>
+    <header>
+        <a href="#"><img src="images/logo-heureux-cyclage.png"></a>
+    </header>
+    <section id="wrap">
+<!--1ERE COLONNE-->
+                               
+               <div class="col-12 col-m-6 col-l-3">
+                       <div id="ateliers">
+                               <ul>
+                                       <li>
+                                               <a href="#"><h1>Atelier vélo d'Échirolles</h1></a>                                    
+                                               <h2>• Halle du vieux village</h2>
+                           <address>Place du marché 38100 Échirolles</address>
+                                               <p>horaires d'ouverture</p>
+                                       </li>
+                               </ul>
+                       </div>
+                       <div class="logoatelier">
+                               <img src="../clavettes/images/siteon3.jpg" alt="logo atelier le petit vélo"/>
+                       </div>
+               </div>
+<!--2EME COLONNE-->    
+       
+       <div class="col-12 col-m-6 col-l-5">
+               <div id="atelierdescription">
+                       <div class="article">
+                               <h1>Nom de l'atelier</h1>
+                                       <h3><a href="#">Historique</a></h3>
+                                               <p>Tist quaes volo tese porerro ent alia voluptium, ulla quiandic totatio nsequidunt aut exerfer eptatis es sinctibAborerumquis dolupiditi te sa cus asperundae ipsam est, optassumqui ut ut pro quae et dus as eatem iAs sitata velitib eaturehenis qui reatem este magnim qui rero volorion necullaborum faceaqu undiam, ut dolorep eliqu</p>
+                                               <img src="../clavettes/images/velo-nb.png" alt="photo"/>
+                                                       
+                       </div>
+                       <div id="news">
+                <div class="article">
+                       <h1>Derniers articles de l'atelier</h1>
+                                       <h3><a href="#">Date — Auteur</a></h3>
+                                               <p>Tist quaes volo tese porerro ent alia voluptium, ulla quiandic totatio nsequidunt aut exerfer eptatis es sinctibAborerumquis dolupiditi te sa cus asperundae ipsam est, optassumqui ut ut pro quae et dus as eatem iAs sitata velitib eaturehenis qui reatem este magnim qui rero volorion necullaborum faceaqu undiam, ut dolorep eliqu (...)</p>   
+                </div>
+            </div>
+               </div>
+       </div>
+       
+<!--3EME COLONNE-->
+    <div class="col-12 col-m-12 col-l-4">
+               <div class="map">
+               <img src="../clavettes/images/map.png" alt="photo"/>   
+               </div>
+    </div>
+    <div class="col-12 col-m-12 col-l-4">
+            <div class="agenda">
+                <h1>Agenda</h1>
+                <ul>
+                    <li>
+                        <div class="event">
+                            <div class="date">
+                                <p>date</p>
+                                <p class="horaire">horaire</p>
+                            </div>
+                            <div class="nature">
+                                <p>Un événement trop cool sur le vélo en ville</p>
+                            </div>
+                        </div>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </section>
+       <footer>
+       <div class="textfooter">
+               <ul>
+                       <li>
+                               <h3><a href="#">Licence libre</a></h3>
+                       </li>
+                       <li>
+                               <h3><a href="#">À propos</a></h3>
+                       </li>
+                       <li>
+                               <h3><a href="#">L'Heureux Cyclage</a></h3>
+                       </li>
+               </ul>
+       </div>
+       </footer>
+</body>
+</html>
Plugin SPIP pour les pages des Clavettes