Skip to content

Commit c57aa35

Browse files
committed
Color Fixing
1 parent 08ba8ac commit c57aa35

File tree

5 files changed

+41
-41
lines changed

5 files changed

+41
-41
lines changed

Component/AppBar.razor

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -21,11 +21,11 @@
2121
<!-- Navigation Links -->
2222
<div class="hidden md:flex items-center space-x-4">
2323
<button @onclick="GoToHomePage"
24-
class="text-white hover:text-cartoon-yellow transition-colors font-comic font-bold">
24+
class="text-white hover:text-yellow-300 transition-colors font-comic font-bold drop-shadow-lg">
2525
Episodes
2626
</button>
2727
<button @onclick="GoToStickers"
28-
class="text-white hover:text-cartoon-yellow transition-colors font-comic font-bold">
28+
class="text-white hover:text-yellow-300 transition-colors font-comic font-bold drop-shadow-lg">
2929
Stickers
3030
</button>
3131
</div>
@@ -40,16 +40,16 @@
4040
<div class="flex items-center space-x-1 sm:space-x-2">
4141
<!-- Stats -->
4242
<div class="hidden sm:flex items-center space-x-2 md:space-x-4 text-sm text-white">
43-
<div class="text-center bg-white/20 rounded-2xl px-2 sm:px-4 py-1 sm:py-2 cartoon-rounded">
43+
<div class="text-center bg-white/20 backdrop-blur-sm rounded-2xl px-2 sm:px-4 py-1 sm:py-2 cartoon-rounded border border-white/30">
4444
@if (StateService.IsLoading || !StateService.CurrentVideos.Any())
4545
{
4646
<div class="h-4 sm:h-5 bg-white/30 rounded w-6 sm:w-8 mx-auto mb-1 skeleton"></div>
47-
<div class="text-xs text-white/80 font-comic">Episodes</div>
47+
<div class="text-xs text-white font-comic font-semibold drop-shadow-md">Episodes</div>
4848
}
4949
else
5050
{
51-
<div class="font-bold text-white font-cartoon text-sm sm:text-lg">@StateService.CurrentVideos.Count()</div>
52-
<div class="text-xs text-white/80 font-comic">Episodes</div>
51+
<div class="font-bold text-white font-cartoon text-sm sm:text-lg drop-shadow-lg">@StateService.CurrentVideos.Count()</div>
52+
<div class="text-xs text-white font-comic font-semibold drop-shadow-md">Episodes</div>
5353
}
5454
</div>
5555
</div>

Component/Thumbnail.razor

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
<!-- Video Info -->
2828
<div class="space-y-2 sm:space-y-3">
2929
<!-- Title -->
30-
<h3 class="font-bold text-jerry-brown text-sm sm:text-base line-clamp-2 group-hover:text-tom-blue transition-colors font-cartoon">
30+
<h3 class="font-bold text-amber-800 text-sm sm:text-base line-clamp-2 group-hover:text-blue-600 transition-colors font-cartoon">
3131
@GetCleanTitle()
3232
</h3>
3333

@@ -38,11 +38,11 @@
3838
<RandomSticker CssClass="w-full h-full" ImageCssClass="w-full h-full object-cover" AutoRefresh="true" RefreshIntervalSeconds="15" />
3939
</div>
4040
</div>
41-
<span class="text-xs sm:text-sm text-jerry-dark-brown font-comic font-bold">Tom & Jerry</span>
41+
<span class="text-xs sm:text-sm text-amber-900 font-comic font-bold">Tom & Jerry</span>
4242
</div>
4343

4444
<!-- Stats -->
45-
<div class="text-xs sm:text-sm text-jerry-brown font-comic">
45+
<div class="text-xs sm:text-sm text-amber-800 font-comic font-semibold">
4646
<span class="bg-soft-yellow px-1.5 sm:px-2 py-0.5 sm:py-1 rounded-full">@GetRandomViews() views</span>
4747
<span class="mx-1 sm:mx-2">•</span>
4848
<span class="bg-soft-blue px-1.5 sm:px-2 py-0.5 sm:py-1 rounded-full">@GetRandomTimeAgo()</span>

Pages/Home.razor

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
</div>
3030
<div class="mt-2 text-center">
3131
<div class="text-sm sm:text-base font-bold font-cartoon text-white drop-shadow-lg">TOM</div>
32-
<div class="text-xs font-comic text-white/90 drop-shadow-md">The Cat</div>
32+
<div class="text-xs font-comic text-white drop-shadow-md">The Cat</div>
3333
</div>
3434
</div>
3535

