external/hydra
1
0
Fork 0
mirror of https://github.com/hydralauncher/hydra.git synced 2025-03-09 15:40:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add keys to lists on galler-slider
Some checks are pending
Build / build (ubuntu-latest) (push) Waiting to run
Details
Build / build (windows-latest) (push) Waiting to run
Details
Lint / lint (push) Waiting to run
Details

Browse source
This commit is contained in:
Zamitto 2024-05-11 23:04:53 -03:00
parent 86eb76ccad
commit ae1e2f1f30
1 changed files with 6 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/renderer/src/pages/game-details/gallery-slider.tsx
View file

@ -63,8 +63,9 @@ export function GallerySlider({ gameDetails }: GallerySliderProps) {
className={styles.gallerySliderAnimationContainer} className={styles.gallerySliderAnimationContainer}
> >
{gameDetails.movies && {gameDetails.movies &&
gameDetails.movies.map((video: SteamMovies) => ( gameDetails.movies.map((video: SteamMovies, i: number) => (
<video <video
key={"video-" + i}
controls controls
className={styles.gallerySliderMedia} className={styles.gallerySliderMedia}
poster={video.thumbnail} poster={video.thumbnail}
@ -74,8 +75,9 @@ export function GallerySlider({ gameDetails }: GallerySliderProps) {
</video> </video>
))} ))}
{gameDetails.screenshots && {gameDetails.screenshots &&
gameDetails.screenshots.map((image: SteamScreenshot) => ( gameDetails.screenshots.map((image: SteamScreenshot, i: number) => (
<img <img
key={"image-" + i}
className={styles.gallerySliderMedia} className={styles.gallerySliderMedia}
src={image.path_full} src={image.path_full}
style={{ translate: `${-100 * mediaIndex}%` }} style={{ translate: `${-100 * mediaIndex}%` }}
@ -105,6 +107,7 @@ export function GallerySlider({ gameDetails }: GallerySliderProps) {
{gameDetails.movies && {gameDetails.movies &&
gameDetails.movies.map((video: SteamMovies, i: number) => ( gameDetails.movies.map((video: SteamMovies, i: number) => (
<img <img
key={"video-thumb-" + i}
onClick={() => setMediaIndex(i)} onClick={() => setMediaIndex(i)}
src={video.thumbnail} src={video.thumbnail}
className={`${styles.gallerySliderMediaPreview} ${mediaIndex === i ? styles.gallerySliderMediaPreviewActive : ""}`} className={`${styles.gallerySliderMediaPreview} ${mediaIndex === i ? styles.gallerySliderMediaPreviewActive : ""}`}
@ -114,6 +117,7 @@ export function GallerySlider({ gameDetails }: GallerySliderProps) {
gameDetails.screenshots.map( gameDetails.screenshots.map(
(image: SteamScreenshot, i: number) => ( (image: SteamScreenshot, i: number) => (
<img <img
key={"image-thumb-" + i}
onClick={() => onClick={() =>
setMediaIndex( setMediaIndex(
i + (gameDetails.movies ? gameDetails.movies.length : 0) i + (gameDetails.movies ? gameDetails.movies.length : 0)