Error: Snapshot `ItemsSection > should match snapshot with view card 1` mismatched - Expected + Received @@ -25,11 +25,11 @@ > <div class="flex h-full flex-col-reverse justify-center gap-4 md:w-2/3 md:flex-row" > <div - class="relative flex h-full w-full flex-col justify-start gap-2 -top-8 lg:-top-12" + class="relative flex h-full flex-col justify-start gap-2 -top-8 lg:-top-12 w-1/2" > <header class="m-0 flex w-full flex-col items-center gap-2 p-0" > <div @@ -54,11 +54,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/album/undefined?highlighted-track-id=2" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Track 1 </p> </a> <span> @@ -69,11 +69,11 @@ Darkthrone </a> </span> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <span class="w-[2rem] text-center text-5xl" > 2 @@ -175,11 +175,11 @@ </div> </div> </header> </div> <div - class="relative flex h-full w-full flex-col justify-start gap-2 -top-16 lg:-top-24" + class="relative flex h-full flex-col justify-start gap-2 -top-16 lg:-top-24 w-1/2" > <header class="m-0 flex w-full flex-col items-center gap-2 p-0" > <div @@ -204,11 +204,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/album/undefined?highlighted-track-id=123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Track 1 </p> </a> <span> @@ -219,11 +219,11 @@ Darkthrone </a> </span> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <span class="w-[2rem] text-center text-5xl" >

Error: Snapshot `ItemsSection > should match snapshot as artists with view card 1` mismatched - Expected + Received @@ -25,11 +25,11 @@ > <div class="flex h-full flex-col-reverse justify-center gap-4 md:w-2/3 md:flex-row" > <div - class="relative flex h-full w-full flex-col justify-start gap-2 -top-8 lg:-top-12" + class="relative flex h-full flex-col justify-start gap-2 -top-8 lg:-top-12 w-1/2" > <header class="m-0 flex w-full flex-col items-center gap-2 p-0" > <div @@ -54,18 +54,18 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/artist/2" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Darkthrone </p> </a> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <span class="w-[2rem] text-center text-5xl" > 2 @@ -186,11 +186,11 @@ </div> </div> </header> </div> <div - class="relative flex h-full w-full flex-col justify-start gap-2 -top-16 lg:-top-24" + class="relative flex h-full flex-col justify-start gap-2 -top-16 lg:-top-24 w-1/2" > <header class="m-0 flex w-full flex-col items-center gap-2 p-0" > <div @@ -215,18 +215,18 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/artist/123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Darkthrone </p> </a> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <span class="w-[2rem] text-center text-5xl" > 1 @@ -374,18 +374,18 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underl

Error: Snapshot `ItemCard > should match snapshot as album 1` mismatched - Expected + Received @@ -21,11 +21,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/artist/undefined" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] !max-w-[200px]" + class="max-w-[400px] truncate md:max-w-[250px] xl:max-w-[350px] !max-w-[200px]" > Album 1 </p> </a> <div @@ -81,11 +81,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/artist/undefined" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] !max-w-[200px]" + class="max-w-[400px] truncate md:max-w-[250px] xl:max-w-[350px] !max-w-[200px]" > Album 1 </p> </a> <div ❯ app/components/items/cards/item-card.spec.tsx:13:18

Error: Snapshot `ItemCard > should match snapshot as track 1` mismatched - Expected + Received @@ -21,11 +21,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/track/123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] !max-w-[200px]" + class="max-w-[400px] truncate md:max-w-[250px] xl:max-w-[350px] !max-w-[200px]" > Track 1 </p> </a> <div @@ -88,11 +88,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/track/123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] !max-w-[200px]" + class="max-w-[400px] truncate md:max-w-[250px] xl:max-w-[350px] !max-w-[200px]" > Track 1 </p> </a> <div ❯ app/components/items/cards/item-card.spec.tsx:19:18

