
Romain19
|
Voilà la feuille de style !
/****************************************** PAGE : éléments d'habillage de la page et éléments communs sur toute la page ******************************************/ body { background-color: #ffffff ; margin: 0; padding: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; text-align: center; } * { font-family: Verdana, Arial, Helvetica, sans-serif; } div#Page, div#NoMenu { position:relative; width: 900px; margin:0 auto; text-align: left; }
/* force le retour à la ligne, le plus souvent appliqué à <br> */ .clear { clear: both; font-size:0; }
/* couleurs des liens */ a { color: #2673bf ; } a:hover { color: #d37324 ; } a:visited { color: #3e78b3 ; } /* images & logos */ img.spip_logos { border:none; padding:2px; } img.smiley { vertical-align:middle; } a img { border:none; }
/* messages d'erreur */ .erreur { color: #d37324 ; }
/****************************************** LOGIN : éléments spécifique au squelette login.html ******************************************/ div#Login { position:relative; width: 900px; margin: 50px auto; padding:5px; text-align: left; border: 2px solid #adc4d9 ; background-color: #f7f7f7 ; -moz-border-radius:10px; } div#Login div#Contenu { margin-top:10px; padding:4px; } div#Login div#Contenu img.spip_logos{ float:left; } div#Login div.spip_encadrer { margin-top:10px; padding:4px; border: 1px solid #adc4d9 ; background-color: #ffffff ; -moz-border-radius:5px; }
/****************************************** ENTETE : éléments des entêtes (titres, logos, ...) des pages (accueil, rubriques, plan, ...) ******************************************/ div#TitreSite { display:none; } div#EntetePage { position:relative; background-color: #e6ecf2 ; border: 2px solid #adc4d9 ; -moz-border-radius: 8px; } div#EntetePage h1 { margin: 3px; padding: 0; color: #2164a6 ; font-size: 36px; font-weight: bold; } div#EntetePage h1 img.spip_logos, div#EntetePage h2 img.spip_logos { vertical-align: middle; border:none; margin:2px; } div#EntetePage h1 div, div#EntetePage h2 div { display:inline; } div#EntetePage h2 { margin: 5px; padding: 0; color: #2164a6 ; font-size: 24px; font-weight: bold; vertical-align:middle; } div#EntetePage h1 a, div#EntetePage h2 a { color: #2164a6 ; text-decoration:none; }
/* barre des boutons sur la page d'accueil (sommaire.html) */ div#EntetePage ul.boutons { position:relative; padding: 0; margin: 0; border-bottom: 1px solid #adc4d9 ; background-color: #f7f7f7 ; text-align:right; -moz-border-radius-topright: 4px; -moz-border-radius-topleft: 4px; } div#EntetePage ul.boutons img.spip_logos{ display:none; } div#EntetePage ul.boutons span { display:inline; } div#EntetePage ul.boutons li { list-style-type: none; display: inline; margin: 0 10px; } div#EntetePage ul.boutons li a { text-decoration:none; font-size:12px; font-weight:bold; color: #2673bf ; } div#EntetePage ul.boutons li a:hover { color: #d37324 ; } div#EntetePage ul.boutons li div { display: inline; }
/****************************************** FORMULAIRE DE RECHERCHE : apparait sur rubrique=16.html, rubrique-16.html, recherche.html et page-404.html ******************************************/ div#EntetePage .rechercher { position:relative; float:right; margin:4px; color: #2164a6 ; font-size: 14px; font-weight: bold; } div#EntetePage .rechercher input.spip_bouton { display:none; } div#EntetePage .rechercher .forml { width:140px; } div#EntetePage .rechercher label { font-size:12px; }
/****************************************** ENTETE DES ARTICLES : éléments des entêtes (titres, logos, ...) des pages articles ******************************************/
div#EnteteArticle { background-color: #e6ecf2 ; border: 2px solid #adc4d9 ; -moz-border-radius: 8px; font-size:12px; } div#EnteteArticle img.spip_logos{ float: left; margin: 4px; border:none; } div#EnteteArticle div.letitre{ float: left; } div#EnteteArticle h2 { margin: 0; padding: 0; color: #5c6166 ; font-size: 22px; font-weight: bold; } div#EnteteArticle div.surtitre, div#EnteteArticle div.soustitre { margin: 0; padding: 0; color: #5c6166 ; font-weight: bold; } /* Message auquel on répond (forum.html) */ div#EnteteArticle dl { margin: 4px; padding:4px; background-color: #ffffff ; border: 1px solid #adc4d9 ; color: #5c6166 ; -moz-border-radius: 6px; }
/* Affichage des auteurs, dates, version imprimable */ div#EnteteArticle ul.auteur { position:relative; border-left: 1px solid #adc4d9 ; background-color: #ffffff ; width:200px; float:right; padding: 2px 8px; margin: 0 0 0 8px; color: #5c6166 ; } div#EnteteArticle ul.auteur li { list-style-type: none; padding: 0; margin: 0; }
/* Boutons suivants et précédents du diaporama */ div.BoutonsPrecedents { position:relative; float:left; margin:4px; } div.BoutonsSuivants { position:relative; float:right; margin:4px; }
/* affichage de l'arborescence sur certaines pages (album, diaporama, agenda, plan, recherche) */ div.arborescence { padding:2px 4px; margin:0; font-size:12px; color: #5c6166 ; border-top: 1px solid #adc4d9 ; background-color: #f7f7f7 ; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; } div.arborescence span { padding:2px 4px; background-image: url(images/deplierhaut.gif); background-repeat: no-repeat; background-position: center center; }
/****************************************** CONTENU : affichage du texte des pages ; affichages des articles, sites référencés pour les rubriques ; etc ... ******************************************/
div#Contenu { position:relative; float:right; width: 650px; margin-top:20px; text-align:justify; font-size:12px; color: #5c6166 ; }
div#NoMenu div#Contenu { float: none; width: 100%; border: none; }
/* affichage des blocs */ div#articles, div#breves, div#sites_web, div#sites_syndiques, div#documents, div#petition, div#rubriques, div#breves, div#secteur, div#edito, div#sites_recherche, div#GroupesMots, div.agenda, div.secteur, div.GroupesMots { border: 2px solid #adc4d9 ; -moz-border-radius: 8px; margin-bottom:20px; } div.suite { text-align:right; font-style: italic; font-size:10px; } div#Contenu h3.titre { margin: 0; padding: 2px; border-bottom: 1px solid #adc4d9 ; background-color: #e6ecf2 ; text-align:center; font-size:16px; font-weight:bold; -moz-border-radius-topright: 4px; -moz-border-radius-topleft: 4px; } div#Contenu h3.titre img.spip_logos{ vertical-align: middle; border:none; margin: 1px; } div#Contenu h3.titre a { text-decoration:none; } div#Contenu h3.titre a:hover { color: #d37324 ; }
/* edito sur la page d'accueil */ div#edito { background-color: #fcffff0 ; } div#edito img.spip_logos { float:left; border:none; margin: 1px; }
/* affichages des listes de définitions, utilisées pour lister les articles, documents, etc ... */ div#Contenu dl { margin: 0 0 5px 0; padding: 4px; } div#Contenu dl.suivants dd { display:none; } div#Contenu dt { margin: 5px 0 0; padding: 0; text-align:left; } div#Contenu dt img { float: left; margin: 2px; } div#Contenu dt strong { font-weight:bold; font-size:14px; } div#Contenu dt em { color: #8a9199 ; font-style: italic; } div#Contenu dd { margin: 0; padding: 2px 0 0 20px; }
/* dernier article sur la page d'accueil */ div#Contenu dl.premier { border-bottom:1px solid #adc4d9 ; } /* liste des signatures de la pétition */ div#Contenu div#petition dd { border-bottom: 1px solid #adc4d9 ; padding-bottom: 2px; margin-bottom: 2px; } /* formulaire de recherche (page 404 + pages secteur 1) */ div#Contenu div.rechercher { text-align:center; } div#Contenu div.rechercher input.forml { width:150px; }
/* affichage de la photo sur l'album-photo */ div#photo { text-align:center; border-bottom: 1px solid #adc4d9 ; } div#photo dl { margin:2px; padding:0; }
/* affichage : texte, chapeau, etc ... */ div#Contenu div.chapo { margin: 5px 0; padding: 4px; font-size:16px; font-weight:bold; color : #adc4d9 ; } div#Contenu div.texte { margin: 5px 0; padding: 4px; font-size:14px; } div#Contenu div.lien { border-top: 1px solid #adc4d9 ; text-align:center; padding: 5px; font-size:16px; margin: 5px 0; } div#Contenu div.ps, div#Contenu div.notes { border: 2px solid #adc4d9 ; -moz-border-radius: 8px; margin: 10px 0; padding: 4px; font-size:12px; background-color: #f7f7f7 ; } div#Contenu div.ps h4, div#Contenu div.notes h4 { display:none; } div#Contenu div.ps div, div#Contenu div.notes div { } div#Contenu p.spip, p.spip_note { margin: 0; padding: 4px; }
.spip_documents{ font-family: Verdana,Arial,Helvetica,sans-serif; font-size : 70%; }
.spip_documents_center{ margin: auto; text-align: center; width: 80%; }
.spip_documents_left{ float: left; margin-right: 15px; text-align: center; }
.spip_documents_right{ float: right; margin-left: 15px; text-align: center; }
/****************************************** MENU : éléments affiché dans le bloc "menu" (sommaire, brèves, derniers messages des forums) ******************************************/
div#Menu { position:relative; float:left; width: 230px; margin-top:20px; }
/* sommaire du site (arborescence des rubriques) */ div.sommaire { background-color: #e6ecf2 ; border: 2px solid #adc4d9 ; -moz-border-radius: 8px; margin-bottom: 20px; } div.sommaire a { color: #5c6166 ; text-decoration: none; } div.sommaire a.on { color: #d37324 ; font-style:italic; } div.sommaire a:hover { color: #d37324 ; text-decoration: } div.sommaire ul { position:relative; margin: 0; padding: 0; } div.sommaire ul ul{ margin: 0 0 0 15px; } div.sommaire li { position:relative; margin: 4px; padding: 2px; border: 1px solid #adc4d9 ; background-color: #f7f7f7 ; list-style-type: none; font-size:12px; font-weight:bold; -moz-border-radius: 5px; } div.sommaire li.on { border: 2px solid #adc4d9 ; background-color: #ffffff ; } div.sommaire li li, div.sommaire li.on li { margin: 0; padding: 0; border: none; background: none; font-weight:normal; } /* affichage des vignettes de l'album photo */ div#vignettes { text-align:center; padding: 2px 0 20px; } div#vignettes img.spip_logos { padding:0; margin:2px; } /* formulaires dans le menu (inscription au site, référencer un site) */ div.formulaires div { padding:4px; font-size:12px; } div.formulaire fieldset{ background-color: #f7f7f7 ; }
/* blocs affichés dans le menu (brèves, mots-clés, ...) */ div.bloc, div.formulaires { border: 2px solid #adc4d9 ; -moz-border-radius: 8px; margin: 0 0 20px; }
div#Menu h4 { border-bottom: 1px solid #adc4d9 ; background-color: #e6ecf2 ; margin: 0; padding: 2px 4px; font-size:14px; font-weight:bold; color: #5c6166 ; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; } div.bloc ul { margin: 0; padding: 0; } div.bloc li { margin: 2px; padding: 1px; font-size:12px; list-style: url(images/puceoff.gif) inside; } div.bloc li.on { padding: 2px 0; background-color: #f7f7f7 ; border: 1px solid #adc4d9 ; -moz-border-radius: 5px; list-style: url(images/puceon.gif) inside; } div.bloc li.on a { text-decoration:none; color: #5c6166 ; } div.bloc li em { color: #8a9199 ; font-style: italic; }
/****************************************** AGENDA (calendrier) : affichages spécifiques à l'agenda (rubrique-agenda.html) ******************************************/ table.agenda { width:100%; color: #5c6166 ; } table.agenda, table.agenda tr, table.agenda th, table.agenda td { font-size: 12px; padding:0; margin:0 0 20px 0; } table.agenda th form { display: inline; } table.agenda td img { float:left; } table.agenda th, table.agenda td { padding:2px; width:14%; } table.agenda td { height:50px; vertical-align: top; } .agendaNav { background-color: #e6ecf2 ; border:2px solid #adc4d9 ; text-align: center; -moz-border-radius: 8px; } .agendaHead { background-color: #e6ecf2 ; border:1px solid #adc4d9 ; font-weight:bold; text-align: center; -moz-border-radius: 5px; } .agendaThisDay { background-color: #ffffff ; border:1px solid #d37324 ; -moz-border-radius: 5px; } .agendaThisMonth { background-color: #f7f7f7 ; border:1px solid #adc4d9 ; -moz-border-radius: 5px; }
.agendaNotThisMonth, .agendaNotThisDay { background: #e6ecf2 ; border:1px solid #8a9199 ; -moz-border-radius: 5px; }
table.agenda select, table.agenda input { font-size: 10px; } table.agenda option.on { background: #e6ecf2 ; }
/****************************************** PLAN DU SITE : affichages spécifiques au plan du site (plan.html) ******************************************/
ul.plan { margin: 0 4px; padding:0; } ul.plan ul { margin: 0 4px; padding:0; } ul.plan li { list-style-type: none; margin: 4px 0 4px 20px; padding:0; } ul.plan li.rubriques { margin: 10px 0 10px 20px; } ul.plan li.rubriques strong { border: 1px solid #adc4d9 ; -moz-border-radius: 5px; background-color: #f7f7f7 ; padding:2px; font-size:14px; } ul.plan li.articles strong { border: none ; background:none; padding:0; font-size:12px; } ul.plan li.rubriques strong a { color: #5c6166 ; text-decoration:none; }
/* affichage des brèves du secteur dans le plan du site */ div.secteur div.breves { border: 2px solid #adc4d9 ; -moz-border-radius: 8px; position:relative; float: right; width: 250px; margin: 5px 5px 20px; } div.secteur div.breves h4 { border-bottom: 1px solid #adc4d9 ; background-color: #f7f7f7 ; margin: 0; padding: 2px 4px; font-size:14px; font-weight:bold; -moz-border-radius-topleft: 6px; -moz-border-radius-topright: 6px; } div.secteur div.breves ul { margin: 0; padding: 0; } div.secteur div.breves li { margin: 2px; padding: 1px; font-size:12px; list-style-position: inside; list-style-image: url(images/puceoff.gif); } div.secteur div.breves li em { color: #8a9199 ; font-style: italic; }
/****************************************** PIED DE PAGE : pour toutes les pages, il contient la barre de boutons ******************************************/
ul#PiedPage{ border: 2px solid #adc4d9 ; -moz-border-radius: 8px; background-color: #e6ecf2 ; text-align: center; padding: 2px; margin: 0; } ul#PiedPage span { display:none; } ul#PiedPage li { list-style-type: none; display: inline; padding: 0; margin: 0; } ul#PiedPage li div { display:inline; } ul#PiedPage img.spip_logos{ margin: 0 20px; vertical-align:middle; }
/* pied de page de la page d'accueil */ div#PiedPage { margin:0 0 20px; text-align: center; background-color: #e6ecf2 ; border: 2px solid #adc4d9 ; -moz-border-radius: 8px; } div#PiedPage p.copyright { position:relative; margin:10px 0 0; font-size:12px; } div#PiedPage div#EVA { float: right; width: 230px; font-size:12px; text-align: left; background-color: #ffffff ; border-left: 2px solid #adc4d9 ; -moz-border-radius-topright: 6px; -moz-border-radius-bottomright: 6px; } div#PiedPage div#EVA a { text-decoration:none; color: #5c6166 ; } div#PiedPage div#EVA a:hover { color: #d37324 ; } div#PiedPage div#EVA img { float:left; margin:2px; } div#PiedPage div#EVA p { margin:10px 0; text-align:center; } /****************************************** FORUMS : affichage des forums des articles et brèves ******************************************/ div#forum { margin: 20px 0; } div#forum h4 { border: 2px solid #adc4d9 ; -moz-border-radius: 8px; background-color: #e6ecf2 ; padding: 4px; margin: 10px 0; font-size: 14px; font-weight: normal; text-align: center; } div#forum h4 strong { font-size: 16px; font-weight: bold; } div#forum div.lien { margin: 5px 0 0; padding:5px 5px 10px; font-style:italic; font-size: 12px; }
/* boutons (liens) "répondre à ..." */ div#forum dl div.bouton { text-align:right; padding-top:2px; }
/* messages des forums */ div#forum dl.forum { margin:20px 0; padding: 0; border: 2px solid #adc4d9 ; -moz-border-radius: 8px; background-color: #f7f7f7 ; color: #5c6166 ; } div#forum dl.forum a.spip_bouton { font-size:10px; } div#forum dt em { font-size:12px; color: #8a9199 ; } div#forum dt { margin: 0; padding:2px; background-color: #e6ecf2 ; border-bottom: 1px solid #adc4d9 ; font-size:16px; text-align:left; -moz-border-radius-topleft: 6px; -moz-border-radius-topright: 6px; } div#forum dd { margin: 0; padding:5px 5px 10px; font-size:14px; } div#forum dl.reponse { margin: 0 5px 10px 20px; padding: 0; background-color: #ffffff ; border: 1px solid #adc4d9 ; -moz-border-radius: 5px; } div#forum dl.reponse dt { font-size:14px; border-bottom: 1px dashed #adc4d9 ; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; } div#forum dl.reponse dd { font-size:12px; } /****************************************** SPIP : éléménets générés par SPIP ******************************************/
h3.spip { text-align:center; color: #adc4d9 ; font-size:20px; font-weight:bold; } .spip_surligne { background-color: #FFFF66; } .spip_puce { list-style-position: inside; } blockquote.spip { margin-left : 5px 0 5px 20px; border : solid 1px #adc4d9 ; -moz-border-radius: 5px; background-color: #ffffff ; padding: 5px; }
/* Barre de raccourcis */ a.spip_barre img { border: 1px solid #adc4d9 ; padding: 3px; background-color: #e6ecf2 ; } a.spip_barre:hover img { border: 1px solid #adc4d9 ; padding: 3px; background-color: #ffffff ; }
/* boutons */ .spip_bouton, a.spip_bouton, a:visited.spip_bouton { border:1px solid #adc4d9 ; -moz-border-radius: 5px; background-color: #f7f7f7 ; padding:1px; margin:2px; color: #adc4d9 ; text-decoration: none; font-size:12px; font-weight: bold; } .spip_bouton a { color: #adc4d9 ; text-decoration: none; font-size:10px; } .spip_bouton:hover { background-color: #ffffff ; } /* champs de formulaires */ .forml { width: 98%; background-color: #f7f7f7 ; color: #5c6166 ; padding:2px; font-size:12px; } fieldset.spip_encadrer { border: 2px solid #adc4d9 ; background-color: #f7f7f7 ; text-align:left; -moz-border-radius: 10px; font-size:12px; padding:5px; } fieldset.spip_encadrer legend { border: 1px solid #adc4d9 ; background-color: #ffffff ; padding:2px 4px; -moz-border-radius: 5px; font-size:14px; } /* tableau des smileys */ table#smileys { position:relative; float:left; margin:4px; border-collapse: collapse; font-size:12px; font-weight:bold; color: #5c6166 ; } table#smileys tr.row_first { background-color: #2164a6 ; color: #ffffff ; font-weight:bold; text-align:center; } table#smileys tr.row_odd { background-color: #f7f7f7 ; } table#smileys tr.row_even { background-color: #ffffff ; } table#smileys td { padding: 2px; vertical-align: center; border: 1px solid #adc4d9 ; }
/* tableaux */ table.spip { padding: 0; margin:10px auto; border-collapse: collapse; font-size:12px; } table.spip tr.row_first { background-color: #2164a6 ; color: #ffffff ; font-weight:bold; text-align:center; } table.spip tr.row_odd { background-color: #f7f7f7 ; color: #5c6166 ; } table.spip tr.row_even { background-color: #ffffff ; color: #5c6166 ; } table.spip td { padding: 2px; vertical-align: center; border: 1px solid #adc4d9 ; } /****************************************** BOUTONS ADMIN : boutons affichés pour les administrateurs (recalculer cette page , ...) ******************************************/ .spip-admin { text-align:left; left:2px; } .spip-admin form{ margin:2px; }
|