aimond/sapiens-web3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove all shaking animation features from the platform

Browse Source 
Removed the CSS keyframes and animation classes related to shaking animations in client/src/index.css and conditional application of 'animate-shake' class in client/src/components/MainContent.tsx.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: f8b8f0ea-e52e-4118-9b6b-e44184e17203
Replit-Commit-Checkpoint-Type: full_checkpoint
This commit is contained in:
kimjaehyeon0101
2025-10-01 05:50:35 +00:00
parent d4d521b40b
commit b5e8cf3d3a
2 changed files with 1 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
client/src/components/MainContent.tsx
View File

@ -93,7 +93,7 @@ export default function MainContent() {
</Badge> </Badge>
</div> </div>
)} )}
<CardContent className="p-2"> <CardContent className={`p-2 ${isErlingHaaland ? 'animate-shake' : ''}`}>
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">
<div <div
className={`w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center overflow-hidden cursor-pointer hover:ring-2 hover:ring-blue-400 transition-all ${ className={`w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center overflow-hidden cursor-pointer hover:ring-2 hover:ring-blue-400 transition-all ${

25
client/src/index.css
View File

@ -137,36 +137,11 @@
animation: float 3s ease-in-out infinite; animation: float 3s ease-in-out infinite;
} }
@keyframes shake {
0%, 100% {
transform: translateX(0) rotate(0deg);
}
10%, 30%, 50%, 70%, 90% {
transform: translateX(-2px) rotate(-1deg);
}
20%, 40%, 60%, 80% {
transform: translateX(2px) rotate(1deg);
}
}
.animate-shake {
animation: shake 0.5s ease-in-out infinite;
}
.animate-float-shake {
animation: float 3s ease-in-out infinite, shake 0.5s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.animate-float { .animate-float {
animation: none; animation: none;
} }
.animate-shake {
animation: none;
}
.animate-float-shake {
animation: none;
}
} }
.card-hover:hover { .card-hover:hover {