starnakin/42_ft_transcendence
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add: home: Added cards to select game

Browse Source
This commit is contained in:
Namonay
2024-05-14 22:11:36 +02:00
parent 6a92dd67c1
commit 399c4a3d07
8 changed files with 46 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
django/frontend/static/js/views/HomeView.js
View File

@ -9,9 +9,40 @@ export default class extends AbstractView {
async getHtml() {
return /* HTML */ `
<h1>${lang.get('homeTitle', 'Home')}</h1>
<a href="/matchmaking" data-link>${lang.get('homeOnline')}</a>
<a href="/games/pong/offline" data-link>${lang.get('homePongOffline')}</a>
<a href="/games/tictactoe/offline" data-link>${lang.get('homeTicTacToeOffline')}</a>
<div class="d-flex flex-row" style="justify-content: center">
<div class="row">
<div class="col">
<div class="card" style="width: 25rem;">
<img src="/static/js/imgs/morpion.png" class="card-img-top" alt="Screenshot of Pong">
<div class="card-body">
<h5 class="card-title">${lang.get('homeTicTacToeOffline')}</h5>
<p class="card-text">${lang.get('matchmakingPresentation')}</p>
<a href="/games/tictactoe/offline" class="btn btn-primary">${lang.get('homeTicTacToeOffline')}</a>
</div>
</div>
</div>
<div class="col">
<div class="card" style="width: 25rem;">
<img src="/static/js/imgs/morpong.png" class="card-img-top" alt="Screenshot of Pong">
<div class="card-body">
<h5 class="card-title">${lang.get('homeOnline')}</h5>
<p class="card-text">${lang.get('matchmakingPresentation')}</p>
<a href="/matchmaking" class="btn btn-primary">${lang.get('homeOnline')}</a>
</div>
</div>
</div>
<div class="col">
<div class="card" style="width: 25rem;">
<img src="/static/js/imgs/pongee.png" class="card-img-top" alt="Screenshot of Pong">
<div class="card-body">
<h5 class="card-title">${lang.get('homePongOffline')}</h5>
<p class="card-text">${lang.get('offlinePongPresentation')}</p>
<a href="/games/pong/offline" class="btn btn-primary">${lang.get('homePongOffline')}</a>
</div>
</div>
</div>
</div>
</div>
`;
}
}