shihaam/akaunting
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactoring for timing

Browse Source
This commit is contained in:
Burak Civan 2022-10-24 14:15:06 +03:00
parent 82dd65aca5
commit 07f80bdc7a
3 changed files with 43 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
presets.js vendored
View File

@ -234,6 +234,10 @@ module.exports = {
marquee: {
'0%': { transform: 'translateX(0%)' },
'100%': { transform: 'translateX(-100%)' },
},
marquee_long: {
'0%': { transform: 'translateX(0%)' },
'100%': { transform: 'translateX(-350%)' },
}
},
@ -244,7 +248,8 @@ module.exports = {
spin: 'spin 1000ms infinite',
submit: 'submit 0.7s ease alternate infinite',
submit_second: 'submit_second 0.7s ease alternate infinite',
marquee: 'marquee 9s linear infinite'
marquee: 'marquee 9s linear infinite',
marquee_long: 'marquee_long 14s linear infinite'
},
transitionProperty: {

10
public/akaunting-js/generalAction.js vendored
View File

@ -370,7 +370,14 @@ function marqueeAnimation(truncate) {
if (truncate.offsetWidth > truncate.parentElement.clientWidth || truncate.offsetWidth > truncate.parentElement.parentElement.parentElement.clientWidth) {
truncate.addEventListener('mouseover', function () {
truncate.parentElement.style.animationPlayState = 'running';
truncate.parentElement.classList.add('animate-marquee');
if (truncate.offsetWidth > 400 && truncate.parentElement.clientWidth < 150) {
truncate.parentElement.classList.remove('animate-marquee');
truncate.parentElement.classList.add('animate-marquee_long');
} else {
truncate.parentElement.classList.remove('animate-marquee_long');
truncate.parentElement.classList.add('animate-marquee');
}
if (truncate.parentElement.classList.contains('truncate')) {
truncate.parentElement.classList.remove('truncate');
@ -380,6 +387,7 @@ function marqueeAnimation(truncate) {
truncate.addEventListener('mouseout', function () {
truncate.parentElement.style.animationPlayState = 'paused';
truncate.parentElement.classList.remove('animate-marquee');
truncate.parentElement.classList.remove('animate-marquee_long');
truncate.parentElement.classList.add('truncate');
});

28
public/css/app.css vendored
View File

@ -10039,6 +10039,34 @@ input[type="date"]::-webkit-inner-spin-button,
-webkit-animation: marquee 9s linear infinite;
animation: marquee 9s linear infinite;
}
@-webkit-keyframes marquee_long{
0%{
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
100%{
-webkit-transform: translateX(-350%);
transform: translateX(-350%);
}
}
@keyframes marquee_long{
0%{
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
100%{
-webkit-transform: translateX(-350%);
transform: translateX(-350%);
}
}
.animate-marquee_long{
-webkit-animation: marquee_long 14s linear infinite;
animation: marquee_long 14s linear infinite;
}
.cursor-auto{
cursor: auto;
}