[mirotalksfu] - #194 add shockwave effect
هذا الالتزام موجود في:
@@ -217,6 +217,29 @@ body {
|
|||||||
|
|
||||||
.image-grid img:hover {
|
.image-grid img:hover {
|
||||||
transform: scale(1.1);
|
transform: scale(1.1);
|
||||||
|
box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Strong Impact Click Effect */
|
||||||
|
.image-grid img:active {
|
||||||
|
transform: scale(1.2);
|
||||||
|
box-shadow: 0px 15px 35px rgba(0, 0, 0, 0.5);
|
||||||
|
animation: shockwave 0.15s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes shockwave {
|
||||||
|
0% {
|
||||||
|
transform: scale(1.2);
|
||||||
|
box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
transform: scale(0.9);
|
||||||
|
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: scale(1.05);
|
||||||
|
box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.3);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/*--------------------------------------------------------------
|
/*--------------------------------------------------------------
|
||||||
|
|||||||
المرجع في مشكلة جديدة
حظر مستخدم