XF 2 Tip CTA Blinking Log In / Register Buttons

[Skynet]

Create a very simple, yet effective, call to action button that will flash your "Log In" button to smaller viewports, which hide the "Register" link, and then swap it with the "Register" button in larger viewports when it becomes visible.

Add the following code to your extra.less template:

@media screen and (max-width: 373px) {
    .p-navgroup-link.p-navgroup-link--logIn {
      -webkit-animation: blinkReg 1s infinite;  /* Safari 4+ */
      -moz-animation: blinkReg 1s infinite;  /* Fx 5+ */
      -o-animation: blinkReg 1s infinite;  /* Opera 12+ */
      animation: blinkReg 1s infinite;  /* IE 10+, Fx 29+ */
    }
}
@media screen and (min-width: 374px) {
    .p-navgroup-link.p-navgroup-link--register {
      -webkit-animation: blinkReg 1s infinite;  /* Safari 4+ */
      -moz-animation: blinkReg 1s infinite;  /* Fx 5+ */
      -o-animation: blinkReg 1s infinite;  /* Opera 12+ */
      animation: blinkReg 1s infinite;  /* IE 10+, Fx 29+ */
    }
}
@-webkit-keyframes blinkReg {
    to {
        background-color: fade(@xf-paletteNeutral3, 15%);
    }
}