Mise au propre de toutes les cartes et création de tous les templates

This commit is contained in:
2023-10-30 14:55:08 +01:00
parent f5b5d79951
commit 7afca19452
4 changed files with 136 additions and 46 deletions

View File

@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="fr">
<html lang="fr" data-bs-theme="dark">
<head>
<meta charset="utf-8">
<title> Matchs en direct </title>
@@ -7,6 +7,8 @@
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"rel="stylesheet">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<!--- Ajout d'un fichier css pour les classes personalisé --->
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header>
@@ -50,47 +52,35 @@
<div class="container">
<div class="col-8 offset-2">
<div class="col-8 offset-2 mt-6">
<div class="card my-1">
<div class="card-header">
Featured
<div class="card-header text-center bg-light-subtle text-emphasis-light">
Date and time
</div>
<div class="card-body">
<h5 class="card-title">Special title treatment</h5>
<h6 class="card-subtitle">Special title treatment</h6>
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
<div class="card-footer">
Card footer
<div class="card-body bg-light-subtle text-emphasis-light">
<h5 class="card-title text-center">Promo X VS Promo Y</h5>
<h6 class="card-subtitle text-center">Type de matchs (quarts de final)</h6>
<p class="card-text text-center">Sport</p>
</div>
</div>
<div class="card my-1">
<div class="card-header">
Featured
<div class="card-header text-center bg-light-subtle text-emphasis-light">
Date and time
</div>
<div class="card-body">
<h5 class="card-title">Special title treatment</h5>
<h6 class="card-subtitle">Special title treatment</h6>
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
<div class="card-footer">
Card footer
<div class="card-body bg-light-subtle text-emphasis-light">
<h5 class="card-title text-center">Promo X VS Promo Y</h5>
<h6 class="card-subtitle text-center">Type de matchs (quarts de final)</h6>
<p class="card-text text-center">Sport</p>
</div>
</div>
<div class="card my-1">
<div class="card-header">
Featured
<div class="card-header text-center bg-light-subtle text-emphasis-light">
Date and time
</div>
<div class="card-body">
<h5 class="card-title">Special title treatment</h5>
<h6 class="card-subtitle">Special title treatment</h6>
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
<div class="card-footer">
Card footer
<div class="card-body bg-light-subtle text-emphasis-light">
<h5 class="card-title text-center">Promo X VS Promo Y</h5>
<h6 class="card-subtitle text-center">Type de matchs (quarts de final)</h6>
<p class="card-text text-center">Sport</p>
</div>
</div>
</div>

View File

@@ -1,16 +1,18 @@
<!DOCTYPE html>
<html lang="fr">
<html lang="fr" data-bs-theme="dark">
<head>
<meta charset="utf-8">
<title> Matchs en direct </title>
<title> Liste des Sports </title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"rel="stylesheet">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<!--- Ajout d'un fichier css pour les classes personalisé --->
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header>
<nav class="navbar navbar-dark bg-dark">
<nav class="navbar navbar-dark bg-dark fixed-top">
<div class="container-fluid">
<a class="navbar-brand" href="index.html">
<img src="/Front/assets/appen.png" alt="Logo" width="30" height="30" class="d-inline-block align-text-top">
@@ -49,10 +51,59 @@
</header>
<div class="container">
<!-- WRITE CODE HERE -->
<div class="container mt-6">
<div class="col-8 offset-2">
<div class="card my-1">
<div class="card-header text-center bg-light-subtle text-emphasis-light">
BASKETBALL
</div>
<div class="card-body bg-light-subtle text-emphasis-light">
<h5 class="card-title">En tête: Promo X</h5>
<p class="card-text">Quarts de finale</p>
</div>
<div class="card-footer bg-light-subtle text-emphasis-light">06/11 21:00 Promo X VS Promo Y</div>
</div>
<div class="card my-1">
<div class="card-header text-center bg-light-subtle text-emphasis-light">
HANDBALL
</div>
<div class="card-body bg-light-subtle text-emphasis-light">
<h5 class="card-title">En tête: Promo Y</h5>
<p class="card-text">Quarts de finale</p>
</div>
<div class="card-footer bg-light-subtle text-emphasis-light">06/11 21:00 Promo X VS Promo Y</div>
</div>
<div class="card my-1">
<div class="card-header text-center bg-light-subtle text-emphasis-light">
FOOTBALL
</div>
<div class="card-body bg-light-subtle text-emphasis-light">
<h5 class="card-title">En tête: Promo Z</h5>
<p class="card-text">Quarts de finale</p>
</div>
<div class="card-footer bg-light-subtle text-emphasis-light">06/11 21:00 Promo X VS Promo Y</div>
</div>
<div class="card my-1">
<div class="card-header text-center bg-light-subtle text-emphasis-light">
VOLLEY
</div>
<div class="card-body bg-light-subtle text-emphasis-light">
<h5 class="card-title">En tête: Promo Z</h5>
<p class="card-text">Quarts de finale</p>
</div>
<div class="card-footer bg-light-subtle text-emphasis-light">06/11 21:00 Promo X VS Promo Y</div>
</div>
<div class="card my-1">
<div class="card-header text-center bg-light-subtle text-emphasis-light">
BADMINTON
</div>
<div class="card-body bg-light-subtle text-emphasis-light">
<h5 class="card-title">En tête: Promo Z</h5>
<p class="card-text">Tournoi</p>
</div>
<div class="card-footer bg-light-subtle text-emphasis-light">06/11 21:00 Promo X VS Promo Y</div>
</div>
</div>
</div>

