source: spip-zone/_squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/sommaire/sommaire_modeportailcognac.html @ 103526

Last change on this file since 103526 was 103526, checked in by real3t@…, 4 years ago

Crayon à un endroit qui fonctionne

File size: 13.7 KB
Line 
1#SET{LargeurContaineur,(#CONFIG{soyezcreateurs_layout/largeurconteneur,960})}
2#SET{LargeurMenuGauche,(#CONFIG{soyezcreateurs_layout/largeurmenugauche,180})}
3#SET{LargeurMenuDroit,(#CONFIG{soyezcreateurs_layout/largeurmenudroit,180})}
4#SET{Largeurcontent_central,(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}}|moins{#GET{LargeurMenuDroit}})}
5#SET{Largeurcontent_extra,(#GET{LargeurContaineur}|moins{#GET{Largeurcontent_central}})}
6<script type="text/javascript">
7        CanceladjustLayout = true;
8</script>
9<main id="main" role="main"><div id="communiquant_content">
10<a id="letexte"></a>
11
12<!-- SLIDER -->
13<div id="diaporama" class="zone-slider">
14        <header>
15                <h1 class="hide">Diaporama</h1>
16        </header>
17        <div class="slider-slick">
18                <div class="slider show-for-medium" role="region" aria-label="Diaporama d'accueil">
19                        <div class="slider-diapo-imgfull">
20                                <a href="#" title="Lire l'article suivant">
21                                        <img src="https://unsplash.it/1920/580?image=1043" alt="" />
22                                </a>
23                        </div>
24                </div>
25                <div class="slider show-for-medium" role="region" aria-label="Diaporama d'accueil">
26                        <div class="slider-diapo-imgfull">
27                                <a href="#" title="Lire l'article suivant">
28                                        <img src="https://unsplash.it/1920/580?image=103" alt="" />
29                                </a>
30                        </div>
31                </div>
32                <div class="slider show-for-medium" role="region" aria-label="Diaporama d'accueil">
33                        <div class="slider-diapo-imgfull">
34                                <a href="#" title="Lire l'article suivant">
35                                        <img src="https://unsplash.it/1920/580?image=1031" alt="" />
36                                </a>
37                        </div>
38                </div>
39                <div class="slider show-for-medium" role="region" aria-label="Diaporama d'accueil">
40                        <div class="slider-diapo-imgfull">
41                                <a href="#" title="Lire l'article suivant">
42                                        <img src="https://unsplash.it/1920/580?image=83" alt="" />
43                                </a>
44                        </div>
45                </div>
46                <div class="slider show-for-medium" role="region" aria-label="Diaporama d'accueil">
47                        <div class="slider-diapo-imgfull">
48                                <a href="#" title="Lire l'article suivant">
49                                        <img src="https://unsplash.it/1920/580?image=107" alt="" />
50                                </a>
51                        </div>
52                </div>
53                <div class="slider show-for-medium" role="region" aria-label="Diaporama d'accueil">
54                        <div class="slider-diapo-imgfull">
55                                <a href="#" title="Lire l'article suivant">
56                                        <img src="https://unsplash.it/1920/580?image=78" alt="" />
57                                </a>
58                        </div>
59                </div>
60        </div>
61        <div id="liens-diaporama">
62                <ul>
63                        <li>
64                                <a href="#" title="Voir Visite virtuelle">
65                                        <span>Visite virtuelle<br />
66                                        Ville d'art & d'histoire</span>
67                                        <span class="icon icon-arrow-right2 icon-2x">&#10140;</span>
68                                </a>
69                        </li>
70                </ul>
71        </div>
72</div>
73<!-- fin SLIDER -->
74
75<!-- ACTUS -->
76<div id="actualites" class="zone-actus">
77        <header class="titre-sommaire">
78                <h1>En ce moment à Cognac</h1>
79        </header>
80        <div class="row" id="masonry" role="region" aria-label="Actualités">
81                <div class="grid">
82                        <div class="grid-item">
83                                <div class="content-actus">
84                                        <a href="#" title="Lire l'article">
85                                                <img src="https://unsplash.it/308/340?image=118" alt="" />
86                                                <div class="h2"><span class="titre-actus">Recyclez vos sapins de Noël</span>
87                                                        <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
88                                        </a>
89                                </div>
90                        </div>
91                        <div class="grid-item grid-item-x2">
92                                <div class="content-actus">
93                                        <a href="#" title="Lire l'article">
94                                                <img src="https://unsplash.it/638/340?image=182" alt="" />
95                                                <div class="h2"><span class="titre-actus">Belle et heureuse année 2017</span>
96                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
97                                        </a>
98                                </div>
99                        </div>
100                        <div class="grid-item ">
101                                <div class="content-actus">
102                                        <a href="#" title="Lire l'article">
103                                                <img src="https://unsplash.it/308/340?image=82" alt="" />
104                                                <div class="h2"><span class="titre-actus">Ville d'art et d'histoire : programme automne</span>
105                                                        <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
106                                        </a>
107                                </div>
108                        </div>
109                        <div class="grid-item">
110                                <div class="content-actus">
111                                        <a href="#" title="Lire l'article">
112                                                <header class="flexbox-center-space-between triadeA texte-blanc">
113                                                        <time itemprop="startDate" title="2017-02-01 14:30:00" datetime="2017-02-01 14:30:00">
114                                                                <span class="dateNombre"><strong>08</strong>&nbsp;/08</span>
115                                                                <span class="dateMois display-block">2107</span>
116                                                        </time>
117                                                        <img src="https://unsplash.it/180/95?image=139" alt="" />
118                                                </header>
119                                                <div class="h2"><span class="titre-actus">Conférence du GREH au Centre des congrés</span>
120                                                        <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
121                                        </a>
122                                </div>
123                                <div class="content-actus">
124                                        <a href="#" title="Lire l'article">
125                                                <header class="flexbox-center-space-between triadeA texte-blanc">
126                                                        <time itemprop="startDate" title="2017-02-01 14:30:00" datetime="2017-02-01 14:30:00">
127                                                                <span class="dateNombre"><strong>11</strong>&nbsp;/01</span>
128                                                                <span class="dateMois display-block">2107</span>
129                                                        </time>
130                                                        <img src="https://unsplash.it/180/95?image=200" alt="" />
131                                                </header>
132                                                <div class="h2"><span class="titre-actus">Fritz Baueur au ciné-club, Le Galaxy, salle N°2</span>
133                                                        <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
134                                        </a>
135                                </div>
136                        </div>
137                        <div class="grid-item">
138                                <div class="content-actus">
139                                        <a href="#" title="Lire l'article">
140                                                <img src="https://unsplash.it/308/340?image=53" alt="" />
141                                                <div class="h2"><span class="titre-actus">Fête des papilles au MACO</span>
142                                                        <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
143                                        </a>
144                                </div>
145                        </div>
146                        <div class="grid-item grid-item-x2">
147                                <div class="content-actus">
148                                        <a href="#" title="Lire l'article">
149                                                <img src="https://unsplash.it/638/340?image=87" alt="" />
150                                                <div class="h2"><span class="titre-actus">Nuit de la lecture, le samedi 14 janvier de 17h à 21h à la Bibliothèque municipale</span>
151                                                        <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
152                                        </a>
153                                </div>
154                        </div>
155                        <div class="grid-item">
156                                <div class="content-actus">
157                                        <a href="#" title="Lire l'article">
158                                                <img src="https://unsplash.it/308/340?image=172" alt="" />
159                                                <div class="h2"><span class="titre-actus">Recyclez vos sapins de Noël</span>
160                                                        <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
161                                        </a>
162                                </div>
163                        </div>
164                        <div class="grid-item grid-item-x3">
165                                <div class="content-actus">
166                                        <a href="#" title="Lire l'article">
167                                                <img src="https://unsplash.it/955/340?image=252" alt="" />
168                                                <div class="h2"><span class="titre-actus">Recyclez vos sapins de Noël</span>
169                                                        <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
170                                        </a>
171                                </div>
172                        </div>
173                        <div class="grid-item grid-item-x2">
174                                <div class="content-actus">
175                                        <a href="#" title="Lire l'article">
176                                                <img src="https://unsplash.it/638/340?image=382" alt="" />
177                                                <div class="h2"><span class="titre-actus">Recyclez vos sapins de Noël</span>
178                                                        <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
179                                        </a>
180                                </div>
181                        </div>
182                        <div class="grid-item">
183                                <div class="content-actus">
184                                        <a href="#" title="Lire l'article">
185                                                <img src="https://unsplash.it/308/340?image=102" alt="" />
186                                                <div class="h2"><span class="titre-actus">Recyclez vos sapins de Noël</span>
187                                                        <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
188                                        </a>
189                                </div>
190                        </div>
191                        <div class="grid-item">
192                                <div class="content-actus">
193                                        <a href="#" title="Lire l'article">
194                                                <img src="https://unsplash.it/308/340?image=122" alt="" />
195                                                <div class="h2"><span class="titre-actus">Recyclez vos sapins de Noël</span>
196                                                        <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
197                                        </a>
198                                </div>
199                        </div>
200                </div>
201        </div>
202        <div class="text-center avec-margin-top avec-margin-bottom">
203                <a class="button texte-blanc triadeA" href="#" title="Consulter les atualités">Consulter toutes les actualités</a>
204        </div>
205</div>
206<!-- fin ACTUS -->
207
208<B_DessousBreves>
209<!-- PROJETS -->
210<div id="lesprojets" class="zone-projets">
211        <header class="titre-sommaire">
212                <h1>Les projets</h1>
213        </header>
214        <div id="projets" class="avec-margin-top">
215                <BOUCLE_DessousBreves(RUBRIQUES){titre_mot = DessousBreves }{par num titre}>
216                <div class="projet idprojet#COMPTEUR_BOUCLE #EDIT{titre}">
217                        <div class="content-projets">
218                                <a href="#URL_RUBRIQUE"[ title="(#DESCRIPTIF|attribut_html)"]>
219                                        <h2>#TITRE</h2>
220                                        <div class="suite">
221                                                <span class="icon icon-arrow-right2">&#10140;</span>
222                                        </div>
223                                </a>
224                        </div>
225                </div>
226                </BOUCLE_DessousBreves>
227        </div>
228        <div class="clearfix"></div>
229</div>
230<!-- fin PROJETS -->
231</B_DessousBreves>
232
233<!-- PRATIQUE -->
234<div id="pratique" class="zone-pratique">
235        <header class="titre-sommaire">
236                <h1>Cognac pratique</h1>
237        </header>
238        <div role="region" aria-label="Pratique">
239                <div class="slider-pratique">
240                        <div class="content-pratique">
241                                <a href="#" title="Lire l'article">
242                                        <img src="https://unsplash.it/280/190?image=118" alt="" />
243                                        <div class="h2"><span class="titre-pratique">Agenda</span>
244                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
245                                </a>
246                        </div>
247                        <div class="content-pratique">
248                                <a href="#" title="Lire l'article">
249                                        <img src="https://unsplash.it/280/190?image=182" alt="" />
250                                        <div class="h2"><span class="titre-pratique">Cantine</span>
251                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
252                                </a>
253                        </div>
254                        <div class="content-pratique">
255                                <a href="#" title="Lire l'article">
256                                        <img src="https://unsplash.it/280/190?image=18" alt="" />
257                                        <div class="h2"><span class="titre-pratique">Piscine</span>
258                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
259                                </a>
260                        </div>
261                        <div class="content-pratique">
262                                <a href="#" title="Lire l'article">
263                                        <img src="https://unsplash.it/280/190?image=182" alt="" />
264                                        <div class="h2"><span class="titre-pratique">Le mag</span>
265                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
266                                </a>
267                        </div>
268                        <div class="content-pratique">
269                                <a href="#" title="Lire l'article">
270                                        <img src="https://unsplash.it/280/190?image=118" alt="" />
271                                        <div class="h2"><span class="titre-pratique">Compte citoyen</span>
272                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
273                                </a>
274                        </div>
275                        <div class="content-pratique">
276                                <a href="#" title="Lire l'article">
277                                        <img src="https://unsplash.it/280/190?image=82" alt="" />
278                                        <div class="h2"><span class="titre-pratique">Démarches en ligne</span>
279                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
280                                </a>
281                        </div>
282                        <div class="content-pratique">
283                                <a href="#" title="Lire l'article">
284                                        <img src="https://unsplash.it/280/190?image=28" alt="" />
285                                        <div class="h2"><span class="titre-pratique">Recyclez vos sapins de Noël</span>
286                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
287                                </a>
288                        </div>
289                        <div class="content-pratique">
290                                <a href="#" title="Lire l'article">
291                                        <img src="https://unsplash.it/280/190?image=132" alt="" />
292                                        <div class="h2"><span class="titre-pratique">Recyclez vos sapins de Noël</span>
293                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
294                                </a>
295                        </div>
296                        <div class="content-pratique">
297                                <a href="#" title="Lire l'article">
298                                        <img src="https://unsplash.it/280/190?image=148" alt="" />
299                                        <div class="h2"><span class="titre-pratique">Recyclez vos sapins de Noël</span>
300                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
301                                </a>
302                        </div>
303                        <div class="content-pratique">
304                                <a href="#" title="Lire l'article">
305                                        <img src="https://unsplash.it/280/190?image=184" alt="" />
306                                        <div class="h2"><span class="titre-pratique">Recyclez vos sapins de Noël</span>
307                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
308                                </a>
309                        </div>
310                        <div class="content-pratique">
311                                <a href="#" title="Lire l'article">
312                                        <img src="https://unsplash.it/280/190?image=238" alt="" />
313                                        <div class="h2"><span class="titre-pratique">Recyclez vos sapins de Noël</span>
314                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
315                                </a>
316                        </div>
317                        <div class="content-pratique">
318                                <a href="#" title="Lire l'article">
319                                        <img src="https://unsplash.it/280/190?image=282" alt="" />
320                                        <div class="h2"><span class="titre-pratique">Recyclez vos sapins de Noël</span>
321                                                <span class="icon icon-arrow-right2 icon-lg">&#10140;</span></div>
322                                </a>
323                        </div>
324                </div>
325        </div>
326</div>
327<!-- fin PRATIQUE -->
328
329</div><!-- communiquant_content --></main>
330
331[<script src="(#CHEMIN{javascript/masonry.pkgd.min.js})" type="text/javascript"></script>]
332[<script src="(#CHEMIN{javascript/imagesloaded.pkgd.min.js})" type="text/javascript"></script>]
333<script type="text/javascript">
334        // slider Slick
335        $(document).ready(function(){
336                $('.slider-slick').slick({
337                  autoplay: true,
338                  pauseOnHover: true,
339                  autoplaySpeed: #CONFIG{soyezcreateurs/vitesse_slider,10000},
340                  fade: true,
341                  cssEase: 'linear',
342                  arrows: false,
343                  dots: true,
344                  centerMode: true,
345                  focusOnSelect: true
346                });
347                $('.slider-pratique').slick({
348                  dots: false,
349                  slidesToShow: 7,
350                  infinite: true,
351                  variableWidth: true
352                });
353        });
354        // external js: masonry.pkgd.js, imagesloaded.pkgd.js
355        // init Masonry after all images have loaded
356        var $grid = $('.grid').imagesLoaded( function() {
357          $grid.masonry({
358                itemSelector: '.grid-item',
359                gutter: 20
360          });
361        });
362</script>
363
364#FILTRE{mini_html}
Note: See TracBrowser for help on using the repository browser.