Merge pull request Weaverse#235 from Weaverse/dev

Add more settings for collection details, fix header style
Weaverse · Dec 14, 2024 · 77bcb59 · 77bcb59
2 parents de39599 + 4ebcc5d
commit 77bcb59
Show file tree

Hide file tree

Showing 13 changed files with 152 additions and 406 deletions.
diff --git a/app/components/header/cart-drawer.tsx b/app/components/header/cart-drawer.tsx
@@ -48,15 +48,15 @@ export function CartDrawer() {
                 <div
                   className={clsx(
                     "cart-count",
-                    "absolute top-0 -right-1",
-                    "flex items-center justify-center min-w-4 h-4 rounded-full p-0.5",
+                    "absolute top-0 -right-1.5",
+                    "flex items-center text-center justify-center min-w-4.5 h-4.5 px-1 rounded-full",
                     "text-sm leading-none text-center font-medium",
                     "transition-colors duration-300",
                     "group-hover/header:bg-[--color-header-text]",
                     "group-hover/header:text-[--color-header-bg]",
                   )}
                 >
-                  <span>{cart?.totalQuantity}</span>
+                  <span className="-mr-0.5">{cart?.totalQuantity}</span>
                 </div>
               )}
             </Dialog.Trigger>
@@ -74,8 +74,8 @@ export function CartDrawer() {
               >
                 <div className="space-y-6">
                   <div className="flex gap-2 items-center justify-between px-4">
-                    <Dialog.Title asChild className="py-2.5 font-bold">
-                      <span>Cart</span>
+                    <Dialog.Title asChild className="py-2.5">
+                      <span className="font-bold">Cart</span>
                     </Dialog.Title>
                     <Dialog.Close asChild>
                       <button

diff --git a/app/components/logo.tsx b/app/components/logo.tsx
@@ -25,7 +25,7 @@ export function Logo() {
               sizes="auto"
               className={clsx(
                 "main-logo",
-                "max-w-full h-full object-cover mx-auto",
+                "max-w-full h-full object-contain mx-auto",
                 "transition-opacity duration-300 ease-in group-hover/header:opacity-100",
               )}
               style={{ width: "auto" }}
@@ -36,7 +36,7 @@ export function Logo() {
                 sizes="auto"
                 className={clsx(
                   "transparent-logo",
-                  "absolute top-0 left-0 max-w-full h-full object-cover mx-auto",
+                  "absolute top-0 left-0 max-w-full h-full object-contain mx-auto",
                   "transition-opacity duration-300 ease-in group-hover/header:opacity-0",
                 )}
                 style={{ width: "auto" }}

diff --git a/app/data/queries.ts b/app/data/queries.ts
@@ -160,6 +160,8 @@ export let COLLECTION_QUERY = `#graphql
     $last: Int
     $startCursor: String
     $endCursor: String
+    $customBannerNamespace: String!
+    $customBannerKey: String!
   ) @inContext(country: $country, language: $language) {
     collection(handle: $handle) {
       id
@@ -170,6 +172,20 @@ export let COLLECTION_QUERY = `#graphql
         description
         title
       }
+      metafield(namespace: $customBannerNamespace, key: $customBannerKey) {
+        id
+        type
+        description
+        value
+        reference {
+          ... on MediaImage {
+            image {
+              id
+              url
+            }
+          }
+        }
+      }
       image {
         id
         url

diff --git a/app/lib/collections.ts b/app/lib/collections.ts
@@ -1,5 +1,5 @@
 import type { ProductCollectionSortKeys } from "@shopify/hydrogen/storefront-api-types";
-import type { SortParam } from "~/modules/sort-filter";
+import type { SortParam } from "./filter";
 
 export let getSortValuesFromParam = (
   sortParam: SortParam | null,