Creepso/p-stream
1
0
Fork 0
mirror of https://github.com/p-stream/p-stream.git synced 2026-04-21 02:42:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

update featured skeleton

Browse source
This commit is contained in:
Pas 2025-06-04 15:44:41 -06:00
parent 6adfe7ede2
commit bd9d9bc74a
1 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/pages/discover/components/FeaturedCarousel.tsx
View file

@ -67,7 +67,7 @@ function FeaturedCarouselSkeleton({ shorter }: { shorter?: boolean }) {
> >
<div className="relative w-full h-full overflow-hidden"> <div className="relative w-full h-full overflow-hidden">
<div <div
className="absolute inset-0 bg-gray-800" className="absolute inset-0 bg-gray-900"
style={{ style={{
maskImage: maskImage:
"linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 500px)", "linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 500px)",
@ -79,10 +79,10 @@ function FeaturedCarouselSkeleton({ shorter }: { shorter?: boolean }) {
{/* Navigation Buttons Skeleton */} {/* Navigation Buttons Skeleton */}
<div className="absolute left-4 top-1/2 -translate-y-1/2 z-20 p-2 rounded-full bg-black/30"> <div className="absolute left-4 top-1/2 -translate-y-1/2 z-20 p-2 rounded-full bg-black/30">
<div className="w-8 h-8 bg-gray-600 rounded-full animate-pulse" /> <div className="w-8 h-8 bg-gray-900 rounded-full animate-pulse" />
</div> </div>
<div className="absolute right-4 top-1/2 -translate-y-1/2 z-20 p-2 rounded-full bg-black/30"> <div className="absolute right-4 top-1/2 -translate-y-1/2 z-20 p-2 rounded-full bg-black/30">
<div className="w-8 h-8 bg-gray-600 rounded-full animate-pulse" /> <div className="w-8 h-8 bg-gray-900 rounded-full animate-pulse" />
</div> </div>
{/* Navigation Dots Skeleton */} {/* Navigation Dots Skeleton */}
@ -90,7 +90,7 @@ function FeaturedCarouselSkeleton({ shorter }: { shorter?: boolean }) {
{[1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map((i) => ( {[1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map((i) => (
<div <div
key={i} key={i}
className="w-2.5 h-2.5 rounded-full bg-gray-600 animate-pulse" className="w-2.5 h-2.5 rounded-full bg-gray-900 animate-pulse"
/> />
))} ))}
</div> </div>
@ -99,14 +99,14 @@ function FeaturedCarouselSkeleton({ shorter }: { shorter?: boolean }) {
<div className="absolute inset-0 flex items-end pb-20 z-10"> <div className="absolute inset-0 flex items-end pb-20 z-10">
<div className="container mx-auto px-8 md:px-4"> <div className="container mx-auto px-8 md:px-4">
<div className="max-w-3xl"> <div className="max-w-3xl">
<div className="h-12 w-48 bg-gray-600 rounded animate-pulse mb-6" /> <div className="h-12 w-48 bg-gray-900 rounded animate-pulse mb-6" />
<div className="space-y-2 mb-6"> <div className="space-y-2 mb-6">
<div className="h-4 bg-gray-600 rounded animate-pulse w-3/4" /> <div className="h-4 bg-gray-900 rounded animate-pulse w-3/4" />
<div className="h-4 bg-gray-600 rounded animate-pulse w-1/2" /> <div className="h-4 bg-gray-900 rounded animate-pulse w-1/2" />
</div> </div>
<div className="flex gap-4 justify-center items-center sm:justify-start"> <div className="flex gap-4 justify-center items-center sm:justify-start">
<div className="h-10 w-32 bg-gray-600 rounded animate-pulse" /> <div className="h-10 w-32 bg-gray-900 rounded animate-pulse" />
<div className="h-10 w-32 bg-gray-600 rounded animate-pulse" /> <div className="h-10 w-32 bg-gray-900 rounded animate-pulse" />
</div> </div>
</div> </div>
</div> </div>