mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2025-03-14 04:08:32 +03:00
Code Issues Projects Releases Packages Wiki Activity

Bring the image position magic to the banner too

Browse source
This commit is contained in:
Lim Chee Aun 2023-03-10 19:00:48 +08:00
parent 4f41cc0f27
commit 81943365c3
3 changed files with 19 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/components/account.css
View file

@ -3,7 +3,7 @@
}
#account-container .header-banner {
pointer-events: none;
/* pointer-events: none; */
aspect-ratio: 6 / 1;
width: 100%;
height: auto;
@ -30,6 +30,9 @@
);
margin-bottom: -44px;
}
#account-container .header-banner:hover {
animation: position-object 5s ease-in-out 1s 5;
}
@media (min-height: 480px) {
#account-container .header-banner {

14
src/components/status.css
View file

@ -426,20 +426,6 @@
.status .media {
cursor: pointer;
}
@keyframes position-object {
0% {
object-position: 50% 50%;
}
25% {
object-position: 0% 0%;
}
75% {
object-position: 100% 100%;
}
100% {
object-position: 50% 50%;
}
}
.status .media img:is(:hover, :focus),
a:focus-visible .status .media img {
animation: position-object 5s ease-in-out 1s 5;

15
src/index.css
View file

@ -354,3 +354,18 @@ code {
transform: translateY(0);
}
}
@keyframes position-object {
0% {
object-position: 50% 50%;
}
25% {
object-position: 0% 0%;
}
75% {
object-position: 100% 100%;
}
100% {
object-position: 50% 50%;
}
}