88 lines
4.2 KiB
TypeScript
88 lines
4.2 KiB
TypeScript
|
import '../styles/pagination.css'
|
||
|
|
import '../styles/styles.css'
|
||
|
|
import '../styles/search.css'
|
||
|
|
import { GameCard } from '../components/GameCard'
|
||
|
|
|
||
|
|
export const GamesPage = () => {
|
||
|
|
return (
|
||
|
|
<div className='InnerBodyMain'>
|
||
|
|
<div className='ContainerMain'>
|
||
|
|
<div className='IBMSecMainGroup IBMSecMainGroupAlt'>
|
||
|
|
<div className='IBMSecMain'>
|
||
|
|
<div className='SearchMainWrapper'>
|
||
|
|
<div className='IBMSMTitleMain'>
|
||
|
|
<h2 className='IBMSMTitleMainHeading'>Games</h2>
|
||
|
|
</div>
|
||
|
|
<div className='SearchMain'>
|
||
|
|
<div className='SearchMainInside'>
|
||
|
|
<div className='SearchMainInsideWrapper'>
|
||
|
|
<input type='text' className='SMIWInput' />
|
||
|
|
<button className='btn btnMain SMIWButton' type='button'>
|
||
|
|
<svg
|
||
|
|
xmlns='http://www.w3.org/2000/svg'
|
||
|
|
viewBox='0 0 512 512'
|
||
|
|
width='1em'
|
||
|
|
height='1em'
|
||
|
|
fill='currentColor'
|
||
|
|
>
|
||
|
|
<path d='M500.3 443.7l-119.7-119.7c27.22-40.41 40.65-90.9 33.46-144.7C401.8 87.79 326.8 13.32 235.2 1.723C99.01-15.51-15.51 99.01 1.724 235.2c11.6 91.64 86.08 166.7 177.6 178.9c53.8 7.189 104.3-6.236 144.7-33.46l119.7 119.7c15.62 15.62 40.95 15.62 56.57 0C515.9 484.7 515.9 459.3 500.3 443.7zM79.1 208c0-70.58 57.42-128 128-128s128 57.42 128 128c0 70.58-57.42 128-128 128S79.1 278.6 79.1 208z'></path>
|
||
|
|
</svg>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div className='IBMSecMain IBMSMListWrapper'>
|
||
|
|
<div className='IBMSMList IBMSMListFeaturedAlt'>
|
||
|
|
<GameCard backgroundLink='https://m.media-amazon.com/images/M/MV5BZTRiNTgxMjQtNDE3OS00YTg4LTg3NTItY2EyNGUzYjAzZGZmXkEyXkFqcGdeQXVyMTI0MzI0MzE4._V1_FMjpg_UX1000_.jpg' />
|
||
|
|
<GameCard backgroundLink='https://upload.wikimedia.org/wikipedia/en/0/0c/Witcher_3_cover_art.jpg' />
|
||
|
|
<GameCard backgroundLink='https://cdn2.steamgriddb.com/file/sgdb-cdn/grid/9153bb77795515274c2be61ccc59c952.jpg' />
|
||
|
|
<GameCard backgroundLink='https://static.trueachievements.com/boxart/Game_12493.jpg' />
|
||
|
|
<GameCard backgroundLink='/assets/img/DEGMods%20Placeholder%20Img.png' />
|
||
|
|
<GameCard backgroundLink='/assets/img/DEGMods%20Placeholder%20Img.png' />
|
||
|
|
<GameCard backgroundLink='/assets/img/DEGMods%20Placeholder%20Img.png' />
|
||
|
|
<GameCard backgroundLink='/assets/img/DEGMods%20Placeholder%20Img.png' />
|
||
|
|
<GameCard backgroundLink='/assets/img/DEGMods%20Placeholder%20Img.png' />
|
||
|
|
<GameCard backgroundLink='/assets/img/DEGMods%20Placeholder%20Img.png' />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div className='IBMSecMain'>
|
||
|
|
<div className='PaginationMain'>
|
||
|
|
<div className='PaginationMainInside'>
|
||
|
|
<a
|
||
|
|
className='PaginationMainInsideBox PaginationMainInsideBoxArrows'
|
||
|
|
href='#'
|
||
|
|
>
|
||
|
|
<i className='fas fa-chevron-left'></i>
|
||
|
|
</a>
|
||
|
|
<div className='PaginationMainInsideBoxGroup'>
|
||
|
|
<a className='PaginationMainInsideBox PMIBActive' href='#'>
|
||
|
|
<p>1</p>{' '}
|
||
|
|
</a>
|
||
|
|
<a className='PaginationMainInsideBox' href='#'>
|
||
|
|
<p>2</p>{' '}
|
||
|
|
</a>
|
||
|
|
<a className='PaginationMainInsideBox' href='#'>
|
||
|
|
<p>3</p>
|
||
|
|
</a>
|
||
|
|
<p className='PaginationMainInsideBox PMIBDots'>...</p>
|
||
|
|
<a className='PaginationMainInsideBox' href='#'>
|
||
|
|
<p>8</p>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
<a
|
||
|
|
className='PaginationMainInsideBox PaginationMainInsideBoxArrows'
|
||
|
|
href='#'
|
||
|
|
>
|
||
|
|
<i className='fas fa-chevron-right'></i>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|