Corrige l'alignement de la section des kudos

1 files changed, 45 insertions, 40 deletions

diff --git a/src/css/_contenu.scss b/src/css/_contenu.scss
index 046c723..97c3190 100755
--- a/src/css/_contenu.scss
+++ b/src/css/_contenu.scss
@@ -311,6 +311,7 @@ article {
 section.likes {
   display: flex;
   justify-content: center;
+  margin: 3rem 0 1rem 0;
 
   @mixin lightMode {
     .likesBox {
@@ -364,46 +365,50 @@ section.likes {
     }
 
 
-    .icon {
-      fill: transparent;
-      stroke: pink;
-      stroke-width: 20;
-      cursor: pointer;
-      position: relative;
-      svg {
-        overflow: visible;
-        width: 10rem;
-      }
+    .layout {
+      display: flex;
+      align-items: center;
+      .icon {
+        fill: transparent;
+        stroke: pink;
+        stroke-width: 20;
+        cursor: pointer;
+        position: relative;
+        svg {
+          overflow: visible;
+          width: 10rem;
+        }
 
-      path {
-        stroke-dashoffset: 0;
-        stroke-dasharray: 1550;
-        transform-origin: center;
-      }
+        path {
+          stroke-dashoffset: 0;
+          stroke-dasharray: 1550;
+          transform-origin: center;
+        }
 
-      .hear-main {
-        z-index: 2;
-      }
-      .heart-background {
-        position: absolute;
-        left: 0;
-        right: 0;
-        z-index: 1;
-        stroke: none;
-      }
-      .heart-main path.anim {
-        animation: stroke-animation 2s ease-in-out forwards;
-      }
+        .hear-main {
+          z-index: 2;
+        }
+        .heart-background {
+          position: absolute;
+          left: 0;
+          right: 0;
+          z-index: 1;
+          stroke: none;
+        }
+        .heart-main path.anim {
+          animation: stroke-animation 1.5s ease-in-out forwards;
+        }
 
-      .heart-main ~ .heart-background path.anim-click {
-        animation: fade-animation 0.35s ease-in-out forwards;
-      }
-      .nbLikes {
-        font-family: Source Sans Pro,Segoe UI,Trebuchet MS,Helvetica,Helvetica Neue,Arial,sans-serif;
-        text-align: center;
-        position: relative;
-        top: -10px;
-        height: 0;
+        .heart-main ~ .heart-background path.anim-click {
+          animation: fade-animation 0.35s ease-in-out forwards;
+        }
+        .nbLikes {
+          font-family: Source Sans Pro,Segoe UI,Trebuchet MS,Helvetica,Helvetica Neue,Arial,sans-serif;
+          text-align: center;
+          position: relative;
+          top: -10px;
+          height: 0;
+        }
       }
     }
 
@@ -412,11 +417,11 @@ section.likes {
         fill: transparent;
         transform: scale(1);
       }
-      50% {
+      30% {
         fill: pink;
-        transform: scale(1.1);
+        transform: scale(1.25);
       }
-      70% {
+      50% {
         transform: scale(1);
       }
       100% {