3
Front/style.css Normal file
View File

@@ -0,0 +1,3 @@
.mt-6 {
margin-top: 6rem !important;
}

View File

@@ -1,16 +1,18 @@
<!DOCTYPE html>
<html lang="fr">
<html lang="fr" data-bs-theme="dark">
<head>
<meta charset="utf-8">
<title> Matchs en direct </title>
<title> Classement et équipes </title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"rel="stylesheet">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<!--- Ajout d'un fichier css pour les classes personalisé --->
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header>
<nav class="navbar navbar-dark bg-dark">
<nav class="navbar navbar-dark bg-dark fixed-top">
<div class="container-fluid">
<a class="navbar-brand" href="index.html">
<img src="/Front/assets/appen.png" alt="Logo" width="30" height="30" class="d-inline-block align-text-top">
@@ -49,10 +51,54 @@
</header>
<div class="container">
<!-- WRITE CODE HERE -->
<div class="container mt-6">
<div class="col-8 offset-2">
<div class="card my-1">
<div class="card-header text-center bg-light-subtle text-emphasis-light">
Promo X
</div>
<div class="card-body bg-light-subtle text-emphasis-light">
<h5 class="card-title">Classement Provisoire : 1er</h5>
<p class="card-text">Football: phases de poule
Basketball: demi-finale
Volley: phase de poule (éliminé)
Handball: quarts de final (en jeu)
Badminton: tournoi (3e)
</p>
</div>
<div class="card-footer bg-light-subtle text-emphasis-light">Prochain match: Football à 21:00</div>
</div>
<div class="card my-1">
<div class="card-header text-center bg-light-subtle text-emphasis-light">
Promo Y
</div>
<div class="card-body bg-light-subtle text-emphasis-light">
<h5 class="card-title">Classement Provisoire : 2e</h5>
<p class="card-text">Football: phases de poule
Basketball: demi-finale
Volley: phase de poule (éliminé)
Handball: quarts de final (en jeu)
Badminton: tournoi (3e)
</p>
</div>
<div class="card-footer bg-light-subtle text-emphasis-light">Prochain match: Football à 21:00</div>
</div>
<div class="card my-1">
<div class="card-header text-center bg-light-subtle text-emphasis-light">
Promo Z
</div>
<div class="card-body bg-light-subtle text-emphasis-light">
<h5 class="card-title">Classement Provisoire : 3e</h5>
<p class="card-text">Football: phases de poule
Basketball: demi-finale
Volley: phase de poule (éliminé)
Handball: quarts de final (en jeu)
Badminton: tournoi (3e)
</p>
</div>
<div class="card-footer bg-light-subtle text-emphasis-light">Prochain match: Football à 21:00</div>
</div>
</div>
</div>