diff --git a/components/wishlist/WishlistCard/WishlistCard.module.css b/components/wishlist/WishlistCard/WishlistCard.module.css index ca0e8cc6c..879184dac 100644 --- a/components/wishlist/WishlistCard/WishlistCard.module.css +++ b/components/wishlist/WishlistCard/WishlistCard.module.css @@ -1,5 +1,5 @@ .root { - @apply grid grid-cols-12 w-full gap-6 px-3 py-6 border-b border-accents-2; + @apply grid grid-cols-12 w-full gap-6 px-3 py-6 border-b border-accents-2 transition duration-100 ease-in-out; &:nth-child(3n + 1) { & .productBg { diff --git a/pages/wishlist.tsx b/pages/wishlist.tsx index f89d2e47f..a5c9ad59f 100644 --- a/pages/wishlist.tsx +++ b/pages/wishlist.tsx @@ -6,6 +6,7 @@ import { Layout } from '@components/core' import { Heart } from '@components/icons' import { Container, Text } from '@components/ui' import { WishlistCard } from '@components/wishlist' +import { Transition } from '@headlessui/react' export async function getStaticProps({ preview, @@ -27,22 +28,45 @@ export default function Wishlist() { My Wishlist
{isEmpty ? ( -
- - - -

- Your wishlist is empty -

-

- Biscuit oat cake wafer icing ice cream tiramisu pudding cupcake. -

-
+ + +
+ + + +

+ Your wishlist is empty +

+

+ Biscuit oat cake wafer icing ice cream tiramisu pudding + cupcake. +

+
+
+
) : ( - data && - data.items?.map((item) => ( - - )) + + {data && + data.items?.map((item) => ( + + + + ))} + )}