Glowing Froala Editor

Glowing Froala Editor

Update for RGB effect

CSS:
/* GLOWING EDITOR */
@-webkit-keyframes glow {
    0%, 30%, 60%, 90% {
        border-color: #ff0000;
        -webkit-box-shadow: 0 0 4px #ff0000;
        -moz-box-shadow: 0 0 4px #ff0000;
        box-shadow: 0 0 4px #ff0000;
    }
    10%, 40%, 70%, 100% {
        border-color: #00ff00;
        -webkit-box-shadow: 0 0 4px #00ff00;
        -moz-box-shadow: 0 0 4px #00ff00;
        box-shadow: 0 0 4px #00ff00;
    }
    20%, 50%, 80% {
        border-color: #0000ff;
        -webkit-box-shadow: 0 0 4px #0000ff;
        -moz-box-shadow: 0 0 4px #0000ff;
        box-shadow: 0 0 4px #0000ff;
    }
}
.fr-box.fr-basic {
    &.is-focused {
        -webkit-animation: glow 18s infinite alternate;  
        -webkit-transition: border 18s linear, box-shadow 1.0s linear;
        -moz-transition: border 18s linear, box-shadow 1.0s linear;
        transition: border 18s linear, box-shadow 1.0s linear;
    }
}

glow-2-3-rgb.gif


Since @CedricV wanted RGB 😅
  • Haha
Reactions: CedricV
Back
Top Bottom