alina/lastfuture-de
1
0
Fork 0
Code Issues Projects Releases Activity

animated icons

Browse Source
This commit is contained in:
Alina Marquardt
2023-03-06 19:49:12 +00:00
parent 587a528870
commit 24837f01a2
4 changed files with 38 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
css/main.css
View File

@@ -50,11 +50,11 @@ h1::before, #logo span::before {
position: relative;
vertical-align: -6px;
margin: 0 6px;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAALQAAAAeCAMAAACylMSIAAAACVBMVEX///8AAAD///9+749PAAAAAnRSTlMAf7YpoZUAAAC3SURBVHja7ZbRCoQwDATd/v9HHxQM4SYJxYNehcyDD013O4qI107G5Peelt4sPRz1toX4w35GsoaW/pe0pKI3PHWAbKqJH7X066QL70LLgn5KXQbXpXXT0rulQVbEW7IiZkeCBeuzsufV0sdKs46v76K0927pl0ozY1oe3TAl6evKDeufvJY+TZrrJJwGxhMY4wis2HpLnyYtyQ54/KvNcits6cOlBcINV06RIjYNd4Yrklp6u/QHWCYPKBXAoUwAAAAASUVORK5CYII=");
background-image: url(../images/lf-sprites.png);
width: 30px;
height: 30px;
background-size: 180px 30px;
background-position: 30px 0;
background-size: 360px 180px;
background-position: 0px 150px;
}
article {
@@ -103,7 +103,7 @@ article pre {
padding: 0px;
}
#article1 h1::before {
background-position: 120px 0;
background-position: 0px 120px;
}
#article1 .content {
overflow-y: scroll;
@@ -116,7 +116,7 @@ article pre {
width: calc(100% - 460px);
}
#article2 h1::before {
background-position: 150px 0;
background-position: 0px 150px;
}
#article3 {
@@ -126,7 +126,7 @@ article pre {
width: calc(100% - 600px);
}
#article3 h1::before {
background-position: 60px 0;
background-position: 0px 60px;
}
#article4 {
@@ -137,7 +137,7 @@ article pre {
width: calc(100% - 600px);
}
#article4 h1::before {
background-position: 90px 0;
background-position: 0px 90px;
}
#logo {
@@ -176,4 +176,16 @@ article pre {
background-position: 0px 0;
}
@keyframes animatedIcon {
0% {
background-position-x: 360px;
}
100% {
background-position-x: 0px;
}
}
article h1:hover::before, #logo span:hover::before {
animation: animatedIcon 0.8s steps(12, end) infinite;
}
/*# sourceMappingURL=main.css.map */