1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
|
underline-motion(n)
if n == 'link'
background-image linear-gradient($color-background, $color-background), linear-gradient($color-accent, $color-accent)
background-size 100% $line-third, 0% $line-third
background-position 100% 100%, 0 100%
background-repeat no-repeat, no-repeat
transition background-size $transition-duration ease
&:hover
background-size 0 $line-third, 100% $line-third
else if n == 'underline-link'
padding-bottom $line-secondary
background-image linear-gradient($color-text-primary, $color-text-primary), linear-gradient($color-accent, $color-accent)
background-size 100% $line-third, 0 $line-secondary
background-position 100% 100%, 0 100%
background-repeat no-repeat, no-repeat
transition background-size $transition-duration ease
&:hover
background-size 100% $line-third, 100% $line-secondary
else if n == 'header'
&:after
content ""
transition width $transition-duration ease
position absolute
left 0
bottom 0
width 0
border-bottom solid $line-third $color-accent
&:hover:after
width 100%
|
