code refactoring

This commit is contained in:
Burak Civan 2022-10-20 16:32:13 +03:00
parent f84c0801b9
commit 41b933143b
3 changed files with 33 additions and 20 deletions

View File

@ -366,7 +366,7 @@ function marqueeAnimation(truncate) {
} }
// offsetwidth = width of the text, clientWidth = width of parent text (div) // offsetwidth = width of the text, clientWidth = width of parent text (div)
// because some index page has icons, we use two time parent element // because some index page has icons, we use two time parent element
if (truncate.offsetWidth > truncate.parentElement.clientWidth || truncate.offsetWidth > truncate.parentElement.parentElement.clientWidth) { if (truncate.offsetWidth > truncate.parentElement.clientWidth || truncate.offsetWidth > truncate.parentElement.parentElement.parentElement.clientWidth) {
truncate.addEventListener('mouseover', function () { truncate.addEventListener('mouseover', function () {
truncate.parentElement.style.animationPlayState = 'running'; truncate.parentElement.style.animationPlayState = 'running';
truncate.parentElement.classList.add('animate-marquee'); truncate.parentElement.classList.add('animate-marquee');
@ -384,6 +384,7 @@ function marqueeAnimation(truncate) {
truncate.classList.add('truncate'); truncate.classList.add('truncate');
truncate.parentElement.classList.add('truncate'); truncate.parentElement.classList.add('truncate');
truncate.parentElement.parentElement.classList.add('overflow-x-hidden');
} }
} }
@ -393,7 +394,7 @@ document.querySelectorAll('[data-truncate]').forEach((truncate) => {
//disable/enable icons ejected from data-truncate, HTML of icons ejected from parent element (data-truncate) //disable/enable icons ejected from data-truncate, HTML of icons ejected from parent element (data-truncate)
document.querySelectorAll('[data-index-icon]').forEach((defaultText) => { document.querySelectorAll('[data-index-icon]').forEach((defaultText) => {
defaultText.parentElement.parentElement.parentElement.appendChild(defaultText); defaultText.parentElement.parentElement.parentElement.parentElement.appendChild(defaultText);
}); });
//disable/enable icons ejected from data-truncate //disable/enable icons ejected from data-truncate

View File

@ -9,9 +9,11 @@
@endphp @endphp
<div {{ $first_attributes }}> <div {{ $first_attributes }}>
<div> <div>
<span data-truncate> <div>
{!! $first !!} <span data-truncate>
</span> {!! $first !!}
</span>
</div>
</div> </div>
</div> </div>
@endif @endif
@ -26,16 +28,20 @@
@endphp @endphp
<div {{ $second_attributes }}> <div {{ $second_attributes }}>
<div> <div>
<span data-truncate> <div>
{!! $second !!} <span data-truncate>
</span> {!! $second !!}
</span>
</div>
</div> </div>
</div> </div>
@endif @endif
<div> <div>
<span data-truncate> <div>
{{ $slot }} <span data-truncate>
</span> {{ $slot }}
</span>
</div>
</div> </div>
</td> </td>

View File

@ -9,9 +9,11 @@
@endphp @endphp
<div {{ $first_attributes }}> <div {{ $first_attributes }}>
<div> <div>
<span data-truncate> <div>
{!! $first !!} <span data-truncate>
</span> {!! $first !!}
</span>
</div>
</div> </div>
</div> </div>
@endif @endif
@ -26,16 +28,20 @@
@endphp @endphp
<div {{ $second_attributes }}> <div {{ $second_attributes }}>
<div> <div>
<span data-truncate> <div>
{!! $second !!} <span data-truncate>
</span> {!! $second !!}
</span>
</div>
</div> </div>
</div> </div>
@endif @endif
<div> <div>
<span data-truncate> <div>
{{ $slot }} <span data-truncate>
</span> {{ $slot }}
</span>
</div>
</div> </div>
</th> </th>