vue-amazing-ui/lib/textscroll/TextScroll.css

An Amazing Vue3 UI Components Library, Using TypeScript.

.text-scroll-horizontal[data-v-cdf5afc9]{overflow:hidden;display:flex;box-shadow:0 0 5px var(--text-scroll-shadow-color);border-radius:6px;background-color:var(--text-scroll-bg-color)}.text-scroll-horizontal .scroll-items-group[data-v-cdf5afc9]{z-index:1;display:flex;align-items:center;will-change:transform;animation:horizontalScroll-cdf5afc9 var(--text-scroll-duration) linear var(--text-scroll-delay) var(--text-scroll-iteration-count);animation-play-state:var(--text-scroll-play-state)}@keyframes horizontalScroll-cdf5afc9{0%{transform:translate(0)}to{transform:translate(-100%)}}.text-scroll-horizontal .scroll-items-group .scroll-item[data-v-cdf5afc9]{margin-left:var(--text-scroll-item-gap);font-size:16px;font-weight:400;color:#000000e0;line-height:1.57;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-scroll-horizontal .scroll-items-group[data-v-cdf5afc9] .href-item{cursor:pointer;transition:color .3s}.text-scroll-horizontal .scroll-items-group[data-v-cdf5afc9] .href-item:hover{color:var(--text-scroll-href-hover-color)!important}.text-scroll-horizontal .scroll-items-group[data-v-cdf5afc9] .href-item .ellipsis-container{cursor:inherit}.text-scroll-horizontal .scroll-items-reset[data-v-cdf5afc9]{animation:none}.slide-enter-active[data-v-cdf5afc9],.slide-leave-active[data-v-cdf5afc9]{transition:all var(--text-scroll-duration) var(--text-scroll-timing-function)}.slide-enter-from[data-v-cdf5afc9]{transform:translateY(100%) scale(var(--text-scroll-scale));opacity:0}.slide-leave-to[data-v-cdf5afc9]{transform:translateY(-100%) scale(var(--text-scroll-scale));opacity:0}.text-scroll-vertical[data-v-cdf5afc9]{overflow:hidden;position:relative;box-shadow:0 0 5px var(--text-scroll-shadow-color);border-radius:6px;background-color:var(--text-scroll-bg-color)}.text-scroll-vertical .scroll-item-wrap[data-v-cdf5afc9]{position:absolute;left:0;right:0;height:100%;display:flex;align-items:center;justify-content:center;padding:0 var(--text-scroll-item-padding)}.text-scroll-vertical .scroll-item-wrap .scroll-item[data-v-cdf5afc9]{font-size:16px;font-weight:400;color:#000000e0;line-height:1.57;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.text-scroll-vertical .scroll-item-wrap[data-v-cdf5afc9] .href-item{cursor:pointer;transition:color .3s}.text-scroll-vertical .scroll-item-wrap[data-v-cdf5afc9] .href-item:hover{color:var(--text-scroll-href-hover-color)!important}.text-scroll-vertical .scroll-item-wrap[data-v-cdf5afc9] .href-item .ellipsis-container{cursor:inherit}