Brendon/gameyfin
1
0
Fork 0
mirror of https://github.com/BrenBroZAYT/gameyfin.git synced 2026-06-16 16:20:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

Changed hover animation for game-covers

Browse Source
This commit is contained in:
grimsi
2022-08-18 22:17:13 +02:00
parent 1fbfeb1c7e
commit 1a7016d2ab
2 changed files with 8 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/app/components/game-cover/game-cover.component.html
+1 -1
View File
@@ -1,5 +1,5 @@
<a routerLink="/game/{{game.slug}}"> <a routerLink="/game/{{game.slug}}">
<div class="game-cover-container shine" [style.background-image]="'url(v1/images/' + game.coverId + ')'" fxLayoutAlign="center end"> <div class="game-cover-container shine enlarge" [style.background-image]="'url(v1/images/' + game.coverId + ')'" fxLayoutAlign="center end">
<h2 *ngIf="game.coverId === 'nocover'" class="no-link-stlying">{{game.title}}</h2> <h2 *ngIf="game.coverId === 'nocover'" class="no-link-stlying">{{game.title}}</h2>
</div> </div>
</a> </a>
frontend/src/app/components/game-cover/game-cover.component.scss
+7 -4
View File
@@ -6,12 +6,15 @@
width: 264px; width: 264px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center bottom; background-position: center bottom;
@include mat.elevation-transition();
@include mat.elevation(4); @include mat.elevation(4);
}
&:hover { .enlarge {
@include mat.elevation(24); transition: transform 280ms ease-out;
&:hover,
&:focus {
transform: scale(1.05);
} }
} }