Error: Snapshot `ItemCard > should match snapshot as artist 1` mismatched - Expected + Received @@ -21,11 +21,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/artist/123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] !max-w-[200px]" + class="max-w-[400px] truncate md:max-w-[250px] xl:max-w-[350px] !max-w-[200px]" > Darkthrone </p> </a> <div @@ -81,11 +81,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/artist/123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] !max-w-[200px]" + class="max-w-[400px] truncate md:max-w-[250px] xl:max-w-[350px] !max-w-[200px]" > Darkthrone </p> </a> <div ❯ app/components/items/cards/item-card.spec.tsx:25:18

Error: Snapshot `ItemTopCard > should match snapshot as track 1` mismatched - Expected + Received @@ -30,11 +30,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/album/undefined?highlighted-track-id=123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Track 1 </p> </a> <span> @@ -45,11 +45,11 @@ Darkthrone </a> </span> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <div class="mt-4 flex w-full flex-row justify-center gap-1" /> </div> @@ -86,11 +86,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/album/undefined?highlighted-track-id=123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Track 1 </p> </a> <span> @@ -101,11 +101,11 @@ Darkthrone </a> </span> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <div class="mt-4 flex w-full flex-row justify-center gap-1" /> </div> ❯ app/components/items/cards/item-top-card.spec.tsx:13:18

Error: Snapshot `ItemTopCard > should match snapshot as album 1` mismatched - Expected + Received @@ -30,18 +30,18 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/artist/undefined" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Album 1 </p> </a> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <div class="mt-4 flex w-full flex-row justify-center gap-1" /> </div> @@ -78,18 +78,18 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/artist/undefined" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Album 1 </p> </a> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <div class="mt-4 flex w-full flex-row justify-center gap-1" /> </div> ❯ app/components/items/cards/item-top-card.spec.tsx:19:18

Error: Snapshot `ItemTopCard > should match snapshot as artist 1` mismatched - Expected + Received @@ -30,18 +30,18 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/artist/123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Darkthrone </p> </a> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <div class="flex h-full flex-row flex-wrap justify-center gap-2" > <div @@ -97,18 +97,18 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/artist/123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Darkthrone </p> </a> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <div class="flex h-full flex-row flex-wrap justify-center gap-2" > <div ❯ app/components/items/cards/item-top-card.spec.tsx:25:18

Error: Snapshot `ItemTopCard > should match snapshot as top 2 1` mismatched - Expected + Received @@ -30,11 +30,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/album/undefined?highlighted-track-id=123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Track 1 </p> </a> <span> @@ -45,11 +45,11 @@ Darkthrone </a> </span> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <span class="w-[2rem] text-center text-5xl" > 2 @@ -183,11 +183,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/album/undefined?highlighted-track-id=123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Track 1 </p> </a> <span> @@ -198,11 +198,11 @@ Darkthrone </a> </span> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <span class="w-[2rem] text-center text-5xl" > 2 ❯ app/components/items/cards/item-top-card.spec.tsx:31:18

Error: Snapshot `ItemTopCard > should match snapshot as top 3 1` mismatched - Expected + Received @@ -30,11 +30,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/album/undefined?highlighted-track-id=123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Track 1 </p> </a> <span> @@ -45,11 +45,11 @@ Darkthrone </a> </span> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <span class="w-[2rem] text-center text-5xl" > 3 @@ -189,11 +189,11 @@ <a class="items-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 cursor-pointer text-primary-foreground underline-offset-4 hover:underline h-9 p-0 text-lg leading-none flex justify-start" href="/album/undefined?highlighted-track-id=123" > <p - class="max-w-[350px] truncate sm:max-w-[400px] md:max-w-[240px] xl:max-w-[340px] text-2xl" + class="truncate md:max-w-[250px] xl:max-w-[350px] max-w-[90vw] text-2xl" > Track 1 </p> </a> <span> @@ -204,11 +204,11 @@ Darkthrone </a> </span> </div> <div - class="flex w-full flex-col items-center justify-center gap-4" + class="flex w-full max-w-[90vw] flex-col items-center justify-center gap-4" > <span class="w-[2rem] text-center text-5xl" > 3 ❯ app/components/items/cards/item-top-card.spec.tsx:37:18