daisyui/components/textrotate.css

daisyUI 5 - The Tailwind CSS Component Library

/*! 🌼 daisyUI 5.5.13 - MIT License */ @layer utilities{.text-rotate{height:1lh;@layer daisyui.l1.l2.l3{&{vertical-align:bottom;white-space:nowrap;--duration:var(--tw-duration);transition-property:none;display:inline-block;overflow:hidden}&>*{height:calc(var(--items,1)*100%);justify-items:start;display:grid;&:has(:nth-child(2)){--items:2;animation:rotator var(--duration,10s)linear(0 0% 49%,.5 50% 99%,1 100% 100%)infinite}&:has(:nth-child(3)){--items:3;animation:rotator var(--duration,10s)linear(0 0% 32%,.333333 33% 65%,.666666 66% 99%,1 100% 100%)infinite}&:has(:nth-child(4)){--items:4;animation:rotator var(--duration,10s)linear(0 0% 24%,.25 25% 49%,.5 50% 74%,.75 75% 99%,1 100% 100%)infinite}&:has(:nth-child(5)){--items:5;animation:rotator var(--duration,10s)linear(0 0% 19%,.2 20% 39%,.4 40% 59%,.6 60% 79%,.8 80% 99%,1 100% 100%)infinite}&:has(:nth-child(6)){--items:6;animation:rotator var(--duration,10s)linear(0 0% 15%,.16666 16% 32%,.333333 33% 49%,.5 50% 65%,.666666 66% 82%,.833333 83% 99%,1 100% 100%)infinite}&>*{clip-path:inset(.5px 0);align-content:baseline;&:first-child{translate:var(--first-item-position)}}}&:hover{&>*{animation-play-state:paused}}}}@keyframes rotator{89.9999%,to{--first-item-position:0 0%}90%,99.9999%{--first-item-position:0 calc(var(--items)*100%)}to{translate:0 -100%}}}