@@ -46,7 +46,7 @@
4646
</div>
4747
<div class="mt-2 text-center">
4848
<div class="text-sm sm:text-base font-bold font-cartoon text-white drop-shadow-lg">JERRY</div>
49-
<div class="text-xs font-comic text-white/90 drop-shadow-md">The Mouse</div>
49+
<div class="text-xs font-comic text-white drop-shadow-md">The Mouse</div>
5050
</div>
5151
</div>
5252
</div>
@@ -58,24 +58,24 @@
5858
Tom & Jerry
5959
</span>
6060
</h1>
61-
<div class="text-lg sm:text-xl md:text-2xl text-white font-comic animate-fadeInUp drop-shadow-lg" style="animation-delay: 0.2s">
61+
<div class="text-lg sm:text-xl md:text-2xl text-white font-comic animate-fadeInUp drop-shadow-lg font-bold" style="animation-delay: 0.2s">
6262
The Ultimate Cat & Mouse Showdown! 🎭
6363
</div>
6464
</div>
6565

6666
<!-- Interactive Description -->
6767
<div class="mb-8 sm:mb-10 max-w-3xl mx-auto px-4">
68-
<p class="text-base sm:text-lg md:text-xl text-white mb-4 font-comic leading-relaxed animate-fadeInUp drop-shadow-md" style="animation-delay: 0.4s">
68+
<p class="text-base sm:text-lg md:text-xl text-white mb-4 font-comic leading-relaxed animate-fadeInUp drop-shadow-lg font-semibold" style="animation-delay: 0.4s">
6969
Experience the timeless rivalry that has entertained generations! Watch as Tom the cat tries every trick in the book to catch Jerry the mouse,
7070
but Jerry always finds a clever way to escape. From classic 1940s episodes to modern adventures,
7171
every chase is filled with laughter, creativity, and pure cartoon magic! ✨
7272
</p>
7373

7474
<!-- Fun Facts Carousel -->
7575
<div class="bg-white/10 backdrop-blur-sm rounded-2xl p-4 mb-6 animate-fadeInUp fact-carousel" style="animation-delay: 0.6s">
76-
<div class="text-sm sm:text-base text-white font-comic drop-shadow-sm">
77-
<span class="text-cartoon-yellow font-bold drop-shadow-md">💡 Fun Fact:</span>
78-
<span id="fun-fact-text" class="drop-shadow-sm">Tom & Jerry won 7 Academy Awards for Best Animated Short Film!</span>
76+
<div class="text-sm sm:text-base text-white font-comic drop-shadow-lg font-semibold">
77+
<span class="text-yellow-300 font-bold drop-shadow-lg">💡 Fun Fact:</span>
78+
<span id="fun-fact-text" class="drop-shadow-lg">Tom & Jerry won 7 Academy Awards for Best Animated Short Film!</span>
7979
</div>
8080
</div>
8181
</div>
@@ -118,15 +118,15 @@
118118
</div>
119119
<div class="max-w-7xl mx-auto px-4 py-6 sm:py-8">
120120
<div class="text-center">
121-
<h2 class="text-2xl sm:text-3xl font-bold font-cartoon text-jerry-brown mb-2 cartoon-text">Start Watching Now!</h2>
122-
<p class="text-jerry-dark-brown mb-4 sm:mb-6 font-comic text-base sm:text-lg px-4">Discover your favorite Tom & Jerry episodes</p>
121+
<h2 class="text-2xl sm:text-3xl font-bold font-cartoon text-amber-800 mb-2 cartoon-text">Start Watching Now!</h2>
122+
<p class="text-amber-900 mb-4 sm:mb-6 font-comic text-base sm:text-lg px-4 font-semibold">Discover your favorite Tom & Jerry episodes</p>
123123
<div class="flex flex-col sm:flex-row gap-3 sm:gap-4 justify-center px-4">
124124
<button @onclick="ScrollToFeatured"
125125
class="cartoon-button px-6 sm:px-8 py-3 sm:py-4 text-white font-bold font-cartoon text-base sm:text-lg">
126126
🎬 Browse Episodes
127127
</button>
128128
<button @onclick="ScrollToAllEpisodes"
129-
class="px-6 sm:px-8 py-3 sm:py-4 bg-soft-blue text-jerry-brown rounded-2xl hover:bg-cartoon-yellow transition-colors font-bold font-comic text-base sm:text-lg border-2 border-jerry-brown shadow-lg hover:shadow-xl transform hover:-translate-y-1">
129+
class="px-6 sm:px-8 py-3 sm:py-4 bg-soft-blue text-amber-800 rounded-2xl hover:bg-cartoon-yellow transition-colors font-bold font-comic text-base sm:text-lg border-2 border-amber-800 shadow-lg hover:shadow-xl transform hover:-translate-y-1">
130130
📺 View All
131131
</button>
132132
<button @onclick="ShowRandomFact"
@@ -277,16 +277,16 @@
277277
</svg>
278278
</div>
279279
<div>
280-
<h2 class="text-2xl sm:text-3xl font-bold font-cartoon text-jerry-brown cartoon-text">Featured Episodes</h2>
281-
<p class="text-jerry-dark-brown font-comic text-base sm:text-lg">Randomly selected classics that never get old! 🎭</p>
280+
<h2 class="text-2xl sm:text-3xl font-bold font-cartoon text-amber-800 cartoon-text">Featured Episodes</h2>
281+
<p class="text-amber-900 font-comic text-base sm:text-lg font-semibold">Randomly selected classics that never get old! 🎭</p>
282282
</div>
283283
</div>
284284
<div class="flex items-center space-x-3">
285285
<button @onclick="RefreshFeaturedEpisodes"
286286
class="px-4 sm:px-6 py-2 sm:py-3 text-xs sm:text-sm bg-tom-blue text-white rounded-2xl font-bold font-comic hover:bg-tom-dark-blue transition-colors cartoon-rounded">
287287
🔄 Refresh Featured
288288
</button>
289-
<span class="hidden sm:inline text-sm text-jerry-brown font-comic bg-cartoon-yellow px-3 py-1 rounded-full">Random Selection</span>
289+
<span class="hidden sm:inline text-sm text-amber-800 font-comic bg-cartoon-yellow px-3 py-1 rounded-full font-semibold">Random Selection</span>
290290
<div class="w-3 h-3 bg-cartoon-red rounded-full animate-pulse cartoon-rounded"></div>
291291
</div>
292292
</div>
@@ -310,8 +310,8 @@
310310
</svg>
311311
</div>
312312
<div>
313-
<h2 class="text-2xl sm:text-3xl font-bold font-cartoon text-jerry-brown cartoon-text">Tom & Jerry Stickers</h2>
314-
<p class="text-jerry-dark-brown font-comic text-base sm:text-lg">Collect your favorite character moments! 🎭✨</p>
313+
<h2 class="text-2xl sm:text-3xl font-bold font-cartoon text-amber-800 cartoon-text">Tom & Jerry Stickers</h2>
314+
<p class="text-amber-900 font-comic text-base sm:text-lg font-semibold">Collect your favorite character moments! 🎭✨</p>
315315
</div>
316316
</div>
317317

