Changing styles of blog-cards

CosmeValera · Jun 16, 2024 · 3c1699a · 3c1699a
1 parent 1c909af
commit 3c1699a
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 8 deletions.
diff --git a/sass/blog.scss b/sass/blog.scss
@@ -4,23 +4,24 @@
     .blog-cards {
         @include blog-cards-and-blog-post-styles();
 
-        .blog-card {
-            h3 {
-                a.blog-title {
-                    @include underline-effect(absolute, 0px, $color-foreground);
-                }
+        a.blog-card {
+            h3.blog-title {
+                font-family: Andika;
             }
+
             .blog-card-details {
                 display: flex;
                 justify-content: space-between;
                 gap: 2rem;
 
                 .card-description {
                     font-weight: light;
+                    opacity: .7;
                 }
                 .card-date {
                     font-style: italic;
                     min-width: fit-content;
+                    font-family: Andika;
                 }
             }
         }

diff --git a/templates/blog.html b/templates/blog.html
@@ -28,13 +28,13 @@
 
   <div class="blog-cards">
     {% for post in section.pages %}
-    <div class="blog-card">
-      <h3><a class="blog-title" href="{{ post.permalink }}">{{ post.title }}</a></h3>
+    <a class="blog-card" href="{{ post.permalink }}">
+      <h3 class="blog-title">{{ post.title }}</h3>
       <div class="blog-card-details">
         <p class="card-description"> {{ post.description }} </p>
         <span class="card-date"> {{ post.date | date(format="%B %d, %Y") }}</span>
       </div>
-    </div>
+    </a>
     {% endfor %}
   </div>
 </div>