Add mobile styling

resources/assets/sass/components/_main_news.scss

@@ -2,6 +2,28 @@
 @use "../abstracts/variables" as *;
 
 .blog_grid {
+  @media (max-width: 768px) {
+    overflow-x: auto;
+    overflow-y: hidden;
+    &::-webkit-scrollbar {
+      height: 8px;
+    }
+
+    /* Track */
+    &::-webkit-scrollbar-track {
+      border-radius: 100vw;
+      background: #eee;
+    }
+
+    /* Handle */
+    &::-webkit-scrollbar-thumb {
+      border-radius: 4px;
+      background: linear-gradient(to right, #10229c, #64a9f2);
+    }
+    .grid_view {
+      width: 300%;
+    }
+  }
   .row, .row > * {
     padding: 0;
     margin: 0;
@@ -12,6 +34,9 @@
   .post {
     position: relative;
     height: 100%;
+    @media (max-width: 768px) {
+      height: 50%;
+    }
 
     img {
       width: 100%;
@@ -64,6 +89,12 @@
         font-size: 16px;
         line-height: 1.17;
       }
+      @media (max-width: 768px) {
+        h2 a, h5 a {
+          font-size: 16px;
+          line-height: 1.17;
+        }
+      }
       .post_date {
         @include post_date;
         color: $news-banner-text-color;