searching filtered assets

app/src/styles/components/input.scss

@@ -558,7 +558,7 @@ input {
     }
 
     .input-value {
-      width: 40px;
+      width: 42px;
       text-align: center;
     }
   }

app/src/styles/components/marketPlace/marketPlace.scss

@@ -114,7 +114,9 @@
           flex-direction: column;
           justify-content: center;
           gap: 6px;
-
+          .assets-container {
+            height: auto;
+          }
           .icon {
             position: absolute;
             top: 12px;

app/src/styles/layout/sidebar.scss

@@ -936,6 +936,7 @@
   padding: 0 6px;
 
   .assets-wrapper {
+    width: 100%;
     position: relative;
     margin: 8px 10px;
 
@@ -1051,3 +1052,51 @@
     }
   }
 }
+
+.assets-container {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  height: 100%;
+  gap: 3px;
+  padding: 10px 0;
+
+  .assets {
+    width: 117px;
+    height: 95px;
+    border-radius: 3.59px;
+    background-color: var(--background-color-gray);
+    padding: 8px;
+    padding-top: 12px;
+    font-weight: $medium-weight;
+    position: relative;
+    overflow: hidden;
+
+    .asset-name {
+      position: relative;
+      z-index: 3;
+      font-size: var(--font-size-regular);
+    }
+
+    .asset-image {
+      height: 100%;
+      width: 100%;
+      position: absolute;
+      // top: 50%;
+      // right: 5px;
+      // transform: translate(0, -50%);
+      top: 0;
+      left: 0;
+      z-index: 2;
+    }
+  }
+}
+.assets-result {
+  width: 100%;
+  height: 100%;
+  margin: 8px 10px;
+  .assets-wrapper {
+    margin: 0;
+  }
+}