2025-summer/team-1
12
Fork 0
Code Issues Pull requests Projects Releases Activity

ziopera sto radar fa schifo

Browse source
This commit is contained in:
Francesco De Carlo 2025-08-02 03:40:45 +02:00
parent aa25c6075b
commit ae5efae865
2 changed files with 43 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

8
frontend/src/routes/zesty/+page.svelte Normal file
View file

@ -0,0 +1,8 @@
<script>
import Radar from './components/Radar.svelte';
</script>
<div class="flex items-center justify-center h-screen bg-gray-900">
<Radar />
</div>
<style>
</style>

35
frontend/src/routes/zesty/components/Radar.svelte Normal file
View file

@ -0,0 +1,35 @@
<div class="relative w-64 h-64">
<!-- Radar container (invisibile, leggerissimo sfondo) -->
<div class="w-full h-full rounded-full bg-transparent border-8 border-cyan-400/10 overflow-hidden ">
<!-- Sweep beam: leggero, soft -->
<div class="absolute inset-0 animate-spin-slow origin-center">
<div class="absolute w-2/3 h-full bg-gradient-to-r from-cyan-400 to-transparent opacity-10 rounded-bl-full blur-md"></div>
</div>
<!-- Lancetta centrale -->
<div class="absolute inset-0 animate-spin-slower origin-center">
<div class="absolute w-2 h-1/2 bg-cyan-400 opacity-80 left-1/2 top-0 transform -translate-x-1/2 rounded-sm"></div>
</div>
</div>
</div>
<style>
@keyframes spin-slow {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
@keyframes spin-slower {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.animate-spin-slow {
animation: spin-slow 6s linear infinite;
}
.animate-spin-slower {
animation: spin-slower 3s linear infinite;
}
</style>