mirror of
https://github.com/seigler/bl3skills.com
synced 2025-07-27 01:36:12 +00:00
61 lines
1.2 KiB
CSS
61 lines
1.2 KiB
CSS
.footer {
|
|
align-self: stretch;
|
|
font-family: var(--font-header);
|
|
justify-content: center;
|
|
align-items: center;
|
|
display: flex;
|
|
line-height: 2;
|
|
background-image: linear-gradient(
|
|
to top,
|
|
hsla(0, 0%, 0%, 0.5) 0%,
|
|
hsla(0, 0%, 0%, 0.494) 8.1%,
|
|
hsla(0, 0%, 0%, 0.476) 15.5%,
|
|
hsla(0, 0%, 0%, 0.448) 22.5%,
|
|
hsla(0, 0%, 0%, 0.412) 29%,
|
|
hsla(0, 0%, 0%, 0.37) 35.3%,
|
|
hsla(0, 0%, 0%, 0.324) 41.2%,
|
|
hsla(0, 0%, 0%, 0.275) 47.1%,
|
|
hsla(0, 0%, 0%, 0.225) 52.9%,
|
|
hsla(0, 0%, 0%, 0.176) 58.8%,
|
|
hsla(0, 0%, 0%, 0.13) 64.7%,
|
|
hsla(0, 0%, 0%, 0.088) 71%,
|
|
hsla(0, 0%, 0%, 0.052) 77.5%,
|
|
hsla(0, 0%, 0%, 0.024) 84.5%,
|
|
hsla(0, 0%, 0%, 0.006) 91.9%,
|
|
hsla(0, 0%, 0%, 0) 100%
|
|
);
|
|
}
|
|
|
|
.footer span a {
|
|
color: inherit;
|
|
transition: color var(--transition-duration);
|
|
}
|
|
|
|
.footer a:hover {
|
|
color: #E2264D;
|
|
}
|
|
|
|
.heart {
|
|
width: 2em;
|
|
height: 2em;
|
|
background: transparent url(@assets/twitter_heart.png) no-repeat;
|
|
background-size: 2900%;
|
|
margin: 0 -0.4em;
|
|
}
|
|
|
|
.heart:hover {
|
|
background-position: right;
|
|
animation: moveHeart 800ms steps(28) forwards;
|
|
}
|
|
|
|
@keyframes moveHeart {
|
|
0% {
|
|
background-position: left;
|
|
}
|
|
50% {
|
|
background-position: right;
|
|
}
|
|
100% {
|
|
background-position: right;
|
|
}
|
|
}
|