utiliser les crayons page sommaire + mise en forme liste services

(Antoine)

css/ajout.css

@@ -179,3 +179,60 @@
 .reponse_formulaire_ok {
 	color: #005184;
 }
+
+/**************************
+ * liste preésentation des services (accueil)
+ * ************************/
+.presentation article ul {
+    list-style: none;
+    column-count: 2;
+	padding: 0;
+	margin: 0 0 2em;
+}
+.presentation article ul li {
+	margin-bottom: 0.3em;
+}
+.presentation article ul li a {
+	display: flex;
+	
+}
+.presentation article ul a .fa {
+	color: #7DBDFD;
+	width: 30px;
+	padding: 0 0.5em 0 0;
+	text-align: center;
+}
+.presentation article ul a:hover .fa {
+	color: #ff5e00;
+}
+
+.presentation article li:first-child a::before {
+    content: 'NOUVEAU !';
+    background-color: yellow;
+    position: absolute;
+    color: black;
+    margin-top: -2.5em;
+    padding: 0.2em 1em;
+    font-size: 0.8em;
+    border-radius: 5px;
+    margin-left: -3em;
+    transform: rotate(-8deg);
+}
+@media screen and (max-width: 1280px) {
+    
+    .presentation article ul {
+		column-count: 1;
+	}
+}
+@media screen and (max-width: 760px) {
+    
+    .presentation article ul {
+		column-count: 2;
+	}
+}
+@media screen and (max-width: 540px) {
+    
+    .presentation article ul {
+		column-count: 1;
+	}
+}

sommaire.html

@@ -13,7 +13,7 @@
         <div class="banniere">
             <BOUCLE_banniere(RUBRIQUES) {id_rubrique=8}>
                 <BOUCLE_accroche(ARTICLES) {id_rubrique}>
-                    <article><h1>#TITRE</h1> #TEXTE
+                    <article class="#EDIT{texte}"><h1 class="#EDIT{titre}">#TITRE</h1> #TEXTE
                     </article>
                 </BOUCLE_accroche>
             </BOUCLE_banniere>
@@ -22,7 +22,7 @@
         <div class="presentation">
         <BOUCLE_introduction(RUBRIQUES) {id_rubrique=1}>
             <BOUCLE_intro-texte(ARTICLES) {id_rubrique} {par date}{0,4}>
-                <article><h2>#TITRE</h2> 
+                <article class="#EDIT{texte}"><h2 class="#EDIT{titre}">#TITRE</h2> 
                     #TEXTE <a class="bouton-simple" href="#URL_SITE">#NOM_SITE</a> <blockquote class="postscriptum">#PS</blockquote>
                 </article>
             </BOUCLE_intro-texte>
@@ -32,11 +32,11 @@
         [(#REM) inclure Services en une ]
             <h2 class="sous-titre">Services en une #TITRE</h2>
             <BOUCLE_services_en_une1(ARTICLES) {id_article=20}>
-                <article><h3>#TITRE</h3> #TEXTE #LOGO_ARTICLE <a class="bouton-utilise" href="#URL_SITE">#NOM_SITE</a> <blockquote class="postscriptum">#PS</blockquote>
+                <article class="#EDIT{texte}"><h3 class="#EDIT{titre}">#TITRE</h3> #TEXTE #LOGO_ARTICLE <a class="bouton-utilise" href="#URL_SITE">#NOM_SITE</a> <blockquote class="postscriptum #EDIT{ps}">#PS</blockquote>
                 </article>
             </BOUCLE_services_en_une1>
             <BOUCLE_services_en_une2(ARTICLES) {id_article=7}>
-                <article><h3>#TITRE</h3> #TEXTE #LOGO_ARTICLE <a class="bouton-utilise" href="#URL_SITE">#NOM_SITE</a> <blockquote class="postscriptum">#PS</blockquote>
+                <article class="#EDIT{texte}"><h3 class="#EDIT{titre}">#TITRE</h3> #TEXTE #LOGO_ARTICLE <a class="bouton-utilise" href="#URL_SITE">#NOM_SITE</a> <blockquote class="postscriptum #EDIT{ps}">#PS</blockquote>
                 </article>
             </BOUCLE_services_en_une2>
         </div>
@@ -45,7 +45,7 @@
         <BOUCLE_rubrique(RUBRIQUES) {id_rubrique=3} >
             <h2 class="sous-titre">Les derniers #TITRE</h2>
             <BOUCLE_derniers_services(ARTICLES) {id_rubrique} {!par date}{0,4}>
-                <article><h3>#TITRE</h3> #TEXTE #LOGO_ARTICLE <a class="bouton-utilise" href="#URL_SITE">#NOM_SITE</a> <blockquote class="postscriptum">#PS</blockquote>
+                <article class="#EDIT{texte}"><h3 class="#EDIT{titre}">#TITRE</h3> #TEXTE #LOGO_ARTICLE <a class="bouton-utilise" href="#URL_SITE">#NOM_SITE</a> <blockquote class="postscriptum #EDIT{ps}">#PS</blockquote>
                 </article>
             </BOUCLE_derniers_services>
         </BOUCLE_rubrique>
@@ -55,7 +55,7 @@
         <div class="engagements">        
         [(#REM) inclure les 3 engagements ]
               <BOUCLE_trois-engagements (ARTICLES) {id_rubrique=10}{0,3}{par num titre}>
-                    <article>#LOGO_ARTICLE <h2>#TITRE</h2> #CHAPO <a class="bouton-simple" href="#URL_SITE">#NOM_SITE</a>
+                    <article class="#EDIT{texte}">#LOGO_ARTICLE <h2 class="#EDIT{titre}">#TITRE</h2> #CHAPO <a class="bouton-simple" href="#URL_SITE">#NOM_SITE</a>
                     [<div class="#EDIT{ps}">(#PS)</div>]
                 </article>
               </BOUCLE_trois-engagements>