Added infinite scroll and pagination

source/css/style.css

@@ -179,6 +179,18 @@ nav a {
     color: #dcdcdf !important;
 }
 
+.post {
+    padding: 1em;
+    background-color: #dcdcdf;
+    border-radius: 10px;
+    box-sizing: border-box;
+    margin-bottom: 16px;
+}
+
+.post-feed {
+    width: 32%;
+}
+
 @media (max-width: 768px) {
     .sidebar-content {
         display: none;
@@ -195,6 +207,10 @@ nav a {
     .content {
         width: calc(100% - 1em);
     }
+
+    .post-feed {
+        width: 100%;
+    } 
 }
 
 /* Medium devices (tablets, 576px-768px) */
@@ -224,6 +240,10 @@ nav a {
     body{
         width: 769px;
     }
+
+    .post-feed {
+        width: 48%;
+    }
 }
 
 @media (min-width: 993px) and (max-width: 1199px) {
@@ -253,12 +273,6 @@ img:hover {
 }
 
 /* Post */
-.posts-container {
-    display: flex;
-    justify-content: space-between;
-    gap: 1em;
-}
-
 .column {
     flex: 1;
     display: flex;
@@ -266,13 +280,6 @@ img:hover {
     gap: 1em;
 }
 
-.post {
-    padding: 1em;
-    background-color: #dcdcdf;
-    border-radius: 10px;
-    box-sizing: border-box;
-}
-
 .post-header {
     line-height: 100%;
     color:#343a40;
@@ -283,7 +290,7 @@ img:hover {
     font-style: italic;
 }
 
-/* Poskt - Top section */
+/* Post - Top section */
 .article {
     font-size: 35px !important;
     line-height: 40px !important;
@@ -313,4 +320,4 @@ img:hover {
 
 .tags a:hover {
     color: #9fa5aa !important;
-}
+}