source: spip-zone/_squelettes_/escal/branche_V3/config.css.html @ 104432

Last change on this file since 104432 was 104432, checked in by jcvilleneuve@…, 2 years ago

Escal V3 : modification liens de pagination sur mobiles

File size: 18.2 KB
Line 
1#CACHE{0}
2#HTTP_HEADER{Content-Type: text/css;}
3
4/* ======================================================================
5                          LES ELEMENTS
6   ======================================================================*/
7[(#CONFIG{escal/config/pointeurbody}|oui)
8body {
9cursor: [url((#CHEMIN{#CONFIG{escal/config/pointeurbody}}))], auto;
10}]
11[(#CONFIG{escal/config/pointeura}|oui)
12a {
13cursor: [url((#CHEMIN{#CONFIG{escal/config/pointeura}}))], auto;
14}]
15/*
16
17[(#CONFIG{escal/config/ombres}|non)
18#ombre-droite {
19        background: [url((#CHEMIN{images/ombre-droitegris.png}))] repeat-y scroll right center;
20        width: [(#CONFIG{escal/config/largeurlayoutbase,950}|plus{34})]px;
21}
22#ombre-gauche {
23        background: [url((#CHEMIN{images/ombre-gauchegris.png}))] repeat-y scroll left center;
24        margin: 0 auto;
25        width: [(#CONFIG{escal/config/largeurlayoutbase,950}|plus{34})]px;
26}]
27
28[(#CONFIG{escal/config/ombres}|=={gris}|oui)
29#ombre-droite {
30        background: [url((#CHEMIN{images/ombre-droitegris.png}))] repeat-y scroll right center;
31  width: [(#CONFIG{escal/config/largeurlayoutbase,950}|plus{34})]px; 
32}
33#ombre-gauche {
34        background: [url((#CHEMIN{images/ombre-gauchegris.png}))] repeat-y scroll left center;
35        margin: 0 auto;
36        width: [(#CONFIG{escal/config/largeurlayoutbase,950}|plus{34})]px;
37}]
38
39[(#CONFIG{escal/config/ombres}|=={blanc}|oui)
40#ombre-droite {
41        background: [url((#CHEMIN{images/ombre-droiteblanc.png}))] repeat-y scroll right center;
42        width: [(#CONFIG{escal/config/largeurlayoutbase,950}|plus{34})]px;
43}
44#ombre-gauche {
45        background: [url((#CHEMIN{images/ombre-gaucheblanc.png}))] repeat-y scroll left center;
46        margin: 0 auto;
47        width: [(#CONFIG{escal/config/largeurlayoutbase,950}|plus{34})]px;
48}]
49[(#CONFIG{escal/config/ombres}|=={noir}|oui)
50#ombre-droite {
51        background: none;
52}
53#ombre-gauche {
54        background: none;
55}
56#conteneur{
57        border-left: 1px solid black;
58        border-right: 1px solid black;
59}]
60[(#CONFIG{escal/config/ombres}|=={non}|oui)
61#ombre-droite {
62        background: none;
63}
64#ombre-gauche {
65        background: none;
66}]
67
68*/
69[(#CONFIG{escal/config/ombres}|=={oui}|oui)
70#ombre-droite {
71        margin: 0 auto;
72        width: [(#CONFIG{escal/config/largeurlayoutbase,950})]px;
73        box-shadow: [(#CONFIG{escal/config/decalombre,5})]px 0 [(#CONFIG{escal/config/degradeombre,10})]px #CONFIG{escal/config/couleurombre,black};
74}
75#ombre-gauche {
76        margin: 0 auto;
77        width: [(#CONFIG{escal/config/largeurlayoutbase,950})]px;
78        box-shadow: -[(#CONFIG{escal/config/decalombre,5})]px 0 [(#CONFIG{escal/config/degradeombre,10})]px #CONFIG{escal/config/couleurombre,black};
79}]
80[(#CONFIG{escal/config/ombres}|=={oui}|non)
81#ombre-droite {
82        background: none;
83}
84#ombre-gauche {
85        background: none;
86}]
87
88
89
90div#bandeau {
91        text-align: [(#CONFIG{escal/config/alignbandeau, left})];
92}
93
94[(#CONFIG{escal/config/nomsite}|=={non}|oui)
95#nom-site-spip {
96  display:  none;
97}]
98
99#nom-site-spip {
100  font-size: [(#CONFIG{escal/config/nomsitetaille,50})]px;
101}
102[(#CONFIG{escal/config/slogansite}|=={non}|oui)
103#slogan-site-spip {
104  display:  none;
105}]
106#slogan-site-spip {
107  font-size: [(#CONFIG{escal/config/slogansitetaille,25})]px;
108}
109[(#CONFIG{escal/config/descriptifsite}|=={non}|oui)
110#descriptif-site-spip {
111  display:  none;
112}]
113#descriptif-site-spip {
114  font-size: [(#CONFIG{escal/config/descriptifsitetaille,12})]px;
115}
116[(#CONFIG{escal/config/nomsite}|=={non}|oui)
117  [(#CONFIG{escal/config/slogansite}|=={non}|oui)
118    [(#CONFIG{escal/config/descriptifsite}|=={non}|oui)
119#titrepage{
120  display:  none;
121  }]]]
122 
123[(#CONFIG{escal/config/espace}|=={haut}|oui) 
124        [(#CONFIG{escal/config/fixespace}|=={oui}|oui)
125#entete .menu.floatable {
126        top: 25px;
127}]]
128
129.laune ul.anchors li a {
130        height: [(#CONFIG{escal/config/hauteurblocsune,85})]px;
131}
132[(#CONFIG{escal/config/nbrecol}|non)
133.laune ul.anchors li {
134        width: 50%;
135}
136]
137[(#CONFIG{escal/config/nbrecol}|=={1}|oui)
138.laune ul.anchors li {
139        width: 100%;
140}
141]
142[(#CONFIG{escal/config/nbrecol}|=={2}|oui)
143.laune ul.anchors li {
144        width: 50%;
145}
146]
147[(#CONFIG{escal/config/nbrecol}|=={3}|oui)
148.laune ul.anchors li {
149        width: 33%;
150}
151]
152
153#annonces-defilantes {
154        height: [(#CONFIG{escal/config/hauteurannoncedefil,210})]px;
155}
156
157.annoncedefil {
158        height: [(#CONFIG{escal/config/hauteurannoncedefil,210}|moins{35})]px;
159}
160/* noisette inc-a_la_une */
161/***********************/
162.laune .texte-autres, .laune .descriptif-autres {
163        margin: 10px 10px 0 [(#CONFIG{escal/config/taillelogoartune,100}|plus{20})]px;
164}
165/* noisette inc-photos */
166/***********************/
167
168#photos-defilantes {
169        height: #CONFIG{escal/config/largeurimagenoisettes,170}px;
170        width: #CONFIG{escal/config/largeurimagenoisettes,170}px;
171}
172.une-photo-defilante {
173        top: #CONFIG{escal/config/largeurimagenoisettes,170}px;
174        line-height: #CONFIG{escal/config/largeurimagenoisettes,170}px;
175}
176
177/* noisette inc-sites_favoris */
178/***********************/
179
180#sites-defilants {
181        height: [(#CONFIG{escal/config/largeurimagenoisettes,170})]px;
182        width: #CONFIG{escal/config/largeurimagenoisettes,170}px;
183}
184.un-site-defilant {
185        top: [(#CONFIG{escal/config/largeurimagenoisettes,170})]px;
186}
187
188/* ======================================================================
189                          LES ICONES
190   ======================================================================*/
191
192/* articles du menu horizontal */
193#menu ul li.article {
194        background: url(#CHEMIN{images/artmenu.png}) no-repeat top left;
195}
196
197/* menu vertical */
198#menuV ul#accueilmenu li {
199  background: url(#CHEMIN{images/accueil.png}) no-repeat top left;
200}
201#menuV ul.rubriques li {
202        background: url(#CHEMIN{images/rubnormal.png}) no-repeat top left;
203}
204#menuV ul.rubriques li.on {
205        background: url(#CHEMIN{images/rubexpose.png}) no-repeat top left;
206}
207#menuV ul.articles li {
208        background: url(#CHEMIN{images/artnormal.png}) no-repeat top left;
209}
210#menuV ul.articles li.on {
211        background: url(#CHEMIN{/images/artexpose.png}) no-repeat top left;
212}
213
214#menuV ul.menugrmots li {
215        background: url(#CHEMIN{images/grmots.png}) no-repeat top left;
216}
217#menuV ul.menumots li {
218        background: url(#CHEMIN{images/artnormal.png}) no-repeat top left;
219}
220#menuV ul.menumots li.on {
221        background: url(#CHEMIN{/images/artexpose.png}) no-repeat top left;
222}
223
224
225/* liens */
226a.spip_out {
227        background: transparent url(#CHEMIN{images/spip_out.gif}) no-repeat scroll right center;
228}
229a.spip_out img {
230        background: none;
231}
232a.spip_mail{
233        background: transparent url(#CHEMIN{images/mail.gif}) no-repeat scroll right center;
234}
235
236/* noisettes dépliables/repliables */
237.toggleimage1 {;
238        background: transparent url(#CHEMIN{images/loupeplus.png}) no-repeat scroll right center;
239}
240.toggleimage2 {
241        background: transparent url(#CHEMIN{images/loupemoins.png}) no-repeat scroll right center;
242}
243
244/* formulaire de recherche */
245.formulaire_recherche input.text {
246        background: url(#CHEMIN{images/loupe.gif}) no-repeat;
247}
248
249/* blocs d'infos d'Escal */
250#texte-article .aide {
251        background-image: url(#CHEMIN{/images/aide.png});
252}
253#texte-article .important {
254        background-image: url(#CHEMIN{/images/important.png});
255}
256#texte-article .avertissement {
257        background-image: url(#CHEMIN{/images/avertissement.png});
258}
259#texte-article .info {
260        background-image: url(#CHEMIN{/images/info.png});
261}
262.spip_cadre, .coloration_code {
263        background-image: url(#CHEMIN{/images/code.png});
264}
265
266
267/* noisette rainette */
268li.meteo {
269        list-style-image: url(#CHEMIN{images/fleche_droite.png})
270}
271/* ======================================================================
272                          LES COULEURS   (pour tout le site)
273   ======================================================================*/
274
275/* les fonds et les textes associés */
276/*************/
277body {
278  background-color: [ (#CONFIG{escal/config/couleurfond,#DFDFDF})];
279  [(#CONFIG{escal/config/imagefond}|?{
280    background-image: url([(#CHEMIN{#CONFIG{escal/config/imagefond}})]);
281    ,
282    [(#CONFIG{escal/config/imagefond2}|?{
283      background-image: url([(#CHEMIN{#CONFIG{escal/config/imagefond2}})]);
284      ,
285      background-image: none;
286      })]
287  })]
288  [(#CONFIG{escal/config/imagefondunique}|=={oui})
289  background-repeat:no-repeat;
290  background-attachment:fixed;
291  background-position: top center;
292  -webkit-background-size: cover; /* pour Chrome et Safari */
293  -moz-background-size: cover; /* pour Firefox */
294  -o-background-size: cover; /* pour Opera */
295  background-size: cover; /* version standardisée */
296  ]
297}
298/* bandeau */
299div#entete {
300        background-color: [(#CONFIG{escal/config/couleur9,#336699})];
301        color:  [(#CONFIG{escal/config/texte01,#FFFFFF})];
302}
303
304/* fond des pages */
305div#conteneur{
306 background-color: [(#CONFIG{escal/config/couleurpage,#FFFFFF})];
307 color:  [(#CONFIG{escal/config/textpage,#000000})];
308
309}
310/* bloc a la une */
311ul.onglets li a.active, ul.onglets li a.active:hover, .laune, .laune .fragment a,
312.contenu_1, .contenu_2, .contenu_3, .contenu_4, .contenu_5, .contenu_6, .contenu_7, .contenu_8, .contenu_9, .contenu_10,
313#cadre-plan, #cadre-plan a, .texte#accueil{
314        background-color: [(#CONFIG{escal/config/couleurune,#336699})];
315        color:  [(#CONFIG{escal/config/textune,#FFFFFF})];
316}
317/* onglets inactifs */
318ul.onglets li a{
319  background-color: [(#CONFIG{escal/config/couleuruneinact,#82ADE2})];
320  color:  [(#CONFIG{escal/config/textuneinact,#000000})];
321}
322/* articles en une */
323.laune ul.anchors li a, .cadre-rubrique-accueil {
324        background-color: [(#CONFIG{escal/config/couleuruneart,#DAE6F6})];
325        color:  [(#CONFIG{escal/config/textuneart,#000000})];
326}
327/* gris */
328.calendar_not_this_month,
329#ariane-forum, table.forum tr.rub-forum,
330#forum-site .descriptif, #forum-site .texte {
331  background-color: [(#CONFIG{escal/config/couleur1,#DFDFDF})];
332  color:  [(#CONFIG{escal/config/text1,#000000})];
333}
334/* blanc */
335#cadre-article, .cadre-sous-rubrique, .cadre-articles-rubrique, .texte-insert,
336table #nav-agenda, .fc-content,
337.valeur2, .valeur3,
338table.forum, .forum-thread, .forum_reponse,
339.trombino, .entry-content, #mentions {
340 background-color: [(#CONFIG{escal/config/couleur2,#FFFFFF})];
341 color:  [(#CONFIG{escal/config/text2,#000000})];
342
343}
344/* bleu fonce de base */
345#cadre-rubrique, #cadre-titre-article, #cadre-titre-article a, .accueil .cadre-chemin, .accueil .cadre-chemin a, .cadre-chemin a, .repondre-article a,
346table.forum th,
347#menu, ul#menu ul, ul#menu li a, .slicknav_menu, .slicknav_menu a,
348#menuV2 ul.menulist a:hover, #menuV2 ul.menulist li.smenu:hover,
349#menuV2 ul.menulist li.smenu>a:hover{
350        background-color: [(#CONFIG{escal/config/couleur3,#336699})];
351        color:  [(#CONFIG{escal/config/text3,#FFFFFF})] !important ;
352}
353/* bleu tres fonce */
354.laune ul.anchors li a:hover, #menu li:hover > a, ul#menu ul li:hover, .cadre-chemin a:hover, .repondre-article a:hover {
355        background-color: [(#CONFIG{escal/config/couleur4,#224466})] ;
356        color:  [(#CONFIG{escal/config/text4}|?{#[(#CONFIG{escal/config/couleur4}|couleur_extreme|couleur_inverser)],#FFFFFF})];
357}
358/* bleu clair */
359.identification-light:hover, .formulaire_recherche input.text:hover,
360table.spip tr.row_first,
361#menuV2 ul.menulist, #menuV2 ul.menulist ul, #menuV2 ul.menulist a,
362.titre-message,
363#formulaire_forum div, .formulaire_spip.formulaire_forum, .small_mini,
364.calendar_head_mini, #entete-evenement, #nouvel-evenement{
365  background-color: [(#CONFIG{escal/config/couleur5,#82ADE2})];
366  color:  [(#CONFIG{escal/config/text5,#000000})];
367}
368/* gris-bleu tres clair */
369.identification-light, .formulaire_recherche input.text,
370table.spip tr.row_even, table.forum tr.art-forum,
371#formulaire-contact,
372.calendar_this_month,
373#documents_portfolio, #ps,
374.forum_reponse .titre-message, #formulaire_forum input.barre,
375#signatures li {
376        background-color: [(#CONFIG{escal/config/couleur6,#EFEFEF})];
377        color:  [(#CONFIG{escal/config/text6,#000000})];
378}
379/* un autre bleu */
380ul#menu li .on, ul#menu li .on > a, #menu li:hover > a.on,  ul#menu ul li.on:hover,
381#formulaire_forum div#previsu, #formulaire_forum div#previsu .forum-message, #formulaire_forum div#previsu .forum-chapo,
382.calendar_this_day,
383table.spip tr.row_odd  {
384        background-color: [(#CONFIG{escal/config/couleur7,#BBCCDD})];
385        color:  [(#CONFIG{escal/config/text7,#000000})];
386}
387/* orange */
388.annonce,.annoncedefil, .une-annonce-defilante, .calendar_mini_event, .spip_surligne {
389        background-color: [(#CONFIG{escal/config/couleur10,#EC7942})];
390  color:  [(#CONFIG{escal/config/text10,#FFFFFF})];
391}
392
393/* le pied */
394#pied {
395        background-color: [(#CONFIG{escal/config/couleur11,#BBCCDD})];
396        color:  [(#CONFIG{escal/config/text11,#000000})];
397}
398
399/* ombre trombinoscope */
400.boite img{
401        box-shadow: 5px 5px 5px [(#CONFIG{escal/config/couleur3,#336699})];
402}
403
404/* les caracteres */
405/******************/
406
407a:link, a.spip_cadre_link {
408        color: [(#CONFIG{escal/config/texte1,#000099})];
409}
410a:visited {
411        color: [(#CONFIG{escal/config/texte2,#000099})];
412}
413
414a:hover, a.zeroclipboard-is-hover,
415ul.onglets li a:hover,
416#cadre-plan a:hover, table.forum a:hover,
417.content a.lien_pagination:hover{
418        color: [(#CONFIG{escal/config/texte3,#FF8000})];
419}
420
421#ariane-forum, #ariane-forum a,
422table.forum tr.rub-forum td, table.forum a, table.forum tr.art-forum td  {
423        color: [(#CONFIG{escal/config/texte4,#336699})];
424}
425
426.alerte1, .alerte {
427        color: [(#CONFIG{escal/config/texte5,#FF0000})];
428}
429.onglet_2{
430        background-color: red !important;
431}
432
433/* les bordures */
434/****************/
435
436ul#menu li a, ul#menu ul {
437        border-color: [(#CONFIG{escal/config/bord1,#CCCCCC})];
438}
439ul.onglets li a {
440  border: 1px solid [(#CONFIG{escal/config/couleuruneinact,#82ADE2})];
441  border-top : 1px solid white;
442}
443ul.onglets li a.active {
444  border: 1px solid [(#CONFIG{escal/config/couleurune,#336699})];
445}
446.cadre-articles-rubrique, .cadre-sous-rubrique, #cadre-article, #documents_portfolio,
447.forum-thread, .forum_reponse,
448#formulaire-contact, .valeur2, .valeur3,
449#signatures li, #signatures li p.message {
450        border-color: [(#CONFIG{escal/config/bord2,#CCCCCC})];
451}
452
453table.spip, table.spip td, table.spip th {
454        border-color: [(#CONFIG{escal/config/bord3,#FFFFFF})];
455}
456
457#menuV2 ul.menulist li {
458        border-color: [(#CONFIG{escal/config/bord4,#FFFFFF})];
459}
460.formulaire_recherche input.text,
461.identification-light,
462ul#menu li a:hover,
463.calendar_mini_event  {
464        border-color: [(#CONFIG{escal/config/bord5,#CCCCCC})];
465}
466
467#ariane-forum, table.forum {
468        border-color: [(#CONFIG{escal/config/bord6,#006699})];
469}
470/*********************************************/
471/*    Les arrondis                           */
472/*********************************************/
473ul#menu li a, ul#menu ul, ul#menu ul li {
474  border-radius: [(#CONFIG{escal/config/arrondi1,10px})];
475}
476#menuV2 ul.menulist, #menuV2 ul.menulist a {
477  border-radius: [(#CONFIG{escal/config/arrondi2,10px})];
478}
479ul.onglets li a {
480  border-radius: [(#CONFIG{escal/config/arrondi31,8px 8px 0px 0px})];
481}
482.laune ul.anchors li a, .cadre-rubrique-accueil {
483  border-radius: [(#CONFIG{escal/config/arrondi32,5px})];
484}
485h1.cadre {
486  border-radius: [(#CONFIG{escal/config/arrondi41,0px 50px 0px 0px})];
487}
488div.texte {
489  border-radius: [(#CONFIG{escal/config/arrondi42,0px 0px 0px 10px / 0px 0px 0px 100px})];
490}
491.identification-light, .formulaire_recherche input.text {
492  border-radius: [(#CONFIG{escal/config/arrondi5,10px})];
493}
494.annonce, .annoncedefil, .une-annonce-defilante {
495  border-radius: [(#CONFIG{escal/config/arrondi6,15px})];
496}
497#entete-evenement, #nouvel-evenement {
498  border-radius: [(#CONFIG{escal/config/arrondi7,8px 8px 0 0})];
499}
500
501/************************************************************************/
502/*    fixation de la barre d'outils sauf si écran de moins de 950px     */
503/************************************************************************/
504@media all and (min-width: 950px) {
505[(#CONFIG{escal/config/espace}|=={haut}|oui)
506[(#CONFIG{escal/config/fixespace}|=={oui}|oui)
507#espace {
508  position: fixed;
509  width: 950px;
510  background-color: #ffffff;
511  z-index: 100;
512
513#entete{
514padding-top: 30px;
515}
516.identification-light, .formulaire_recherche input.text {
517  border-radius: 0;
518}
519]]}
520
521/*********************************************/
522/*    Les cadres latéraux                    */
523/*********************************************/
524
525div.cadre-couleur h1.cadre {
526  background-color: [(#CONFIG{escal/config/couleur5,#82ADE2})];
527  color:  [(#CONFIG{escal/config/text5,#000000})];
528}
529div.cadre-couleur .texte {
530        background-color: [(#CONFIG{escal/config/couleur8,#DAE6F6})];
531        color:  [(#CONFIG{escal/config/text8,#000000})];
532  border-color: [(#CONFIG{escal/config/couleur5,#82ADE2})];
533}
534[(#CONFIG{escal/config/bordcadres}|=={non}|oui)
535div.cadre-couleur .texte {
536  border: none;
537}]
538 /* la noisette inc-liste_auteurs */
539 /*********************************/
540[(#CONFIG{escal/config/iconesauteurs}|=={non}|non)
541.legende_admin{
542  background: [url((#CHEMIN{images/admin.png}))];
543  padding-left: 20px;
544  background-repeat : no-repeat;
545}
546.legende_redacteur{
547        background-image: [url((#CHEMIN{images/redacteur.png}))];
548  padding-left: 20px;
549  background-repeat : no-repeat;
550}
551.legende_visiteur{
552        background-image: [url((#CHEMIN{images/visiteur.png}))];
553  padding-left: 20px;
554  background-repeat : no-repeat;
555}
556]
557.legende_admin, .admin a{
558  color: [(#CONFIG{escal/config/couleuradmin,#FF0066})] !important;
559}
560.legende_redacteur, .redacteur a{
561  color: [(#CONFIG{escal/config/couleurredacteur,#009933})] !important; 
562}
563.legende_visiteur, .visiteur a{
564  color: [(#CONFIG{escal/config/couleurvisiteur,#000000})] !important;
565}
566/*********************************************/
567/*    La page contact                        */
568/*********************************************/
569[(#CONFIG{escal/config/checkbox}|=={non}|oui)
570li#checkbox {
571  display: none;
572}
573]
574/**************************/
575/* Le modele image_fluide */
576/**************************/
577
578dl.image_fluide{
579  width:100%;
580  margin:auto;
581}
582dl.image_fluide img{
583  width:100%;
584  margin: auto;
585  position: static; 
586  height: auto;
587  -ms-interpolation-mode: bicubic;
588  box-sizing: border-box;
589}
590
591/***************************************/
592/* personnalisation du plugin galleria */
593/***************************************/
594.galleria-container {
595 background-color: [(#CONFIG{escal/config/galleriafond,#FFFFFF})];
596}
597.galleria-info-link, .galleria-info-text,
598.galleria-thumb-nav-left,  .galleria-thumb-nav-right {
599        background-color: [(#CONFIG{escal/config/galleriaencarts,#336699})];
600}
601.galleria-info-title, .galleria-info-description {
602        color: [(#CONFIG{escal/config/galleriacoulpolice,#FFFFFF})];
603}
604.galleria-info-title {
605        font-size: [(#CONFIG{escal/config/galleriatailletitre,14})]px;
606}
607.galleria-counter {
608  color: grey !important;
609  opacity: 100 !important;
610}
611
612
613/***************************************/
614/* personnalisation du plugin shoutbox */
615/***************************************/
616.formulaire_shoutbox #contenu_shoutbox_taille{
617        height: [(#CONFIG{escal/config/hauteurshoutbox,200})]px
618}
Note: See TracBrowser for help on using the repository browser.