Merge branch 'improve-new-theme' into 'master'

Petits correctifs et améliorations sur le nouveau thème

See merge request !27

_includes/page-footer.html

 <footer class="site-footer">
   <div class="site-footer__logo">
-    <img src="{{ "/images/logo.png" | relative_url }}" />
+    <a href="{% link index.html %}" title="Page d’accueil">
+      <img src="{{ "/images/logo.png" | relative_url }}" />
+    </a>
   </div>
   <div class="site-footer__text">
     <p>

css/codecode.coop.css

@@ -3,14 +3,20 @@
  */
 
 :root {
+  --page-background-color: #FFFFFF;
   --page-margin-color: #F8F6EF;
   --page-title-color: #444444;
+
   --accent-color: #BD0000;
   --link-color: #003BCB;
   --text-color: #333333;
 
   --article-title-color: #000000;
   --article-subtitle-color: var(--accent-color);
+  --article-title-max-width: 640px;
+  --article-text-max-width: 536px;
+
+  --footer-color: #666666;
 
   --baseline: 24px;
   --baseline-subdivision: 8px;
@@ -97,7 +103,7 @@ body {
   border: 1px solid transparent;
   border-left: 1px solid #E9E9E9;
   color: var(--text-color);
-  background-color: white;
+  background-color: var(--page-background-color);
 }
 /* Large screens */
 @media (min-width: 1000px) { body {
@@ -172,7 +178,7 @@ a:hover {
 }
 
 .site-header__tagline {
-  margin-top: 14px;
+  margin-top: 13px;
   margin-bottom: 0;
   padding-bottom: 11px;
 
@@ -207,11 +213,16 @@ a:hover {
  */
 
 .main-content {
+  max-width: var(--article-title-max-width);
   word-wrap: break-word;
 }
 
+.main-content > *:not(h1) {
+  max-width: var(--article-text-max-width);
+}
+
 .main-content h1 {
-  margin-top: 92px;
+  margin-top: 93px;
   margin-bottom: 29px;
   padding-bottom: 11px;
 
@@ -247,17 +258,16 @@ a:hover {
 }
 .main-content h3[id|="section-suivante"] {
   margin-top: 73px;
+  max-width: var(--article-title-max-width);
 }
 
 .main-content p {
-  max-width: 536px;
-  line-height: var(--baseline);
   margin-top: 5px;
-  /* Push the text down and sit it on the baseline */
   margin-bottom: 0;
   padding-bottom: 19px;
-  /* Extra line between the paragraphs (with padding to avoid margin collapse) */
+
   font-size: 18px;
+  line-height: var(--baseline);
   letter-spacing: 0;
 }
 
@@ -395,7 +405,7 @@ a:hover {
  */
 
 h3.home__header {
-  margin-top: 49px;
+  margin-top: 97px;
   margin-bottom: 0;
   padding-bottom: 31px;
 }
@@ -421,15 +431,17 @@ ol.home__articles {
   margin-top: 95px;
   margin-bottom: 120px;
   font-size: 14px;
-  color: #666666;
+  color: var(--footer-color);
   letter-spacing: 0;
   line-height: 16px;
 }
 .site-footer__logo {
   flex-shrink: 1;
 }
-.site-footer__logo img {
+.site-footer__logo * {
   display: block;
+}
+.site-footer__logo img {
   height: 64px;
 }