🎨 more style, links fix

templates/styles/style_general.css

@@ -63,14 +63,15 @@ body {
 .content video,
 .content canvas,
 .content svg {
+  width: 75ch;
   display: block;
   margin-top: 1rem;
   margin-bottom: 1rem;
   max-width: 100%;
-  width: 100%;
 }
 
-pre, .sourceCode {
+pre,
+.sourceCode {
   overflow: auto;
 }
 
@@ -90,6 +91,18 @@ main a:hover {
   margin-right: 1rem;
   margin-bottom: 1rem;
 }
+.site-footer a {
+  margin: 0 1rem;
+  text-decoration: underline;
+}
+
+a img {
+  transition: 0.25s box-shadow ease-out;
+}
+a img:hover {
+  box-shadow: 0 0 1rem #ccc;
+  transition: 0.25s all ease-in;
+}
 
 input,
 button,
@@ -165,7 +178,7 @@ li a {
 }
 
 .navbar-brand {
-  display: blog;
+  visibility: hidden;
   text-align: left;
 }
 
@@ -178,6 +191,22 @@ li a {
   height: 2rem;
   margin-right: 1rem;
 }
+.navbar-menu a {
+  margin: 0 1rem;
+  text-decoration: underline;
+}
+
+#recherche {
+  margin-top: 1.5rem;
+  margin-bottom: 1.5rem;
+  float: right;
+}
+#recherche input {
+  background: transparent;
+  padding: 0.5rem;
+  border: solid 1px #555;
+  border-radius: 0.5rem;
+}
 
 #masthead {
   text-align: center;
@@ -192,26 +221,37 @@ li a {
 
 .header-image {
   padding: 1rem;
+  background-position: center;
+  background-size: cover;
 }
 
 .blog-title,
 .blog-subtitle {
   margin: 1rem;
+  color: #fff;
+  text-shadow: 0 0 1rem #555;
 }
 
 #page {
-  background: #CCC;
+  background: #f4f4f4;
 }
 
 .body-wrap {
-  background: #FFF;
+  background: #fff;
   padding: 5% 6%;
   margin-bottom: 5%;
   margin-top: 1rem;
+  border-radius: 1rem;
+  margin-top: 7rem;
 }
 
 .content {
-  min-height: 50rem;
+  min-height: 15rem;
+}
+
+.after-article {
+  border-top: 1px solid #dedede;
+  padding: 1rem;
 }
 
 .site-footer {
@@ -225,6 +265,13 @@ li a {
   display: none;
 }
 
+#tags_page li {
+  margin-right: 2ch;
+}
+#tags_page li a {
+  margin-right: 1ch;
+}
+
 @media (max-width: 75ch) {
   body {
     padding: 0;