Merge pull request #183 from BibliothecaDAO/main

add banners to user page

apps/nextjs/src/app/collection/[id]/(list)/L2ERC721Card.tsx

@@ -39,7 +39,7 @@ export const L2ERC721Card = ({
               <Image
                 src={token.image}
                 alt={token.name ?? `beasts-${token.token_id}`}
-                className={'disable-blur ' + isGrid ? "mx-auto disable-blur" : ""}
+                className={isGrid ? "mx-auto" : ""}
                 width={imageSize}
                 height={imageSize}
               />

apps/nextjs/src/app/user/UserTabs.tsx

@@ -26,6 +26,7 @@ export const UserTabs = ({ address }: { address: string }) => {
       { name: "Golden Token", link: "" },
       { name: "Beasts", link: "beasts" },
       { name: "Blobert", link: "blobert" },
+      { name: "Banners", link: "banners" },
     );
   }
   return (

apps/nextjs/src/app/user/[address]/banners/page.tsx

@@ -0,0 +1,23 @@
+import { Suspense } from "react";
+import { LoadingSkeletonGrid } from "@/app/_components/LoadingSkeletonGrid";
+import L2ERC721Table from "@/app/collection/[id]/(list)/L2ERC721Table";
+import { SUPPORTED_L2_CHAIN_ID } from "@/constants/env";
+
+import { Collections, getCollectionAddresses } from "@realms-world/constants";
+
+export default async function Page({
+  params,
+}: {
+  params: { address: string };
+}) {
+  return (
+    <Suspense fallback={<LoadingSkeletonGrid />}>
+      <L2ERC721Table
+        contractAddress={
+          getCollectionAddresses(Collections.BANNERS)[SUPPORTED_L2_CHAIN_ID]!
+        }
+        ownerAddress={params.address}
+      />
+    </Suspense>
+  );
+}

config/styles/globals.css

@@ -134,11 +134,3 @@ body::-webkit-scrollbar-thumb,
   position: relative;
 }
 
-svg image {
-  image-rendering: pixelated;
-}
-@layer components {
-  .disable-blur{
-    image-rendering: pixelated;
-  }
-}