progress i think? sync at least
All checks were successful
Rebuild signaller for deprived.dev to rebuild site / test_service (push) Successful in 22s

This commit is contained in:
MagicBOTAlex 2025-07-09 17:02:42 +08:00
parent a6acc0e647
commit eaab786155
6 changed files with 1095 additions and 779 deletions

1800
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -0,0 +1,14 @@
<script>
import ShopItemCard from "./comps/ShopItemCard.svelte";
</script>
<div class="p-8 flex w-full justify-center">
<div class="text-4xl cozette">Items</div>
</div>
<div class="flex w-full justify-center">
<div class="grid grid-cols-2 gap-4 ">
{#each { length: 5 } as _, i}
<ShopItemCard/>
{/each}
</div>
</div>

View file

@ -0,0 +1,15 @@
<script>
</script>
<div>
<div class="group relative w-64 h-64 bg-slate-300">
<div class="w-full h-full">
<img class="object-cover w-full h-full peer" src="/images/Zhen/Infomatik/PressurePlate.png" alt="">
</div>
<div class="absolute hidden group-hover:flex w-full h-full top-0 bg-black opacity-50">
Baller
</div>
</div>
</div>

View file

@ -0,0 +1,5 @@
<script>
import Shop from "@shop/_shop_main.svelte";
</script>
<Shop/>

View file

@ -1,17 +1,14 @@
import typo from "@tailwindcss/typography"
import daisyui from "daisyui"
import typo from "@tailwindcss/typography";
import daisyui from "daisyui";
/** @type {import('tailwindcss').Config} */
export default {
content: ['./src/**/*.{html,js,svelte,ts}'],
content: ["./src/**/*.{html,js,svelte,ts}"],
theme: {
extend: {},
},
plugins: [typo, daisyui],
daisyui: {
themes: [
"forest",
],
themes: ["forest"],
},
}
};

27
test.html Normal file
View file

@ -0,0 +1,27 @@
<!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 Tailwinds 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>