perf(core): replace lazysizes with browser-level lazy loading (#1267)

_sass/layout/home.scss

@@ -6,8 +6,6 @@
   margin-top: 2rem;
 
   .card-wrapper {
-    display: block;
-
     &:hover {
       text-decoration: none;
     }
@@ -18,27 +16,23 @@
   }
 
   .card {
+    border: 0;
+    background: none;
+
     %img-radius {
       border-radius: $base-radius $base-radius 0 0;
     }
 
     .preview-img {
-      height: 10rem;
-
       @extend %img-radius;
 
       img {
-        width: 100%;
-        height: 100%;
-        -o-object-fit: cover;
-        object-fit: cover;
-
         @extend %img-radius;
       }
     }
 
     .card-body {
-      min-height: 10.5rem;
+      height: 100%;
       padding: 1rem;
 
       .card-title {
@@ -136,20 +130,13 @@
 
 /* Tablet */
 @media all and (min-width: 768px) {
+  %img-radius {
+    border-radius: 0 $base-radius $base-radius 0;
+  }
+
   #post-list {
-    %img-radius {
-      border-radius: 0 $base-radius $base-radius 0;
-    }
-
     .card {
-      .preview-img {
-        width: 20rem;
-        height: 11.55rem; // can hold 2 lines each for title and content
-      }
-
       .card-body {
-        min-height: 10.75rem;
-        width: 60%;
         padding: 1.75rem 1.75rem 1.25rem 1.75rem;
 
         .card-text {

_sass/layout/post.scss

@@ -26,26 +26,6 @@
   color: var(--text-color);
 }
 
-.preview-img {
-  overflow: hidden;
-  aspect-ratio: 40 / 21;
-
-  @extend %rounded;
-
-  &:not(.no-bg) {
-    img.lazyloaded {
-      background: var(--img-bg);
-    }
-  }
-
-  img {
-    -o-object-fit: cover;
-    object-fit: cover;
-
-    @extend %rounded;
-  }
-}
-
 h1 + .post-meta {
   > span + span::before {
     @include dot;
@@ -368,10 +348,6 @@ h1 + .post-meta {
 }
 
 @media all and (max-width: 576px) {
-  .preview-img[data-src] {
-    margin-top: 2.2rem;
-  }
-
   .post-tail-bottom {
     flex-wrap: wrap-reverse !important;
 
@@ -396,9 +372,4 @@ h1 + .post-meta {
     margin-left: -0.5rem;
     margin-right: -0.5rem;
   }
-
-  .preview-img[data-src] {
-    max-width: 100vw;
-    border-radius: 0;
-  }
 }