MagicBOTAlex
eaab786155
All checks were successful
Rebuild signaller for deprived.dev to rebuild site / test_service (push) Successful in 22s
27 lines
952 B
HTML
27 lines
952 B
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||
<title>Tailwind Group Hover Test</title>
|
||
<!-- ← This is required: load Tailwind’s CDN build -->
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
</head>
|
||
<body class="flex items-center justify-center h-screen bg-gray-100">
|
||
<div class="group relative w-64 h-64 bg-slate-300 overflow-hidden">
|
||
<!-- Hover target (fills the container) -->
|
||
<img
|
||
class="object-cover w-full h-full"
|
||
src="https://via.placeholder.com/256"
|
||
alt="Pressure plate placeholder"
|
||
/>
|
||
|
||
<!-- Hidden by default, flex on group hover -->
|
||
<div
|
||
class="absolute inset-0 hidden group-hover:flex items-center justify-center bg-black bg-opacity-50 text-white text-xl transition-opacity duration-200"
|
||
>
|
||
Baller
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html>
|