Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
Highlight links with animated rainbow
  • Loading branch information
justincampbell committed Jan 27, 2017
1 parent d099d5c commit 6d8c21f
Showing 1 changed file with 17 additions and 3 deletions.
20 changes: 17 additions & 3 deletions source/stylesheets/all.css.sass
Expand Up @@ -12,9 +12,18 @@ $link-color: $dark-gray
$link-hover-color: $orange
$text-color: $dark-gray

$rainbow-width: 250px

@mixin shadow-border($size)
box-shadow: 0px 0px 0px $size black

@keyframes slide-right
from
background-position-x: 0px

to
background-position-x: $rainbow-width

body
color: $text-color
font: 16pt Quando
Expand Down Expand Up @@ -49,17 +58,22 @@ a
list-style-type: none
padding: 0
li
margin: 1em
display: inline
margin: 1em
a
@include transition (all 0.25s ease)
border-radius: 0.2em
color: $link-color
padding: 0.2em
text-decoration: none
&:hover
color: $link-hover-color
@include linear-gradient(to right,red,orange,yellow,green,blue,indigo,violet,red)
animation: slide-right 1s linear infinite
background-size: $rainbow-width
color: $white !important
&.highlight
background-color: $link-hover-color
color: white
color: $white
padding: 0.2em
&:hover
background-color: $link-color
Expand Down

0 comments on commit 6d8c21f

Please sign in to comment.