xF2 Add-on effect "floating threads"

[ilona]

Hello, anyone can tell me which addon has those sites (effect "floating threads")
https://infected-zone.com/forums/20/
or
https://craxpro.io/forums/cardable-sites.58/

 

[ilona]

Refreshh….. guyssss
Lol 20 characters?? Againn

 

[ilona]

Anyone ???????
Its plugin or something else????

 

[Thanos Crax]

What exactly are you referring to?
screenshot

 

[thomsa]

@ilona that hover , use this code

.structItem.structItem--thread {
    .m-transition(all, 0.3s);
}
.structItem.structItem--thread:hover {
    transform: scale(1.015);
}

 

[ilona]

@ilona that hover , use this code

.structItem.structItem--thread {
    .m-transition(all, 0.3s);
}
.structItem.structItem--thread:hover {
    transform: scale(1.015);
}

View attachment 35313

thomsaThis what u gave is also included to this plugin or whatever it is but is something else.....
When u change categories then all threads "going down in straight line) , "as if automatically were discovering"

 

[thomsa]

This what u gave is also included to this plugin or whatever it is but is something else.....
When u change categories then all threads "going down in straight line) , "as if automatically were discovering"

ilonanot plugin or addon add code to extra.less

 

[ilona]

not plugin or addon add code to extra.less

thomsai added to extra less but this is not what i am asking about.....
the threads in category "discovering automatically" -

 

[thomsa]

i added to extra less but this is not what i am asking about.....
the threads in category "discovering automatically" -

ilonaShow screenshot here.

 

[ilona]

Show screenshot here.

thomsahttps://prnt.sc/w_I1yoUDCFVi

 

[thomsa]

https://prnt.sc/w_I1yoUDCFVi

ilonaright this ?

 

[ilona]

right this ?

View attachment 35321

thomsaYes yes yes yes
Lolllllll disable this 20 characters

 

[BattleKing]

Yes yes yes yes
Lolllllll disable this 20 characters

ilona

    .structItemContainer .structItem:nth-child(20) {
        animation: slideUp .4s ease;
        animation-delay: 3.3s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(19) {
        animation: slideUp .4s ease;
        animation-delay: 3.15s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(18) {
        animation: slideUp .4s ease;
        animation-delay: 3s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(17) {
        animation: slideUp .4s ease;
        animation-delay: 2.85s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(16) {
        animation: slideUp .4s ease;
        animation-delay: 2.7s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(15) {
        animation: slideUp .4s ease;
        animation-delay: 2.55s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(14) {
        animation: slideUp .4s ease;
        animation-delay: 2.4s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(13) {
        animation: slideUp .4s ease;
        animation-delay: 2.25s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(12) {
        animation: slideUp .4s ease;
        animation-delay: 2.1s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(11) {
        animation: slideUp .4s ease;
        animation-delay: 1.95s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(10) {
        animation: slideUp .4s ease;
        animation-delay: 1.8s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(9) {
        animation: slideUp .4s ease;
        animation-delay: 1.65s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(8) {
        animation: slideUp .4s ease;
        animation-delay: 1.5s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(7) {
        animation: slideUp .4s ease;
        animation-delay: 1.35s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(6) {
        animation: slideUp .4s ease;
        animation-delay: 1.2s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(5) {
        animation: slideUp .4s ease;
        animation-delay: 1.05s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(4) {
        animation: slideUp .4s ease;
        animation-delay: .9s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(3) {
        animation: slideUp .4s ease;
        animation-delay: .75s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(2) {
        animation: slideUp .4s ease;
        animation-delay: .6s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(1) {
        animation: slideUp .4s ease;
        animation-delay: .45s;
        animation-fill-mode: backwards
    }

    @keyframes slideUp {
        from {
            transform: translatey(30px);
            opacity: 0;
        }

        to {
            transform: translatey(0px);
            opacity: 1;
        }
    }

I think this is it

 

[ilona]

    .structItemContainer .structItem:nth-child(20) {
        animation: slideUp .4s ease;
        animation-delay: 3.3s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(19) {
        animation: slideUp .4s ease;
        animation-delay: 3.15s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(18) {
        animation: slideUp .4s ease;
        animation-delay: 3s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(17) {
        animation: slideUp .4s ease;
        animation-delay: 2.85s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(16) {
        animation: slideUp .4s ease;
        animation-delay: 2.7s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(15) {
        animation: slideUp .4s ease;
        animation-delay: 2.55s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(14) {
        animation: slideUp .4s ease;
        animation-delay: 2.4s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(13) {
        animation: slideUp .4s ease;
        animation-delay: 2.25s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(12) {
        animation: slideUp .4s ease;
        animation-delay: 2.1s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(11) {
        animation: slideUp .4s ease;
        animation-delay: 1.95s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(10) {
        animation: slideUp .4s ease;
        animation-delay: 1.8s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(9) {
        animation: slideUp .4s ease;
        animation-delay: 1.65s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(8) {
        animation: slideUp .4s ease;
        animation-delay: 1.5s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(7) {
        animation: slideUp .4s ease;
        animation-delay: 1.35s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(6) {
        animation: slideUp .4s ease;
        animation-delay: 1.2s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(5) {
        animation: slideUp .4s ease;
        animation-delay: 1.05s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(4) {
        animation: slideUp .4s ease;
        animation-delay: .9s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(3) {
        animation: slideUp .4s ease;
        animation-delay: .75s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(2) {
        animation: slideUp .4s ease;
        animation-delay: .6s;
        animation-fill-mode: backwards
    }

    .structItemContainer .structItem:nth-child(1) {
        animation: slideUp .4s ease;
        animation-delay: .45s;
        animation-fill-mode: backwards
    }

    @keyframes slideUp {
        from {
            transform: translatey(30px);
            opacity: 0;
        }

        to {
            transform: translatey(0px);
            opacity: 1;
        }
    }

I think this is it

BattleKingthis is it thanks sir

 

[thomsa]

this is it thanks sir

ilonai use this code from dohtheme.

@media (min-width: @xf-responsiveWide)
{
    @animationSpeedValue: .15s;

    .itemAnimation(@iteration) {
        animation: slideUp .4s ease;
        animation-delay: (@iteration * .15s) + (@animationSpeedValue * 2);
        animation-fill-mode: backwards;
    }
    .itemLoop (@i) when (@i > 0) {
        &:nth-child(@{i}) {
            .itemAnimation(@i)
        }
        .itemLoop(@i - 1);
    }

    @keyframes slideUp {
        from {
            transform: translatey(30px);
            opacity: 0;
        };
        to {
            transform: translatey(0px);
            opacity: 1;
        };
    }
        
// discussion_animation
    
    .structItemContainer .structItem
    {
        .itemLoop(20);
    }
    
}

 

[Thanos Crax]

its actually a style property in dohtheme