[Agregar] estilos al texto delpost y al like para dar me gusta

assets/styles/pages/article/article.css

@@ -125,10 +125,19 @@ header::before {
     font-weight: 300;
 }
 
-/* Post copy */
-
+/* Post text */
 .post__body {
     width: 100%;
+    padding-top: 10px;
+    display: flex;
+    flex-direction: column;
+    /* position: relative; */
+}
+
+.post__aside {
+    width: 90%;
+    margin: 0 auto;
+    /* background-color: tomato; */
 }
 
 .post__copy {
@@ -136,6 +145,44 @@ header::before {
     width: 90%;
     margin: 0 auto;
 }
+
+/* Estilos para el like */
+.icon {
+    width: 30px;
+    height: 30px;
+    opacity: 1;
+    /* position: fixed;
+    top: 50%;
+    left: 50%; */
+    /* transform: translateX(-100%); */
+  }
+
+  #icon-heart > path {
+    fill: var(--color-primary-red);
+  }
+
+  .icon.beat {
+    animation: 2s beat-heart ease-in-out forwards;
+  }
+
+  @keyframes beat-heart {
+    0%{
+      opacity: 0.9;
+      transform: scale(0.7);
+
+    }
+    20%{
+      transform: scale(1.8);
+    }
+    40% {
+      transform: scale(1.2);
+    }
+    80%{
+      opacity: 0;
+      transform: scale(0.7);
+    }
+  }
+
 /* Estilos generales de las etiquetas */
 .post__copy > p:not(p:first-child) {
     margin-top: 2.8rem;

views/pages/article.php

@@ -15,6 +15,7 @@
 <!-- Archivos de JavaScript -->
 <?php $scripts = array(
     'home.js',
+    'article/article.js',
 ) ?>
 <!-- HTML head -->
 <?php require_once 'views/components/head.php' ?>
@@ -46,7 +47,21 @@
     </div>
 </header>
 
+<svg aria-hidden="true" style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <symbol id="icon-heart" viewBox="0 0 32 32">
+      <path d="M23.6 2c-3.363 0-6.258 2.736-7.599 5.594-1.342-2.858-4.237-5.594-7.601-5.594-4.637 0-8.4 3.764-8.4 8.401 0 9.433 9.516 11.906 16.001 21.232 6.13-9.268 15.999-12.1 15.999-21.232 0-4.637-3.763-8.401-8.4-8.401z" style=""></path>
+    </symbol>
+  </defs>
+</svg>
+
 <section class="post__body">
+    <aside class='post__aside'>
+        <svg class="icon icon-heart">
+            <use xlink:href="#icon-heart"></use>
+        </svg>
+    </aside>
+
     <article class="post__copy">
         <p>
         <?= $article['content'] ?>