Snigdha-OS/Snigdha-OS.github.io
2
0
Fork 0
mirror of https://github.com/Snigdha-OS/Snigdha-OS.github.io.git synced 2025-09-06 12:45:18 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

✨ style: added spacing in the lists

Browse Source
This commit is contained in:
RiO
2024-12-29 05:03:25 +05:30
parent 8590a0fb78
commit f2e189acc7
1 changed files with 12 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/download/MirrorList.tsx
View File

@@ -10,33 +10,33 @@ interface MirrorListProps {
export function MirrorList({ mirrors, onSelect }: MirrorListProps) {
return (
<div className="space-y-4">
<div className="space-y-6">
{mirrors.map((mirror, index) => (
<motion.div
key={mirror.id}
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ delay: index * 0.1 }}
className="bg-white/80 backdrop-blur-sm p-4 rounded-lg border border-gray-200 hover:border-cornflower-blue transition-colors"
className="bg-white/90 backdrop-blur-sm p-6 rounded-xl border border-gray-200 shadow-lg hover:shadow-2xl hover:border-cornflower-blue transition-all duration-300 ease-in-out"
>
<div className="flex items-center justify-between">
<div className="flex items-center gap-3">
<Globe className="h-5 w-5 text-cornflower-blue" />
<div>
<h3 className="font-medium text-gray-900">{mirror.name}</h3>
<p className="text-sm text-gray-500">{mirror.location}</p>
</div>
</div>
<div className="flex items-center gap-4">
<div className="flex items-center gap-1 text-sm text-gray-600">
<Wifi className="h-4 w-4" />
<Globe className="h-6 w-6 text-cornflower-blue" />
<div>
<h3 className="text-xl font-semibold text-gray-900">{mirror.name}</h3>
<p className="text-sm text-gray-600">{mirror.location}</p>
</div>
</div>
<div className="flex items-center gap-6">
<div className="flex items-center gap-2 text-sm text-gray-600">
<Wifi className="h-5 w-5" />
{formatSpeed(mirror.speed)}
</div>
<button
onClick={() => onSelect(mirror)}
className="flex items-center gap-2 px-4 py-2 bg-cornflower-blue text-white rounded-lg hover:bg-blue-600 transition-colors"
className="flex items-center gap-3 px-5 py-2 bg-cornflower-blue text-white rounded-lg hover:bg-cornflower-blue/80 transition-all duration-300 ease-in-out transform hover:scale-105"
>
<Download className="h-4 w-4" />
<Download className="h-5 w-5" />
Select
</button>
</div>