singleblog image issue

components/base/search/styles.module.css

@@ -2,8 +2,8 @@
 .search{
   position: relative;
   display: inline-block;
-  border-radius: 2px;
-  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
+  border-radius: 3px;
+border: 1px solid #00000000;
   .search-input {
   height: 48px;
   width: 30vw;
@@ -12,6 +12,9 @@
   outline: none;
   padding-left: 3rem;
   font-size: 16px;
+  .search-input::placeholder{
+    color: #718096;
+  }
 }
 .search-icon {
   position: absolute;

components/top-level/blog-lists/blog-lists.stories.js

@@ -14,7 +14,7 @@ export const blogLists = {
         description:
           "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
         image: {
-          url: require("@img/lifestyle1.jpg"),
+          url: require("@img/lifestyle1.jpg").default.src,
           width: 470,
           height: 300,
         },
@@ -22,7 +22,7 @@ export const blogLists = {
         author: {
           name: "Isabella ava",
           image: {
-            url: require("@img/a1.jpg"),
+            url: require("@img/a1.jpg").default.src,
             height: 80,
             width: 80,
           },
@@ -35,7 +35,7 @@ export const blogLists = {
         description:
           "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
         image: {
-          url: require("@img/lifestyle2.jpg"),
+          url: require("@img/lifestyle2.jpg").default.src,
           width: 470,
           height: 300,
         },
@@ -44,7 +44,7 @@ export const blogLists = {
         author: {
           name: "Charlotte mia",
           image: {
-            url: require("@img/a2.jpg"),
+            url: require("@img/a2.jpg").default.src,
             width: 80,
             height: 80,
           },
@@ -57,7 +57,7 @@ export const blogLists = {
         description:
           "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
         image: {
-          url: require("@img/lifestyle3.jpg"),
+          url: require("@img/lifestyle3.jpg").default.src,
           width: 470,
           height: 300,
         },
@@ -65,7 +65,7 @@ export const blogLists = {
         author: {
           name: "Elizabeth",
           image: {
-            url: require("@img/a3.jpg"),
+            url: require("@img/a3.jpg").default.src,
             width: 80,
             height: 80,
           },
@@ -78,7 +78,7 @@ export const blogLists = {
         description:
           "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
         image: {
-          url: require("@img/lifestyle4.jpg"),
+          url: require("@img/lifestyle4.jpg").default.src,
           width: 470,
           height: 300,
         },
@@ -86,7 +86,7 @@ export const blogLists = {
         author: {
           name: "Charlotte mia",
           image: {
-            url: require("@img/a1.jpg"),
+            url: require("@img/a1.jpg").default.src,
             width: 80,
             height: 80,
           },
@@ -98,7 +98,7 @@ export const blogLists = {
         description:
           "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
         image: {
-          url: require("@img/lifestyle5.jpg"),
+          url: require("@img/lifestyle5.jpg").default.src,
           width: 470,
           height: 300,
         },
@@ -106,7 +106,7 @@ export const blogLists = {
         author: {
           name: "Elizabeth",
           image: {
-            url: require("@img/a3.jpg"),
+            url: require("@img/a3.jpg").default.src,
             width: 80,
             height: 80,
           },
@@ -119,7 +119,7 @@ export const blogLists = {
         description:
           "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
         image: {
-          url: require("@img/lifestyle6.jpg"),
+          url: require("@img/lifestyle6.jpg").default.src,
           width: 470,
           height: 300,
         },
@@ -127,7 +127,7 @@ export const blogLists = {
         author: {
           name: "Isabella ava",
           image: {
-            url: require("@img/a1.jpg"),
+            url: require("@img/a1.jpg").default.src,
             width: 80,
             height: 80,
           },
@@ -139,7 +139,7 @@ export const blogLists = {
         description:
           "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
         image: {
-          url: require("@img/lifestyle6.jpg"),
+          url: require("@img/lifestyle6.jpg").default.src,
           width: 470,
           height: 300,
         },
@@ -147,7 +147,7 @@ export const blogLists = {
         author: {
           name: "Isabella ava",
           image: {
-            url: require("@img/a1.jpg"),
+            url: require("@img/a1.jpg").default.src,
             width: 80,
             height: 80,
           },
@@ -159,7 +159,7 @@ export const blogLists = {
         description:
           "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
         image: {
-          url: require("@img/lifestyle6.jpg"),
+          url: require("@img/lifestyle6.jpg").default.src,
           width: 470,
           height: 300,
         },
@@ -167,7 +167,7 @@ export const blogLists = {
         author: {
           name: "Isabella ava",
           image: {
-            url: require("@img/a1.jpg"),
+            url: require("@img/a1.jpg").default.src,
             width: 80,
             height: 80,
           },
@@ -179,7 +179,7 @@ export const blogLists = {
         description:
           "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
         image: {
-          url: require("@img/lifestyle6.jpg"),
+          url: require("@img/lifestyle6.jpg").default.src,
           width: 470,
           height: 300,
         },
@@ -187,7 +187,7 @@ export const blogLists = {
         author: {
           name: "Isabella ava",
           image: {
-            url: require("@img/a1.jpg"),
+            url: require("@img/a1.jpg").default.src,
             width: 80,
             height: 80,
           },

components/top-level/single-blog/single-blog.stories.js

@@ -11,8 +11,8 @@ export const singleBlog = {
       name: "Charlotte mia",
       image: {
         url: require("@/public/images/blogsingle.jpg").default.src,
-        width: 1100,
-        height: 400,
+        width: 1920,
+        height: 500,
       },
     },