commit 78c56af84b347eb1e382cdd9bd7b148bad33b0e4 Author: Vincent Calame Date: Fri Oct 11 19:27:35 2019 +0200 Initialisation du dépôt diff --git a/article.html b/article.html new file mode 100644 index 0000000..d877a64 --- /dev/null +++ b/article.html @@ -0,0 +1,20 @@ + + + + +[(#NOM_SITE_SPIP|textebrut)] - [(#SURTITRE|textebrut)] + + + + +

#TITRE

+ [

(#SOUSTITRE)

] + #TEXTE +

+ + + + diff --git a/css/favicon.ico b/css/favicon.ico new file mode 100644 index 0000000..7eaece7 Binary files /dev/null and b/css/favicon.ico differ diff --git a/css/perso.css b/css/perso.css new file mode 100644 index 0000000..fe7f0ac --- /dev/null +++ b/css/perso.css @@ -0,0 +1,1109 @@ +/* + squelette Name: Chatons + Author: Antoine Bardelli + Author URI: https://bardelli.fr + License: Code : GNU General Public License v3 or later + License URI: http://www.gnu.org/licenses/gpl-3.0.html + Description: un thème pour Chapril.org + Spip Version: SPIP 3.2.4 - 8 avril 2019. +*/ + + + +/* ----------- CHARTE COULEURS + +BLEU + #153A6A | Bleu foncé menu mobile +rgb(46,82,129) | #2e5281 | Bleu roi April +rgb(102,170,238) | #66aaee | Bleu ciel +rgb(176,203,232) | #b0cbe8 | Bleu gris ciel +rgb(151,176,198) | #416687 | Bleu gris ciel foncé +rgb(91,198,242) | #5bc6f2 | Bleu electrique + +rgb(95,95,95) | #5f5f5f | Couleur du texte courant + +rgb(255,94,0) | #ff5e00 | rolover +rgb(255,151,89) | #ff9759 | rolover bannière et fond foncé + +rgb(247,247,249) | #f7f7f9 | fond de page + +rgb(0,81,132) | #005184 | couleur des ombrage +- rayon 25%, opacité 15% + +degrade de l'appel d'acceuil en svg +A rgb(24,120,195) +B rgb(83,140,232) +C rgb(129,193,255) +-------------------- */ +/* ------- FONT-dejavu-roman-italique-bold------- */ +@font-face { + font-family: 'dejavu_sanscondensed'; + src: url('webfonts/DejaVuSansCondensed-webfont.eot'); + src: url('webfonts/DejaVuSansCondensed-webfont.eot?#iefix') format('embedded-opentype'), + url('webfonts/DejaVuSansCondensed-webfont.woff') format('woff'), + url('webfonts/DejaVuSansCondensed-webfont.svg#dejavu_sanscondensed') format('svg'); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: 'dejavu_sanscondensed_oblique'; + src: url('webfonts/DejaVuSansCondensed-Oblique-webfont.eot'); + src: url('webfonts/DejaVuSansCondensed-Oblique-webfont.eot?#iefix') format('embedded-opentype'), + url('webfonts/DejaVuSansCondensed-Oblique-webfont.woff') format('woff'), + url('webfonts/DejaVuSansCondensed-Oblique-webfont.svg#dejavu_sanscondensed_oblique') format('svg'); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: 'dejavu_sanscondensed_bold'; + src: url('webfonts/DejaVuSansCondensed-Bold-webfont.eot'); + src: url('webfonts/DejaVuSansCondensed-Bold-webfont.eot?#iefix') format('embedded-opentype'), + url('webfonts/DejaVuSansCondensed-Bold-webfont.woff') format('woff'), + url('webfonts/DejaVuSansCondensed-Bold-webfont.svg#dejavu_sanscondensed_bold') format('svg'); + font-weight: normal; + font-style: normal; +} +/* ------- RESET SPIP----------- */ +*{ + margin:0px; + padding:0px; +} +a { + text-decoration: none; + color:#2e5281; +} +a:hover { + color:#ff5e00; +} +a:active { + color:#5bc6f2; +} +/* ------- STYLE GÉNÉRIQUES----------- */ +body { + font-family: 'dejavu_sanscondensed', sans-serif; + color: #5f5f5f; + background-color: #f7f7f9; +} +p, li { + font-size: 14px; + line-height: 24px; +} + +h1, h2, h3, H4{ + color: #2e5281; + font-weight: normal; +} +h1 { + font-size: 32px; +} +h2 { + font-size: 24px; +} +h3 { + font-size: 21px; +} +H4 { + font-size: 19px; +} +a[href*] { + color: #2e5281; +} + +/* ------- HEADER ----------- */ + +header { + /* ------- positionnement */ + display: grid; + grid-template-rows: 75px; + grid-template-columns: 15% 70% 15%; + background-color: rgb(0,81,132); + color: #fff; +} +header > a{ + /* ------- positionnement logo april */ + grid-row-start: 1; + grid-row-end: -1; + grid-column-start: 1; + grid-column-end: 2; + justify-self: flex-end; + align-self: center; + margin: 10px; + /* ------- mise en forme */ +} +header .spip_logos { + width: auto; + height: 45px; +} + +/* ------- MENU DEKSTOP ----------- */ + +#navigation { + /* ------- positionnement enfant*/ + grid-column-start: 2; + grid-column-end: 3; + /* ------- mise en forme */ + list-style-type: none; + text-transform: uppercase; + font-size: 12px; + letter-spacing: 1px; + /* ------- positionnement parent */ + display: grid; + grid-template-columns: repeat(auto-fit, minmax(0,1fr)); + justify-items: center; + align-content: center; + align-items: center; + justify-content: center; + margin-right: 6rem; +} +header #navigation a { +text-align: center; +} +/* ------- MENU MOBILE 1/2 ----------- */ +.menu-mobile-ouvre { + display: none; +} +.menu-mobile-ferme{ + display: none; +} +header p { + /* ------- positionnement */ + grid-row-start: 1; + grid-row-end: -1; + grid-column-start: 3; + grid-column-end: -1; + justify-self: flex-end; + align-self: center; + padding-right: 2rem; + /* ------- mise en forme */ +} +header nav a{ + color: #fff; +} +header a:hover{ + color: #ff9759; +} +header p{ + /* ------- positionnement */ + margin: 0 10px 0 0; + /* ------- mise en forme */ + color:#e2edf9; + font-size: 11px; + line-height: 15px; +} +/* ------- Accueil - BANNIERE ----------- */ + +.banniere { + /* ------- positionnement */ + display: grid; + grid-template-rows: 440px; + grid-template-columns: 1fr; + /* ------- mise en forme */ + background:url("../img/bann-2-ecrans.png"), url("../img/bann-3-ecrans.png"),url("../img/bann-fond.png"), linear-gradient(to right, rgb(24,120,195), rgb(83,140,232), rgb(129,193,255)); + background-repeat:no-repeat,no-repeat,no-repeat,no-repeat; + background-position:bottom -240px right -50%, bottom -190px left 10%, bottom -230px center, center center; + background-size: 800px, 800px, 650px, 100%; +} +.banniere articles { + /* ------- positionnement */ + grid-column-start: 1; + grid-column-end: -1; + grid-row-start: 1; + grid-row-end: -1; + justify-self: center; + padding-top: 100px; + /* ------- mise en forme */ +} +.banniere articles h1{ + color:#fff; + font-size: 35px; +} +.banniere articles p{ + /* ------- positionnement */ + display: flex; + justify-content: center; + flex-direction: row; + padding-top:20px; +} +.banniere articles a { + margin: 1rem 3rem 0 0; + color:#fff; + font-size: 11px; + text-transform: uppercase; + letter-spacing: 1px; + font-family: 'dejavu_sanscondensed_bold'; + padding: 0.3rem 1rem; + background-color: #2e5281; + border-radius: 5px; + box-shadow: 0 0 5px 0px rgba(0,81,132,0.5); +} +.banniere articles a ~ a{ + color:#2e5281; + background-color: #fff; + margin-right:0; +} +.banniere articles a:hover{ + color:#fff; + background-color: #ff5e00; +} +/* ------- Accueil - presentation ----------- */ + +.presentation { + /* ------- positionnement */ + display: grid; + grid-template-rows: 1fr; + grid-template-columns: 10% 40% 40% 10%; + /* ------- mise en forme */ +} +.presentation articles { + /* ------- positionnement */ + grid-row-start: 1; + grid-row-end: -1; + grid-column-start: 2; + grid-column-end: 3; + margin: 0 50px; + /* ------- mise en forme */ +} +.presentation articles + articles { + /* ------- positionnement */ + grid-row-start: 1; + grid-row-end: -1; + grid-column-start: 3; + grid-column-end: 4; +} +.presentation articles h2{ + /* ------- positionnement */ + padding: 3rem 0; +} +.presentation articles div p { + /* ------- positionnement */ +} +.bouton-simple{ + text-transform: uppercase; + font-size: 13px; + font-family: 'dejavu_sanscondensed'; + letter-spacing: 1px; + padding: 10px 0; + margin: 1rem 0; + display: block; + color: #416687; +} +articles div { + margin-bottom: 1.5rem; +} +.presentation articles + articles .spip_out, .bouton-utilise { + /* ------- positionnement */ + display: block; + max-width: 180px; + min-width: 100px; + margin-top: 0.7rem; + /* ------- mise en forme */ + text-align: center; + color: #fff; + font-size: 12px; + text-transform: uppercase; + letter-spacing: 1px; + font-family: 'dejavu_sanscondensed_bold'; + background-color: #2e5281; + box-shadow: 0 0 5px 0px rgba(0,81,132,0.5); + border-radius: 7px; + padding: 0.7rem 1rem; +} +.presentation articles + articles .spip_out:hover, .bouton-utilise:hover{ + color:#fff; + background-color: #ff5e00; +} +.presentation blockquote.postscriptum p { + font-family: dejavu_sanscondensed_oblique; + font-size: 12px; + line-height: 17px; + margin: 0; + padding: 0.5rem 0rem; +} + +/* ------- Accueil - services ----------- */ + +.derniers-services { + /* ------- positionnement */ + display: grid; + grid-template-rows: 1fr; + grid-template-columns: 10% 40% 40% 10%; + margin:4rem 0; +} +.sous-titre{ + /* ------- positionnement */ + grid-row-start: 1; + grid-row-end: 2; + grid-column-start: 1; + grid-column-end: -1; + /* ------- mise en forme */ + text-align: center; +} +.derniers-services articles{ + /* ------- positionnement */ + grid-row-start: 2; + grid-row-end: 3; + grid-column-start: 2; + grid-column-end: 3; + margin: 20px 40px; + /* ------- mise en forme */ + text-align: center; + background-color: #fff; + border-radius: 8px; + border-top: 14px #b0cbe8 solid; + box-shadow: 0 0 5px 0px rgba(0,81,132,0.5); +} +.derniers-services articles + articles{ + /* ------- positionnement */ + grid-row-start: 2; + grid-row-end: 3; + grid-column-start: 3; + grid-column-end: 4; + /* ------- mise en forme */ +} +.derniers-services articles + articles + articles{ + /* ------- positionnement */ + grid-row-start: 3; + grid-row-end: 4; + grid-column-start: 2; + grid-column-end: 3; + /* ------- mise en forme */ +}.derniers-services articles + articles + articles + articles{ + /* ------- positionnement */ + grid-row-start: 3; + grid-row-end: 4; + grid-column-start: 3; + grid-column-end: 4; + /* ------- mise en forme */ +} +.derniers-services .bouton-appel{ + /* ------- positionnement */ + grid-column-start: 1; + grid-column-end: -1; + margin: 5rem auto; + /* ------- mise en forme */ + text-align: center; + color: #fff; + font-size: 14px; + text-transform: uppercase; + letter-spacing: 1px; + font-family: 'dejavu_sanscondensed_bold'; + background-color: #2e5281; + box-shadow: 0 0 5px 0px rgba(0,81,132,0.5); + border-radius: 10px; + padding: 1.2rem 2.5rem; + min-width: 250px; + max-width: 300px; +} +.derniers-services blockquote.postscriptum p { + font-family: 'dejavu_sanscondensed_oblique'; + font-size: 12px; + line-height: 17px; + padding: 0.5rem 1rem 1rem; +} +/* ------- pages services ------------------ */ + +.master-rubrique .derniers-services { + /* ------- positionnement */ + display: grid; + grid-template-rows: 1fr; + grid-template-columns: 10% 80% 10%; + margin: 4rem 0; +} +.master-rubrique .sous-titre { + /* ------- positionnement */ + grid-row-start: 1; + grid-row-end: 2; + grid-column-start: 1; + grid-column-end: -1; +} +.master-rubrique .tous-les-services { + grid-row-start: 2; + grid-row-end: -1; + grid-column-start: 2; + grid-column-end: 3; + /* ------- positionnement enfants - flux de services */ + display: flex; + flex-flow: row wrap; + justify-content: space-between; +} +.master-rubrique .derniers-services articles { + width: 45%; + margin: 1rem; + /* ------- mise en forme */ + text-align: center; + background-color: #fff; + border-radius: 8px; + border-top: 14px #b0cbe8 solid; + box-shadow: 0 0 5px 0px rgba(0,81,132,0.5); +} +.master-rubrique .derniers-services h2 { + padding: 1rem 0; + height: 2rem; +} +/* ------- pages services ----------- */ + +.derniers-services .bouton-appel:hover{ + color:#fff; + background-color: #ff5e00; +} +.derniers-services h2, .derniers-services h1{ + text-transform: lowercase; + height: 4rem; +} +.derniers-services h2::first-letter, .derniers-services h1::first-letter { + text-transform: uppercase; +} +.derniers-services h3 { + text-align: center; + margin: 2rem auto 0.7rem; +} +.derniers-services p { + text-align: left; + padding: 1rem; +} +.derniers-services img { + width: 90%; + box-shadow: 0 0 5px 0px rgba(0,81,132,0.5); + height: auto; + margin: 0.5rem auto; +} +.derniers-services .bouton-utilise{ + max-width: 120px; + margin: 1rem 1rem 1.5rem; +} +.engagements { + /* ------- positionnement */ + display: grid; + grid-template-rows: 1fr; + grid-template-columns: 10% 26.6666666% 26.6666666% 26.6666666% 10%; + /* ------- mise en forme */ + margin-bottom: 4rem; +} +.engagements articles{ + /* ------- positionnement */ + grid-row-start: 1; + grid-row-end: -1; + grid-column-start: 2; + grid-column-end: 3; + margin: 0 1rem; +} +.engagements articles + articles{ + /* ------- positionnement */ + grid-column-start: 3; + grid-column-end: 4; +} +.engagements articles + articles + articles{ + /* ------- positionnement */ + grid-column-start: 4; + grid-column-end: 5; +} +.engagements articles img { + margin: 0 auto 2rem; + display: block; + width: auto; + height: 60px; +} +.engagements h2 { + padding-bottom: 1.5rem; + text-align: center; +} +/* ------- footer ----------- */ + +footer { + /* ------- positionnement */ + display: grid; + grid-template-rows: 80px; + grid-template-columns: 15% 42.5% 42.5%; + /* ------- mise en forme */ + background-color: rgb(0,81,132); + color: #fff; + margin-top: 6rem; +} +footer ul{ + /* ------- positionnement */ + grid-row-start: 1; + grid-row-end: -1; + grid-column-start: 2; + grid-column-end: 3; + align-self: center; + /* ------- mise en forme */ + list-style-type: none; + font-size: 10px; + text-transform: uppercase; + letter-spacing: 1px +} +footer .signature-april{ + /* ------- positionnement */ + grid-row-start: 1; + grid-row-end: -1; + grid-column-start: 3; + grid-column-end: -1; + justify-self: flex-end; + align-self: center; + display:flex; + /* ------- mise en forme */ + margin-right: right; + height: 20px; +} +.signature-april p{ + font-size: 11px; + line-height: 30px; +} +footer img{ + margin: 0 2rem 0 1rem; + width: auto; + height: 30px; +} +footer ul a{ + color: #fff; + font-size: 10px; +} +footer ul a:hover{ + color: #ff9759; +} + +/* ------- conditions-d-utilisation ----------- */ + +.contenu-texte{ + /* ------- positionnement */ + display: grid; + grid-template-rows: 1fr; + grid-template-columns: 15% 70% 15%; +} +.contenu-texte articles { + /* ------- positionnement */ + grid-row-start: 1; + grid-row-end: -1; + grid-column-start: 2; + grid-column-end: 3; + /* ------- mise en forme */ +} +.contenu-texte h1 { + /* ------- positionnement */ + grid-row-start: 1; + grid-row-end: 2; + grid-column-start: 2; + grid-column-end: 3; + /* ------- mise en forme */ + margin:4rem 0 0; +} +.contenu-texte h3{ + margin: 3rem 0 1rem; +} +.contenu-texte strong { + margin: 2rem 0 0.5rem; + display: block; + font-size: 17px; + color: #2e5281; + font-family: 'dejavu_sanscondensed'; +} +.contenu-texte ul { + list-style: none; + padding-left: 20px; +} +.contenu-texte li { + list-style-image: url("../img/fleche.png"); + list-style-position: inside; + text-indent: -20px; + padding: 4px 0; +} +.contenu-texte li:first-child { +padding-top: 10px; +} + +.contenu-texte .suitedarticles { + /* ------- positionnement */ + grid-row-start: 2; + grid-row-end: -1; + grid-column-start: 2; + grid-column-end: 3; + /* ------- decallage du footer poura article court */ + min-height: 800px; +} + +.contenu-texte h2{ + margin: 3rem 0 1rem; +} + +/* -------------------- MOBILE 1240 -------------------- */ + +@media screen and (max-width: 1240px) { + .banniere { + background-position:bottom -240px right -1fr, bottom -190px left 10%, bottom -230px center, center center; +} + .presentation articles { + margin: 0 25px; +} + .derniers-services articles{ + margin: 20px; + } +} +/* -------------------- MOBILE 1040 -------------------- */ + +@media screen and (max-width: 1080px) { + .banniere { + background-position:bottom -240px left 290%, bottom -190px left -50%, bottom -230px center, center center; +} + .derniers-services articles{ + margin: 10px; + } +header p { + padding-right: 5px; +} +/* -------------------- MOBILE 980 -------------------- */ + +@media screen and (max-width: 980px) { + +/* ------- MENU MOBILE ----------- */ + +header { + grid-template-rows: 85px; + grid-template-columns: 100px auto 100px; + margin-top: -85px; /* ------- cache le menu au départ */ +} +#navigation { + /* --- animation menu */ + transition: all .5s ease-in; + /* --- positionnement menu mobile */ + grid-column-start:1; + grid-column-end: -1; + /* --- positionnement des enfants */ + text-align: center; + justify-items: stretch; + /* ------- mise en forme navigation mobile */ + background-color:#153A6A; +} +header #navigation a { + padding: 1.5rem; +} +header > a { + /* ------- positionnement mobile logo april */ + grid-row-start: 2; + grid-row-end: -1; + grid-column-start: 1; + grid-column-end: 2; + justify-self: center; + padding: 10px; + margin: 0; +} +header p { + grid-row-start: 2; + grid-row-end: -1; + grid-column-start: 2; + grid-column-end: 3; + padding-right: 20px; + margin: 0; +} +.menu-mobile-ouvre, .menu-mobile-ferme{ + grid-row-start: 2; + grid-row-end: -1; + grid-column-start: 3; + grid-column-end: -1; + color: #66aaee; + font-size: inherit; + text-transform: uppercase; + border: 1px solid #66aaee; + padding: 5px; +} + +/* ------- OUVERTURE / FERMETURE MENU MOBILE ----------- */ + +#navigation{ + margin-top: 0px; + margin-right: 0rem; + justify-content: initial; +} +#menu:target{ + margin-top: 0px; /* ------- ouvre le menu lorsque l'on clique sur "menu"*/ +} + +/* ------- MASQUAGE BOUTON MENU+FERME ----------- */ + +.menu-mobile-ouvre{ /* ------- Bouton FERME masqué au départ */ + display: none; +} +.menu-mobile-ferme{ /* ------- Bouton MENU visible au départ */ + display: block; +} +#menu:target a.menu-mobile-ferme { /* ------- Bouton MENU masqué à l'ouverture du menu */ + display: none; +} +#menu:target a.menu-mobile-ouvre { /* ------- Bouton FERME visible à l'ouverture du menu */ + display: block; +} +#navigation:target + a.menu-mobile-ouvre { /* ------- Bouton FERME masqué à la fermeture du menu */ + display: none; +} +/* ------- FIN OUVERTURE MENU ----------- */ + + header nav a:hover, .menu-mobile:hover, .menu-mobile-ouvre:hover, .menu-mobile-ferme:hover{ + color:#fff; + background-color: #ff5e00; + border-color: #ff5e00; +} +/* ------- ACCUEIL 980 ----------- */ + + .banniere { + background-position: bottom -240px left 440%, bottom -190px left -120%, bottom -230px center, center center; +} + .presentation { + grid-template-columns: 5% 45% 45% 5%; +} + .presentation articles { + margin: 0 25px; +} + .presentation articles + articles { + margin: 0 0 0 40px; +} + .derniers-services { + grid-template-columns: 5% 45% 45% 5%; +} + .contenu-texte, .apropos .contenu-texte { + grid-template-columns: 5% 90% 5%; +} + .engagements { + grid-template-columns: 5% 30% 30% 30% 5%; +} + footer { + grid-template-columns: 5% 47.5% 47.5%; +} + footer .signature-april p { + line-height: 15px; + text-align: right; + font-size: 10px; +} + /* ------- pages services 980 ----------- */ + .master-rubrique .derniers-services { + grid-template-columns: 5% 90% 5%; +} +} +/* -------------------------------- 760px ----------- */ + /* ------- ACCUEIL 760 ----------- */ + + @media screen and (max-width: 760px) { + +.banniere { + grid-template-rows: 400px; + background-position: bottom -290px right 60%, bottom -210px left -120%, bottom -270px center, center top; +} +.banniere articles { + padding-top: 50px; +} +.banniere articles h1 { + color: #fff; + margin: 0 2rem; + text-align: center; + line-height: 50px; + font-size: 30px; +} +.banniere articles p { + padding-top: 20px; +} + .presentation { + grid-template-columns: 7% 86% 7%; +} +.presentation articles { + grid-row-start: 1; + grid-row-end: 2; + grid-column-start: 2; + grid-column-end: 3; + margin: 0 auto; + /* ------- separateur 760 ----------- */ + background-image: url("../img/chat-marche-bleu-ciel-filet.svg"); + background-repeat:no-repeat; + background-position:bottom 0px center; + background-size: 1fr; +} + .presentation articles + articles { + grid-row-start: 2; + grid-row-end: -1; + grid-column-start: 2; + grid-column-end: 3; + margin: 2rem auto; + background-image: url("../img/chat-course-bleu-ciel-filet.svg"); + /* ------- positionnement enfant ----------- */ + display: grid; + grid-template-rows: 100px 140px 140px 100px 140px; + grid-template-columns: 50% 50%; + justify-content: space-between; + align-items: flex-start; + column-gap: 1rem; + row-gap: 1rem; +} + .presentation articles h2 { + grid-row-start: 1; + grid-row-end: 2; + grid-column-start: 1; + grid-column-end: -1; +} + .presentation articles + articles h2 { + padding: 1rem 0 3rem; +} + .presentation blockquote.postscriptum p { + padding: 0.5rem 0rem 5rem; +} + articles div { + /* ------- positionnement ----------- */ + grid-row-start: 2; + grid-row-end: 3; + grid-column-start: 1; + grid-column-end: 2; + /* ------- mise en forme ----------- */ + background-color: #fff; + border-radius: 5px; + padding: 1rem; +} + articles div + div { + /* ------- positionnement ----------- */ + grid-row-start: 2; + grid-row-end: 3; + grid-column-start: 2; + grid-column-end: -1; +} + articles div + div + div{ + /* ------- positionnement ----------- */ + grid-row-start: 3; + grid-row-end: 4; + grid-column-start: 1; + grid-column-end: 2; +} + .presentation articles + articles .postscriptum { + /* ------- positionnement SI contenu présent----------- */ + grid-row-start: 3; + grid-row-end: 4; + grid-column-start: 2; + grid-column-end: -1; +} + .presentation articles + articles .bouton-simple { + grid-row-start: 4; + grid-row-end: -1; + grid-column-start: 1; + grid-column-end: -1; + /* ------- positionnement ----------- */ + margin: 3rem auto 0rem; + text-align: center; + color: #fff; + font-size: 14px; + letter-spacing: 1px; + font-family: 'dejavu_sanscondensed_bold'; + background-color: #2e5281; + box-shadow: 0 0 5px 0px rgba(0,81,132,0.5); + border-radius: 10px; + padding: 1.2rem 2.5rem; + min-width: 250px; + max-width: 300px; +} + .presentation articles + articles .bouton-simple:hover { + color: #fff; + background-color: #ff5e00; +} + .presentation articles + articles .spip_out, .bouton-utilise { + max-width: 180px; + padding: 0.7rem; +} + .derniers-services { + grid-template-rows: 1fr; + grid-template-columns: 1fr; + margin: 2rem 0rem 1rem; +} + .derniers-services articles { + grid-row-start: 2; + grid-row-end: 3; + grid-column-start: 1; + grid-column-end: -1; +} + .derniers-services articles + articles { + grid-row-start: 3; + grid-row-end: 4; + grid-column-start: 1; + grid-column-end: -1; +} + .derniers-services articles + articles + articles { + grid-row-start: 4; + grid-row-end: 5; + grid-column-start: 1; + grid-column-end: -1; +} + .derniers-services articles + articles + articles + articles { + grid-row-start: 5; + grid-row-end: 6; + grid-column-start: 1; + grid-column-end: -1; +} + .derniers-services .bouton-appel { + grid-column-start: 1; + grid-column-end: -1; + margin: 2rem auto 5rem; +} + .derniers-services img { + width: 70%; +} + .derniers-services articles { + margin: 2rem 4rem; +} + .engagements { + grid-template-rows: 1fr 1fr 1fr; + grid-template-columns: 1fr; +} + .engagements articles { + grid-row-start: 1; + grid-row-end: 2; + grid-column-start: 1; + grid-column-end: -1; + margin: 3rem 5rem 0.5rem; +} + .engagements articles + articles { + grid-row-start: 2; + grid-row-end: 3; + grid-column-start: 1; + grid-column-end: -1; +} + .engagements articles + articles + articles{ + grid-row-start: 3; + grid-row-end: -1; + grid-column-start: 1; + grid-column-end: -1; +} +/* ------- page services ----------- */ +.master-rubrique .derniers-services { + margin-top: 4rem; +} + .master-rubrique .tous-les-services { + flex-flow: column wrap; +} +.master-rubrique .derniers-services articles { + width: initial; +} +} + /* -------------------------------- 640px ----------- */ + + @media screen and (max-width: 640px){ + header #navigation a { + padding: 1.5rem 0.2rem; +} + header #navigation a:first-child { + margin-left: 0rem; +} + header #navigation a:last-child { + margin-right: 0rem; +} +} +/* -------------------------------- 512px ----------- */ + /* ------- ACCUEIL 512 ----------- */ + + @media screen and (max-width: 512px) { + #navigation{ + grid-template-columns: auto; + } + header #navigation a:first-child { + margin-left: 0; + } + header #navigation a:last-child{ + margin-right: 0; + } + header #navigation a { + padding: 1rem; + border-bottom: 1px solid #2e5281; + font-size: 14px; +} + .banniere { +background-position: bottom -290px right 100%, bottom -180px left -20%, bottom -190px center, center center; +background-size: 700px, 700px, 550px, 400%; +} + .banniere articles a { + margin: 1rem 1rem 0 0; + } + .presentation articles h2 { + text-align: center; +} + .presentation articles + articles .spip_out, .bouton-utilise { + margin: 1rem auto 0rem; +} + .presentation articles + articles .bouton-simple, .derniers-services .bouton-appel { + padding: 1rem 0.1rem; +} + .bouton-simple { + font-size: 11px; + padding: 7px 0; + margin: 2rem auto; + text-align: center; + border: 1px solid #97b0c6; + max-width: 150px; + border-radius: 5px; +} + .bouton-simple:hover{ + background-color: #ff5e00; + border-color: #ff5e00; + color: #fff; +} + .presentation articles { + background-size: 170%; +} + .presentation articles + articles { + grid-template-rows: 100px 140px 140px 140px 190px; + grid-template-columns: 1fr; + background-repeat:no-repeat; + background-position:bottom 0px center; + background-size: 170%; + row-gap: 1rem; + column-gap: 0rem; +} + .presentation articles h2 { + grid-row-start: 1; + grid-row-end: 2; + grid-column-start: 1; + grid-column-end: -1; +} + articles div { + grid-row-start: 2; + grid-row-end: 3; + grid-column-start: 1; + grid-column-end:-1; + text-align: center; +} + articles div + div { + grid-row-start: 3; + grid-row-end: 4; + grid-column-start: 1; + grid-column-end:-1; +} + articles div + div { + grid-row-start: 4; + grid-row-end: 5; + grid-column-start: 1; + grid-column-end:-1; +} + .presentation articles + articles .bouton-simple { + grid-row-start: 5; + grid-row-end: -1; + grid-column-start: 1; + grid-column-end: -1; +} + + .derniers-services articles { + margin: 1rem 2rem; +} + .derniers-services .bouton-utilise { + margin: 1rem auto 1.5rem; +} + .engagements articles { + margin: 3rem 2rem 0.5rem; +} + footer { + grid-template-columns: 1fr; +} + footer ul{ + display: none; +} + footer .signature-april { + grid-row-start: 1; + grid-row-end: -1; + grid-column-start: 1; + grid-column-end: -1; +} +} +@media screen and (max-width: 500px) { + header { + grid-template-rows: 285px; + margin-top: -285px; /* ------- cache le menu au départ */ +} +} diff --git a/css/webfonts/DejaVuSansCondensed-Bold-webfont.eot b/css/webfonts/DejaVuSansCondensed-Bold-webfont.eot new file mode 100644 index 0000000..8119f25 Binary files /dev/null and b/css/webfonts/DejaVuSansCondensed-Bold-webfont.eot differ diff --git a/css/webfonts/DejaVuSansCondensed-Bold-webfont.svg b/css/webfonts/DejaVuSansCondensed-Bold-webfont.svg new file mode 100644 index 0000000..4111856 --- /dev/null +++ b/css/webfonts/DejaVuSansCondensed-Bold-webfont.svg @@ -0,0 +1,497 @@ + + + \ No newline at end of file diff --git a/css/webfonts/DejaVuSansCondensed-Bold-webfont.woff b/css/webfonts/DejaVuSansCondensed-Bold-webfont.woff new file mode 100644 index 0000000..80fc5f6 Binary files /dev/null and b/css/webfonts/DejaVuSansCondensed-Bold-webfont.woff differ diff --git a/css/webfonts/DejaVuSansCondensed-Oblique-webfont.eot b/css/webfonts/DejaVuSansCondensed-Oblique-webfont.eot new file mode 100644 index 0000000..a7ff94c Binary files /dev/null and b/css/webfonts/DejaVuSansCondensed-Oblique-webfont.eot differ diff --git a/css/webfonts/DejaVuSansCondensed-Oblique-webfont.svg b/css/webfonts/DejaVuSansCondensed-Oblique-webfont.svg new file mode 100644 index 0000000..afb2b0a --- /dev/null +++ b/css/webfonts/DejaVuSansCondensed-Oblique-webfont.svg @@ -0,0 +1,407 @@ + + + \ No newline at end of file diff --git a/css/webfonts/DejaVuSansCondensed-Oblique-webfont.woff b/css/webfonts/DejaVuSansCondensed-Oblique-webfont.woff new file mode 100644 index 0000000..9ca81d2 Binary files /dev/null and b/css/webfonts/DejaVuSansCondensed-Oblique-webfont.woff differ diff --git a/css/webfonts/DejaVuSansCondensed-webfont.eot b/css/webfonts/DejaVuSansCondensed-webfont.eot new file mode 100644 index 0000000..02f3984 Binary files /dev/null and b/css/webfonts/DejaVuSansCondensed-webfont.eot differ diff --git a/css/webfonts/DejaVuSansCondensed-webfont.svg b/css/webfonts/DejaVuSansCondensed-webfont.svg new file mode 100644 index 0000000..bdce9f1 --- /dev/null +++ b/css/webfonts/DejaVuSansCondensed-webfont.svg @@ -0,0 +1,800 @@ + + + \ No newline at end of file diff --git a/css/webfonts/DejaVuSansCondensed-webfont.woff b/css/webfonts/DejaVuSansCondensed-webfont.woff new file mode 100644 index 0000000..48964eb Binary files /dev/null and b/css/webfonts/DejaVuSansCondensed-webfont.woff differ diff --git a/img/arton13.png b/img/arton13.png new file mode 100644 index 0000000..dd08523 Binary files /dev/null and b/img/arton13.png differ diff --git a/img/arton17.png b/img/arton17.png new file mode 100644 index 0000000..f6efd4e Binary files /dev/null and b/img/arton17.png differ diff --git a/img/arton18.png b/img/arton18.png new file mode 100644 index 0000000..e0b0cf0 Binary files /dev/null and b/img/arton18.png differ diff --git a/img/bann-2-ecrans.png b/img/bann-2-ecrans.png new file mode 100644 index 0000000..4f11a1e Binary files /dev/null and b/img/bann-2-ecrans.png differ diff --git a/img/bann-3-ecrans.png b/img/bann-3-ecrans.png new file mode 100644 index 0000000..03eb2c8 Binary files /dev/null and b/img/bann-3-ecrans.png differ diff --git a/img/bann-fond.png b/img/bann-fond.png new file mode 100644 index 0000000..4ce0707 Binary files /dev/null and b/img/bann-fond.png differ diff --git a/img/chat-course-bleu-ciel-filet.svg b/img/chat-course-bleu-ciel-filet.svg new file mode 100644 index 0000000..5b0e86f --- /dev/null +++ b/img/chat-course-bleu-ciel-filet.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/img/chat-marche-bleu-ciel-filet.svg b/img/chat-marche-bleu-ciel-filet.svg new file mode 100644 index 0000000..588a9bf --- /dev/null +++ b/img/chat-marche-bleu-ciel-filet.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/img/chat-recrute@2x.png b/img/chat-recrute@2x.png new file mode 100644 index 0000000..ce60a1a Binary files /dev/null and b/img/chat-recrute@2x.png differ diff --git a/img/chat-ronrone@2x.png b/img/chat-ronrone@2x.png new file mode 100644 index 0000000..a304034 Binary files /dev/null and b/img/chat-ronrone@2x.png differ diff --git a/img/chat-suit@2x.png b/img/chat-suit@2x.png new file mode 100644 index 0000000..d3b7f2f Binary files /dev/null and b/img/chat-suit@2x.png differ diff --git a/img/fermer.png b/img/fermer.png new file mode 100644 index 0000000..48ffdea Binary files /dev/null and b/img/fermer.png differ diff --git a/img/fermer@2x.png b/img/fermer@2x.png new file mode 100644 index 0000000..2fef927 Binary files /dev/null and b/img/fermer@2x.png differ diff --git a/img/fleche.png b/img/fleche.png new file mode 100644 index 0000000..0b40638 Binary files /dev/null and b/img/fleche.png differ diff --git a/img/fond-banniere.jpg b/img/fond-banniere.jpg new file mode 100644 index 0000000..56b4784 Binary files /dev/null and b/img/fond-banniere.jpg differ diff --git a/img/fond-banniere@2x.jpg b/img/fond-banniere@2x.jpg new file mode 100644 index 0000000..44f5ee9 Binary files /dev/null and b/img/fond-banniere@2x.jpg differ diff --git a/inclure/entete.html b/inclure/entete.html new file mode 100644 index 0000000..182826c --- /dev/null +++ b/inclure/entete.html @@ -0,0 +1,19 @@ +[(#REM) entete] + diff --git a/inclure/head.html b/inclure/head.html new file mode 100644 index 0000000..a3eb7fa --- /dev/null +++ b/inclure/head.html @@ -0,0 +1,8 @@ +[(#REM) 1. head pour toute les pages - Antoine Bardelli LGPL 3 - CC3.0BYSA - ArtLibre] + + +[(#REM) 2. appel du nom de site avec filtre ] + +[(#REM) Feuilles de style perso] + + diff --git a/inclure/pieddepage.html b/inclure/pieddepage.html new file mode 100644 index 0000000..03d1b28 --- /dev/null +++ b/inclure/pieddepage.html @@ -0,0 +1,15 @@ +[(#REM) pied de page ] + diff --git a/robots.txt.html b/robots.txt.html new file mode 100644 index 0000000..05398bd --- /dev/null +++ b/robots.txt.html @@ -0,0 +1,15 @@ +#HTTP_HEADER{Content-Type: text/plain; charset=#CHARSET} + +User-agent: * +Allow: /local/cache-css/ +Allow: /local/cache-js/ +Disallow: /local/ +Disallow: /ecrire/ +Disallow: /plugins-dist/ +Disallow: /lib/ +Disallow: /plugins/ +Disallow: /prive/ +Disallow: /squelettes-dist/ +Disallow: /squelettes/ +Disallow: /sites/ +Crawl-delay: 1 diff --git a/rubrique.html b/rubrique.html new file mode 100644 index 0000000..eb42964 --- /dev/null +++ b/rubrique.html @@ -0,0 +1,37 @@ + + + +[(#REM) inclure head ] + +[(#NOM_SITE_SPIP|textebrut)] - [(#TITRE|textebrut)] + + + [(#REM) pages de la rubriques principale - services ] + + [(#REM) inclure l'entete et la navigation ] + + [(#REM) rubriques ] +

+ +

#TITRE

+ + +

#TITRE

#LOGO_ARTICLE #TEXTE #NOM_SITE

#PS

+ + +

+ +

+ [(#REM) inclure les 3 engagements ] + + #LOGO_ARTICLE

#TITRE

#TEXTE #NOM_SITE + + +

+ [(#REM) inclure le footer ] + + + + diff --git a/sommaire.html b/sommaire.html new file mode 100644 index 0000000..f7f8201 --- /dev/null +++ b/sommaire.html @@ -0,0 +1,53 @@ + + +[(#REM) inclure head ] + +[(#NOM_SITE_SPIP|textebrut)] + + +[(#REM) page d'accueil ] + + [(#REM) inclure l'entete et la navigation ] + + [(#REM) inclure la banniere ] +

+ + +

#TITRE

#TEXTE + + + +

+ [(#REM) inclure l'introduction ] +

+ + +

#TITRE

+ #TEXTE #NOM_SITE

#PS

+ + + +

+ [(#REM) inclure les derniers services ] + +

Les derniers #TITRE

+ +

#TITRE

#TEXTE #LOGO_ARTICLE #NOM_SITE

#PS

+ + + + [(#REM) inclure le bouton d'appel vers service ] + Voir tous les services +

+ [(#REM) inclure les 3 engagements ] + + #LOGO_ARTICLE

#TITRE

#TEXTE #NOM_SITE + + +

+ [(#REM) inlcure le footer] + + +