metro4/less/draggable.less

The front-end framework for Build responsive, mobile-first projects on the web with the first front-end component library in Metro Style

@import (once) "include/vars";
@import (once) "include/mixins";

@dragFlushAlpha: .45;
@dragFlushColor: @cyan;
@dragFlushSize: .25rem;

.draggable {
    animation: drag-flush 1s ease infinite;
    z-index: @zindex-top - 1!important;
}


@keyframes drag-flush {
    0% {
        box-shadow: 0 0 0 0 rgba(red(@dragFlushColor), green(@dragFlushColor), blue(@dragFlushColor), @dragFlushAlpha);
    }

    50% {
        box-shadow: 0 0 0 @dragFlushSize rgba(red(@dragFlushColor), green(@dragFlushColor), blue(@dragFlushColor), @dragFlushAlpha);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(red(@dragFlushColor), green(@dragFlushColor), blue(@dragFlushColor), @dragFlushAlpha);
    }
}