Joshua Vaage
Twitter Github

interact.css

CSS classes providing hoverstate coloring. Built to use color variables from colors.css module in basscss.

div classes .hvr-red, .hvr-bg-aqua
link
link

    /* interact.css */

    .hvr-aqua:hover {background-color: $aqua}
    .hvr-blue:hover {background-color: $blue}
    .hvr-navy:hover {background-color: $navy}
    .hvr-teal:hover {background-color: $teal}
    .hvr-green:hover {background-color: $green}
    .hvr-olive:hover {background-color: $olive}
    .hvr-lime:hover {background-color: $lime}
    .hvr-yellow:hover {background-color: $yellow}
    .hvr-orange:hover {background-color: $orange}
    .hvr-red:hover {background-color: $red}
    .hvr-fuchsia:hover {background-color: $fuchsia}
    .hvr-purple:hover {background-color: $purple}
    .hvr-maroon:hover {background-color: $maroon}
    .hvr-white:hover {background-color: $white}
    .hvr-silver:hover {background-color: $silver}
    .hvr-gray:hover {background-color: $gray}
    .hvr-black:hover {background-color: $black}


    .hvr-bg-aqua:hover {background-color: $aqua}
    .hvr-bg-blue:hover {background-color: $blue}
    .hvr-bg-navy:hover {background-color: $navy}
    .hvr-bg-teal:hover {background-color: $teal}
    .hvr-bg-green:hover {background-color: $green}
    .hvr-bg-olive:hover {background-color: $olive}
    .hvr-bg-lime:hover {background-color: $lime}
    .hvr-bg-yellow:hover {background-color: $yellow}
    .hvr-bg-orange:hover {background-color: $orange}
    .hvr-bg-red:hover {background-color: $red}
    .hvr-bg-fuchsia:hover {background-color: $fuchsia}
    .hvr-bg-purple:hover {background-color: $purple}
    .hvr-bg-maroon:hover {background-color: $maroon}
    .hvr-bg-white:hover {background-color: $white}
    .hvr-bg-silver:hover {background-color: $silver}
    .hvr-bg-gray:hover {background-color: $gray}
    .hvr-bg-black:hover {background-color: $black}

    .press-bg-aqua:hover {background-color: $aqua}
    .press-bg-blue:hover {background-color: $blue}
    .press-bg-navy:hover {background-color: $navy}
    .press-bg-teal:hover {background-color: $teal}
    .press-bg-green:hover {background-color: $green}
    .press-bg-olive:hover {background-color: $olive}
    .press-bg-lime:hover {background-color: $lime}
    .press-bg-yellow:hover {background-color: $yellow}
    .press-bg-orange:hover {background-color: $orange}
    .press-bg-red:hover {background-color: $red}
    .press-bg-fuchsia:hover {background-color: $fuchsia}
    .press-bg-purple:hover {background-color: $purple}
    .press-bg-maroon:hover {background-color: $maroon}
    .press-bg-white:hover {background-color: $white}
    .press-bg-silver:hover {background-color: $silver}
    .press-bg-gray:hover {background-color: $gray}
    .press-bg-black:hover {background-color: $black}