adrien/quatuor
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

scoreSpan

Browse Source
This commit is contained in:
Adrien MALINGREY
2023-04-21 20:10:03 +02:00
parent ee639d459e
commit e0290a4918
3 changed files with 34 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
css/common.css
View File

@ -87,9 +87,9 @@ tr.line-cleared-animation{
span {
position: absolute;
top: 35%;
top: 20%;
left: 50%;
transform: translate(-50%, -50%);
transform: translate(-50%, 0);
color: rgba(255, 255, 255, 0.8);
text-shadow: 1px 1px rgba(0, 0, 0, 0.8);
font-size: 3vmin;
@ -160,37 +160,46 @@ span {
}
}
#messagesSpan div {
#scoreSpan div {
opacity: 0;
}
#messagesSpan div.rotate-in-animation {
#scoreSpan div.rotate-in-animation {
animation-name: rotate-in-animation;
animation-timing-function: cubic-bezier(.25,.46,.45,.94);
animation-duration: 1s;
}
#messagesSpan div.zoom-in-animation {
#scoreSpan div.zoom-in-animation {
animation-name: zoom-in-animation;
animation-timing-function: cubic-bezier(.25,.46,.45,.94);
transform-origin:center;
}
#messagesSpan div.zoom-in-animation:first-child {
animation-duration: 1s;
}
#messagesSpan div.zoom-in-animation:nth-child(2) {
#scoreSpan div.zoom-in-animation:nth-child(2) {
animation-delay: .2s;
animation-duration: .9s;
}
#messagesSpan div.zoom-in-animation:nth-child(3) {
#scoreSpan div.zoom-in-animation:nth-child(3) {
animation-delay: .4s;
animation-duration: .8s;
}
#messagesSpan div.zoom-in-animation:nth-child(4) {
#scoreSpan div.zoom-in-animation:nth-child(4) {
animation-delay: .6s;
animation-duration: .7s;
}
#messagesSpan div.zoom-in-animation:nth-child(5) {
#scoreSpan div.zoom-in-animation:nth-child(5) {
animation-delay: .8s;
animation-duration: .6s;
}
#scoreSpan div.zoom-in-animation:nth-child(6) {
animation-delay: 1s;
}
#scoreSpan div.zoom-in-animation:nth-child(7) {
animation-delay: 1.2s;
}
#scoreSpan div.zoom-in-animation:nth-child(8) {
animation-delay: 1.4s;
}
#scoreSpan div.zoom-in-animation:nth-child(9) {
animation-delay: 1.6s;
}
#scoreSpan div.zoom-in-animation:nth-child(10) {
animation-delay: 1.8s;
}