rework blog theme

static/blog-orangina.css

@@ -2,8 +2,10 @@
 
  :root
  {
-     --color-text: #e9d43a;
      --color-background: #1e227b;
+     --color-title: #e9d43a;
+      --color-text: #fdfdfd;
+     --color-link:  #e9d43a;
      --font-emoji : "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
      --font-basic : system-ui,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,Helvetica,Arial,"Helvetica Neue",sans-serif;
  }
@@ -23,17 +25,19 @@
     font-weight: 400;
  }
 
-
+ h1, h2, h3, h4, h5{
+     color: var(--color-title);
+ }
+ 
  hr {
      color: var(--color-text);
  }
  
  * {-moz-box-sizing: border-box; box-sizing: border-box;}
 
-
 a {
   box-shadow: inset 0 0 0 0 var(--color-text);
-  color: --color-text;
+  color: --color-link;
   padding: 0 .25rem;
   margin: 0 -.25rem;
   transition: color .3s ease-in-out, box-shadow .3s ease-in-out;
@@ -46,13 +50,14 @@ a:hover {
   text-decoration: none;
 }
 
- a {
-     color: var(--color-text);
-     text-decoration: underline 2px;
-     font-weight: 700;
-     line-height: 1.5;
- }
+a {
+    color: var(--color-link);
+    text-decoration: underline 2px;
+    font-weight: 700;
+    line-height: 1.5;
+}
 
+ 
  .date {
    margin-bottom: 0;
  }
@@ -68,13 +73,6 @@ a:hover {
  }
 
 
-
- .copyleft {
-   display:inline-block;
-   transform: rotate(180deg);
-   padding-bottom: -15px;
- }
-
  pre {
   white-space: pre-wrap;       /* css-3 */
   white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
@@ -114,17 +112,29 @@ a:hover {
      padding-left: 1.5vw;
  }
 
- 
-.titre {
+
+.head-article {
      text-align: center;
  }
 
 
+.text-article p {
+    padding-left: 2vw;
+    padding-right:2vw;
+}
+
+.text-article h2, h3, h4, h5 {
+    padding-left: 1vw;
+    padding-right:1vw;
+  
+}
+
+
 .index {
     text-align: left;
 }
 
- .articles img {
+.articles img {
      display: block;
      margin-left: auto;
      margin-right: auto;
@@ -142,6 +152,7 @@ a:hover {
  }
 
 
+
  .pagination a {
      border: 1px solid;
      border-color: $color_title;
@@ -164,8 +175,10 @@ a:hover {
      bottom:0px;
      width: 100%;
      text-align:center;
+     padding-bottom:1vw;
  }
 
+ 
  @media only screen and (max-width: 980px)
  {