@@ -322,7 +322,7 @@
322322
🔄 Refresh
323323
</button>
324324
<button @onclick="ShowAllStickers"
325-
class="px-4 sm:px-6 py-2 sm:py-3 text-xs sm:text-sm bg-soft-blue text-jerry-brown rounded-2xl font-bold font-comic hover:bg-cartoon-yellow transition-colors border-2 border-jerry-brown cartoon-rounded">
325+
class="px-4 sm:px-6 py-2 sm:py-3 text-xs sm:text-sm bg-soft-blue text-amber-800 rounded-2xl font-bold font-comic hover:bg-cartoon-yellow transition-colors border-2 border-amber-800 cartoon-rounded">
326326
👀 View All
327327
</button>
328328
</div>
@@ -342,8 +342,8 @@
342342
</svg>
343343
</div>
344344
<div>
345-
<h2 class="text-2xl sm:text-3xl font-bold font-cartoon text-jerry-brown cartoon-text">All Episodes</h2>
346-
<p class="text-jerry-dark-brown font-comic text-base sm:text-lg">Complete collection of timeless adventures! 🎪</p>
345+
<h2 class="text-2xl sm:text-3xl font-bold font-cartoon text-amber-800 cartoon-text">All Episodes</h2>
346+
<p class="text-amber-900 font-comic text-base sm:text-lg font-semibold">Complete collection of timeless adventures! 🎪</p>
347347
</div>
348348
</div>
349349

@@ -352,10 +352,10 @@
352352
<button class="px-4 sm:px-6 py-2 sm:py-3 text-xs sm:text-sm bg-tom-blue text-white rounded-2xl font-bold font-comic hover:bg-tom-dark-blue transition-colors cartoon-rounded">
353353
All
354354
</button>
355-
<button class="px-4 sm:px-6 py-2 sm:py-3 text-xs sm:text-sm bg-soft-blue text-jerry-brown rounded-2xl font-bold font-comic hover:bg-cartoon-yellow transition-colors border-2 border-jerry-brown cartoon-rounded">
355+
<button class="px-4 sm:px-6 py-2 sm:py-3 text-xs sm:text-sm bg-soft-blue text-amber-800 rounded-2xl font-bold font-comic hover:bg-cartoon-yellow transition-colors border-2 border-amber-800 cartoon-rounded">
356356
Classic
357357
</button>
358-
<button class="px-4 sm:px-6 py-2 sm:py-3 text-xs sm:text-sm bg-soft-blue text-jerry-brown rounded-2xl font-bold font-comic hover:bg-cartoon-yellow transition-colors border-2 border-jerry-brown cartoon-rounded">
358+
<button class="px-4 sm:px-6 py-2 sm:py-3 text-xs sm:text-sm bg-soft-blue text-amber-800 rounded-2xl font-bold font-comic hover:bg-cartoon-yellow transition-colors border-2 border-amber-800 cartoon-rounded">
359359
Modern
360360
</button>
361361
</div>

0 commit comments

Comments
 (0)