1 line
28 KiB
HTML
1 line
28 KiB
HTML
<!DOCTYPE html><!--yL3k1BZBHodz5x6rSYGmq--><html lang="en" class="dark"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/_next/static/media/22a5144ee8d83bca-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/7d4881bb7e1bf84d-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="stylesheet" href="/_next/static/css/d2c9f90acdc3eb15.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-ede7222a1aa71f8a.js"/><script src="/_next/static/chunks/4bd1b696-c023c6e3521b1417.js" async=""></script><script src="/_next/static/chunks/255-d81c0ea625384467.js" async=""></script><script src="/_next/static/chunks/main-app-41b62dfa324d0d35.js" async=""></script><script src="/_next/static/chunks/367-3b480e80856df32c.js" async=""></script><script src="/_next/static/chunks/app/page-4f7a9ffe96029c39.js" async=""></script><meta name="next-size-adjust" content=""/><title>Valgo - Watch how sorting actually works</title><meta name="description" content="An animated, narrated visualizer for nine classic sorting algorithms."/><link rel="icon" href="/favicon.ico" type="image/x-icon" sizes="16x16"/><script src="/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule=""></script></head><body class="antialiased font-sans __variable_246ccd __variable_c29908"><div hidden=""><!--$--><!--/$--></div><div class="min-h-screen flex flex-col"><header class="sticky top-0 z-40 border-b border-border bg-background/85 backdrop-blur-md"><div class="container mx-auto max-w-6xl px-4 md:px-6 h-16 flex items-center justify-between gap-4"><div class="flex items-center gap-2.5 min-w-0"><svg viewBox="0 0 20 20" fill="none" class="h-5 w-5 shrink-0 text-foreground"><rect x="2" y="11" width="4" height="7" rx="1" fill="currentColor" opacity="0.5"></rect><rect x="8" y="6" width="4" height="12" rx="1" fill="currentColor" opacity="0.75"></rect><rect x="14" y="2" width="4" height="16" rx="1" fill="currentColor"></rect></svg><h1 class="text-base font-semibold tracking-tight truncate">Valgo</h1><span class="hidden md:inline text-sm text-muted-foreground ml-2 pl-3 border-l border-border truncate">Watch how sorting actually works.</span></div><button class="inline-flex items-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-10 px-4 py-2 gap-2 justify-between min-w-[180px]" type="button" id="radix-_R_9avb_" aria-haspopup="menu" aria-expanded="false" data-state="closed">Bubble Sort<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down h-4 w-4 opacity-60"><path d="m6 9 6 6 6-6"></path></svg></button></div></header><main class="flex-1"><section class="border-b border-border bg-card/30" style="opacity:0;transform:translateY(10px)"><div class="container mx-auto max-w-6xl px-4 md:px-6 py-8 md:py-10"><div class="relative w-full select-none" style="height:360px"><div class="absolute bottom-10 left-0 right-0 flex items-end justify-center gap-[var(--gap)] px-2" style="height:320px;--gap:1.2%"><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">1</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">38</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">75</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">12</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">49</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">86</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">23</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">60</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">97</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">34</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">71</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">8</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">45</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">82</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">19</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">56</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">93</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">30</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">67</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">4</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">41</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">78</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">15</span></div><div class="relative flex-1 rounded-t-[3px] min-w-[2px]" style="background-color:hsl(var(--state-idle))"><span class="absolute -top-5 left-1/2 -translate-x-1/2 text-[10px] font-mono tabular-nums" style="color:hsl(var(--state-idle))">52</span></div></div><div class="absolute bottom-0 left-0 right-0 h-8 px-2"></div></div></div></section><div class="container mx-auto max-w-6xl px-4 md:px-6 py-8 md:py-10"><div class="grid grid-cols-1 lg:grid-cols-3 gap-6"><div class="lg:col-span-2 space-y-6"><div class="rounded-xl border border-border bg-card/60 backdrop-blur-sm p-5 md:p-6"><p class="text-xs uppercase tracking-widest text-muted-foreground mb-2">What's happening</p><div class="min-h-[3.5rem]"><p class="text-lg leading-relaxed text-balance" style="opacity:0;transform:translateY(6px)"></p></div></div><div class="rounded-xl border border-border bg-card/60 backdrop-blur-sm p-5 md:p-6 space-y-5"><div class="flex flex-wrap items-center gap-2"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-11 rounded-md px-8 gap-2 min-w-[112px]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-play h-4 w-4"><polygon points="6 3 20 12 6 21 6 3"></polygon></svg>Play</button><button class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-10 px-4 py-2 gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shuffle h-4 w-4"><path d="M2 18h1.4c1.3 0 2.5-.6 3.3-1.7l6.1-8.6c.7-1.1 2-1.7 3.3-1.7H22"></path><path d="m18 2 4 4-4 4"></path><path d="M2 6h1.9c1.5 0 2.9.9 3.6 2.2"></path><path d="M22 18h-5.9c-1.3 0-2.6-.7-3.3-1.8l-.5-.8"></path><path d="m18 14 4 4-4 4"></path></svg>Shuffle</button><button class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-background hover:bg-accent hover:text-accent-foreground h-10 px-4 py-2 gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-rotate-ccw h-4 w-4"><path d="M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"></path><path d="M3 3v5h5"></path></svg>New shuffle</button><div class="ml-auto flex items-center rounded-lg border border-border overflow-hidden"><button class="px-3 py-1.5 text-xs font-medium transition-colors text-muted-foreground hover:bg-secondary">Slow</button><button class="px-3 py-1.5 text-xs font-medium transition-colors bg-primary text-primary-foreground">Normal</button><button class="px-3 py-1.5 text-xs font-medium transition-colors text-muted-foreground hover:bg-secondary">Fast</button><button class="px-3 py-1.5 text-xs font-medium transition-colors text-muted-foreground hover:bg-secondary">Turbo</button></div></div><div><div class="flex justify-between text-xs text-muted-foreground mb-2"><span>Array size</span><span class="font-mono">24<!-- --> <!-- -->elements</span></div><span dir="ltr" data-orientation="horizontal" aria-disabled="false" class="relative flex w-full touch-none select-none items-center" style="--radix-slider-thumb-transform:translateX(-50%)"><span data-orientation="horizontal" class="relative h-2 w-full grow overflow-hidden rounded-full bg-secondary"><span data-orientation="horizontal" class="absolute h-full bg-primary" style="left:0%;right:80%"></span></span><span style="transform:var(--radix-slider-thumb-transform);position:absolute;left:calc(0% + 0px)"><span role="slider" aria-valuemin="5" aria-valuemax="100" aria-orientation="horizontal" data-orientation="horizontal" tabindex="0" class="block h-5 w-5 rounded-full border-2 border-primary bg-background ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50" style="display:none" data-radix-collection-item=""></span><input style="display:none"/></span></span></div></div></div><div class="space-y-6"><div class="rounded-xl border border-border bg-card/60 backdrop-blur-sm p-5 md:p-6"><p class="text-xs uppercase tracking-widest text-muted-foreground mb-3">Live stats</p><div class="grid grid-cols-2 gap-4"><div class="flex flex-col"><span class="text-[11px] uppercase tracking-widest text-muted-foreground">Comparisons</span><span class="text-2xl font-mono tabular-nums font-semibold text-foreground" style="opacity:0.4">0</span></div><div class="flex flex-col"><span class="text-[11px] uppercase tracking-widest text-muted-foreground">Writes</span><span class="text-2xl font-mono tabular-nums font-semibold text-foreground" style="opacity:0.4">0</span></div><div class="flex flex-col"><span class="text-[11px] uppercase tracking-widest text-muted-foreground">Step</span><span class="text-2xl font-mono tabular-nums font-semibold text-foreground" style="opacity:0.4">0 / 0</span></div><div class="flex flex-col"><span class="text-[11px] uppercase tracking-widest text-muted-foreground">Sorted</span><span class="text-2xl font-mono tabular-nums font-semibold text-foreground" style="opacity:0.4">0 / 24</span></div></div></div><div class="rounded-xl border border-border bg-card/60 backdrop-blur-sm p-5 md:p-6"><h2 class="text-xl font-semibold tracking-tight">Bubble Sort</h2><div class="mt-1 space-y-0.5"><div class="font-mono text-xs text-muted-foreground">Time: O(n^2)</div><div class="font-mono text-xs text-muted-foreground">Space: O(1)</div></div><p class="mt-4 text-sm text-muted-foreground leading-relaxed">Bubble sort is a simple sorting algorithm that repeatedly steps through the list, compares adjacent elements and swaps them if they are in the wrong order. The pass through the list is repeated until the list is sorted.</p></div><div class="rounded-xl border border-border bg-card/60 backdrop-blur-sm p-5 md:p-6"><p class="text-xs uppercase tracking-widest text-muted-foreground mb-1">How the work grows</p><p class="text-xs text-muted-foreground mb-4">Same n, wildly different amounts of work.</p><div class="w-full"><svg viewBox="0 0 320 160" class="w-full h-auto overflow-visible"><line x1="10" y1="150" x2="310" y2="150" stroke="hsl(var(--border))" stroke-width="1"></line><line x1="10" y1="10" x2="10" y2="150" stroke="hsl(var(--border))" stroke-width="1"></line><path d="M 10.0 148.6 L 17.5 146.5 L 25.0 143.0 L 32.5 139.5 L 40.0 136.0 L 47.5 132.5 L 55.0 129.0 L 62.5 125.5 L 70.0 122.0 L 77.5 118.5 L 85.0 115.0 L 92.5 111.5 L 100.0 108.0 L 107.5 104.5 L 115.0 101.0 L 122.5 97.5 L 130.0 94.0 L 137.5 90.5 L 145.0 87.0 L 152.5 83.5 L 160.0 80.0 L 167.5 76.5 L 175.0 73.0 L 182.5 69.5 L 190.0 66.0 L 197.5 62.5 L 205.0 59.0 L 212.5 55.5 L 220.0 52.0 L 227.5 48.5 L 235.0 45.0 L 242.5 41.5 L 250.0 38.0 L 257.5 34.5 L 265.0 31.0 L 272.5 27.5 L 280.0 24.0 L 287.5 20.5 L 295.0 17.0 L 302.5 13.5 L 310.0 10.0" fill="none" stroke="hsl(var(--state-sorted))" stroke-width="1.25" stroke-opacity="0.28" stroke-linecap="round"></path><path d="M 10.0 149.8 L 17.5 149.3 L 25.0 147.6 L 32.5 145.4 L 40.0 143.0 L 47.5 140.4 L 55.0 137.7 L 62.5 134.8 L 70.0 131.8 L 77.5 128.7 L 85.0 125.5 L 92.5 122.3 L 100.0 119.0 L 107.5 115.6 L 115.0 112.2 L 122.5 108.7 L 130.0 105.1 L 137.5 101.6 L 145.0 97.9 L 152.5 94.2 L 160.0 90.5 L 167.5 86.8 L 175.0 83.0 L 182.5 79.2 L 190.0 75.3 L 197.5 71.4 L 205.0 67.5 L 212.5 63.6 L 220.0 59.6 L 227.5 55.6 L 235.0 51.6 L 242.5 47.5 L 250.0 43.4 L 257.5 39.3 L 265.0 35.2 L 272.5 31.1 L 280.0 26.9 L 287.5 22.7 L 295.0 18.5 L 302.5 14.3 L 310.0 10.0" fill="none" stroke="hsl(var(--primary))" stroke-width="1.25" stroke-opacity="0.28" stroke-linecap="round"></path><path d="M 10.0 149.8 L 17.5 149.3 L 25.0 147.6 L 32.5 145.4 L 40.0 143.0 L 47.5 140.4 L 55.0 137.7 L 62.5 134.8 L 70.0 131.8 L 77.5 128.7 L 85.0 125.5 L 92.5 122.3 L 100.0 119.0 L 107.5 115.6 L 115.0 112.2 L 122.5 108.7 L 130.0 105.1 L 137.5 101.6 L 145.0 97.9 L 152.5 94.2 L 160.0 90.5 L 167.5 86.8 L 175.0 83.0 L 182.5 79.2 L 190.0 75.3 L 197.5 71.4 L 205.0 67.5 L 212.5 63.6 L 220.0 59.6 L 227.5 55.6 L 235.0 51.6 L 242.5 47.5 L 250.0 43.4 L 257.5 39.3 L 265.0 35.2 L 272.5 31.1 L 280.0 26.9 L 287.5 22.7 L 295.0 18.5 L 302.5 14.3 L 310.0 10.0" fill="none" stroke="hsl(var(--state-pivot))" stroke-width="1.25" stroke-opacity="0.28" stroke-linecap="round"></path><path d="M 10.0 150.0 L 17.5 149.9 L 25.0 149.7 L 32.5 149.2 L 40.0 148.6 L 47.5 147.8 L 55.0 146.8 L 62.5 145.7 L 70.0 144.4 L 77.5 142.9 L 85.0 141.3 L 92.5 139.4 L 100.0 137.4 L 107.5 135.2 L 115.0 132.8 L 122.5 130.3 L 130.0 127.6 L 137.5 124.7 L 145.0 121.7 L 152.5 118.4 L 160.0 115.0 L 167.5 111.4 L 175.0 107.6 L 182.5 103.7 L 190.0 99.6 L 197.5 95.3 L 205.0 90.8 L 212.5 86.2 L 220.0 81.4 L 227.5 76.4 L 235.0 71.3 L 242.5 65.9 L 250.0 60.4 L 257.5 54.7 L 265.0 48.8 L 272.5 42.8 L 280.0 36.6 L 287.5 30.2 L 295.0 23.7 L 302.5 16.9 L 310.0 10.0" fill="none" stroke="hsl(var(--state-swap))" stroke-width="2.75" stroke-opacity="1" stroke-linecap="round"></path><circle cx="82" cy="141.936" r="4" fill="hsl(var(--state-swap))"></circle></svg><div class="mt-3 flex flex-wrap gap-x-4 gap-y-1.5 text-xs font-mono"><div class="flex items-center gap-1.5" style="opacity:0.45"><span class="inline-block h-2 w-2 rounded-full" style="background-color:hsl(var(--state-sorted))"></span><span style="color:hsl(var(--muted-foreground))">O(n + k)</span></div><div class="flex items-center gap-1.5" style="opacity:0.45"><span class="inline-block h-2 w-2 rounded-full" style="background-color:hsl(var(--primary))"></span><span style="color:hsl(var(--muted-foreground))">O(n log n)</span></div><div class="flex items-center gap-1.5" style="opacity:0.45"><span class="inline-block h-2 w-2 rounded-full" style="background-color:hsl(var(--state-pivot))"></span><span style="color:hsl(var(--muted-foreground))">O(n log² n)</span></div><div class="flex items-center gap-1.5" style="opacity:1"><span class="inline-block h-2 w-2 rounded-full" style="background-color:hsl(var(--state-swap))"></span><span style="color:hsl(var(--state-swap))">O(n²)</span></div></div></div></div></div></div></div></main><footer class="border-t border-border bg-card/40 py-6 mt-16"><div class="container mx-auto max-w-6xl px-4 md:px-6 flex flex-wrap items-center justify-between gap-4"><p class="text-sm text-muted-foreground">© <!-- -->2024<!-- --> Quintavalle Pietro. <!-- -->All rights reserved.</p><nav class="flex items-center gap-4"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-background hover:bg-accent hover:text-accent-foreground h-9 rounded-md px-3 gap-1.5" type="button" id="radix-_R_ravb_" aria-haspopup="menu" aria-expanded="false" data-state="closed"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-globe h-3.5 w-3.5"><circle cx="12" cy="12" r="10"></circle><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"></path><path d="M2 12h20"></path></svg>EN</button><button type="button" aria-haspopup="dialog" aria-expanded="false" aria-controls="radix-_R_1bavb_" data-state="closed" class="text-sm text-muted-foreground hover:text-foreground transition-colors">License</button><a href="https://github.com/Quinta0" target="_blank" rel="noopener noreferrer" class="text-muted-foreground hover:text-foreground transition-colors"><svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M12 .5C5.48.5.5 5.48.5 12c0 5.08 3.29 9.35 7.85 10.86.58.1.79-.24.79-.54 0-.27-.01-.99-.01-1.94-3.19.69-3.86-1.54-3.86-1.54-.53-1.36-1.29-1.72-1.29-1.72-1.05-.72.08-.71.08-.71 1.16.08 1.77 1.2 1.77 1.2 1.03 1.77 2.69 1.26 3.34.96.1-.75.4-1.26.73-1.55-2.55-.29-5.23-1.28-5.23-5.72 0-1.26.45-2.29 1.2-3.1-.12-.29-.52-1.45.12-3.02 0 0 .97-.31 3.17 1.18.92-.26 1.91-.39 2.89-.39.98 0 1.97.13 2.89.39 2.2-1.49 3.17-1.18 3.17-1.18.64 1.57.24 2.73.12 3.02.75.81 1.2 1.84 1.2 3.1 0 4.46-2.69 5.43-5.25 5.71.41.35.78 1.03.78 2.08 0 1.5-.01 2.72-.01 3.08 0 .3.21.65.8.54C20.71 21.35 24 17.08 24 12c0-6.52-4.98-11.5-12-11.5z"></path></svg></a><a href="mailto:0pietroquintavalle0@gmail.com" class="text-muted-foreground hover:text-foreground transition-colors"><svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M12 12.713l11.985-8.677a.868.868 0 0 0-.491-.148H.506c-.177 0-.344.055-.491.148L12 12.713zm0 1.431L.035 5.596A.875.875 0 0 0 0 6.125v11.75c0 .478.387.875.875.875h22.25c.478 0 .875-.387.875-.875V6.125a.875.875 0 0 0-.035-.529L12 14.144z"></path></svg></a><a href="https://www.linkedin.com/in/pietro-quintavalle-996b96267/" target="_blank" rel="noopener noreferrer" class="text-muted-foreground hover:text-foreground transition-colors"><svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.761 0 5-2.239 5-5v-14c0-2.761-2.239-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.5c-.966 0-1.75-.784-1.75-1.75s.784-1.75 1.75-1.75 1.75.784 1.75 1.75-.784 1.75-1.75 1.75zm13.5 12.5h-3v-5.5c0-1.379-1.121-2.5-2.5-2.5s-2.5 1.121-2.5 2.5v5.5h-3v-11h3v1.474c.809-1.161 2.201-1.974 3.5-1.974 2.481 0 4.5 2.019 4.5 4.5v7z"></path></svg></a></nav></div></footer></div><!--$--><!--/$--><script src="/_next/static/chunks/webpack-ede7222a1aa71f8a.js" id="_R_" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[9766,[],\"\"]\n3:I[8924,[],\"\"]\n4:I[1959,[],\"ClientPageRoot\"]\n5:I[2871,[\"367\",\"static/chunks/367-3b480e80856df32c.js\",\"974\",\"static/chunks/app/page-4f7a9ffe96029c39.js\"],\"default\"]\n8:I[4431,[],\"OutletBoundary\"]\na:I[5278,[],\"AsyncMetadataOutlet\"]\nc:I[4431,[],\"ViewportBoundary\"]\ne:I[4431,[],\"MetadataBoundary\"]\nf:\"$Sreact.suspense\"\n11:I[7150,[],\"\"]\n:HL[\"/_next/static/media/22a5144ee8d83bca-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/7d4881bb7e1bf84d-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/css/d2c9f90acdc3eb15.css\",\"style\"]\n"])</script><script>self.__next_f.push([1,"0:{\"P\":null,\"b\":\"yL3k1BZBHodz5x6rSYGmq\",\"p\":\"\",\"c\":[\"\",\"\"],\"i\":false,\"f\":[[[\"\",{\"children\":[\"__PAGE__\",{}]},\"$undefined\",\"$undefined\",true],[\"\",[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/d2c9f90acdc3eb15.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"dark\",\"children\":[\"$\",\"body\",null,{\"className\":\"antialiased font-sans __variable_246ccd __variable_c29908\",\"children\":[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":404}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}]}]]}],{\"children\":[\"__PAGE__\",[\"$\",\"$1\",\"c\",{\"children\":[[\"$\",\"$L4\",null,{\"Component\":\"$5\",\"searchParams\":{},\"params\":{},\"promises\":[\"$@6\",\"$@7\"]}],null,[\"$\",\"$L8\",null,{\"children\":[\"$L9\",[\"$\",\"$La\",null,{\"promise\":\"$@b\"}]]}]]}],{},null,false]},null,false],[\"$\",\"$1\",\"h\",{\"children\":[null,[[\"$\",\"$Lc\",null,{\"children\":\"$Ld\"}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]],[\"$\",\"$Le\",null,{\"children\":[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$f\",null,{\"fallback\":null,\"children\":\"$L10\"}]}]}]]}],false]],\"m\":\"$undefined\",\"G\":[\"$11\",[]],\"s\":false,\"S\":true}\n"])</script><script>self.__next_f.push([1,"6:{}\n7:\"$0:f:0:1:2:children:1:props:children:0:props:params\"\n"])</script><script>self.__next_f.push([1,"d:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n9:null\n"])</script><script>self.__next_f.push([1,"12:I[622,[],\"IconMark\"]\nb:{\"metadata\":[[\"$\",\"title\",\"0\",{\"children\":\"Valgo - Watch how sorting actually works\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"An animated, narrated visualizer for nine classic sorting algorithms.\"}],[\"$\",\"link\",\"2\",{\"rel\":\"icon\",\"href\":\"/favicon.ico\",\"type\":\"image/x-icon\",\"sizes\":\"16x16\"}],[\"$\",\"$L12\",\"3\",{}]],\"error\":null,\"digest\":\"$undefined\"}\n"])</script><script>self.__next_f.push([1,"10:\"$b:metadata\"\n"])</script></body></html> |