ajout fichier css + php, fusion - correction beug php

This commit is contained in:
James BOUTARIC 2024-06-04 15:00:24 +02:00
parent e1831b92e8
commit ee261d214e
27 changed files with 240 additions and 430 deletions

View File

@ -23,7 +23,7 @@ defined('BASEPATH') OR exit('No direct script access allowed');
| a PHP script and you can easily do that on your own.
|
*/
$config['base_url'] = '/~brigitte/SAEWEB2.2/ci/';
$config['base_url'] = '/~boutaric/SAEWEB2.2/ci/';
/*
|--------------------------------------------------------------------------

View File

@ -22,7 +22,7 @@ $config['migration_enabled'] = FALSE;
| a timestamp. Options are:
|
| 'sequential' = Sequential migration naming (001_add_blog.php)
| 'timestamp' = Timestamp migration naming (20121031104401_add_blog.php)
| 'timestamp' = Timestamp migration naming arabe (20121031104401_add_blog.php)
| Use timestamp format YYYYMMDDHHIISS.
|
| Note: If this configuration value is missing the Migration library

View File

@ -10,9 +10,9 @@ class Albums extends CI_Controller {
public function index(){
$albums = $this->model_music->getAlbums();
$this->load->view('layout/header_album');
$this->load->view('layout/header');
$this->load->view('albums_list', ['albums' => $albums]);
$this->load->view('layout/footer_album');
$this->load->view('layout/footer');
}
public function view($album_id){
@ -23,9 +23,9 @@ class Albums extends CI_Controller {
log_message('debug', 'Songs: ' . print_r($songs, true));
$this->load->view('layout/header_album');
$this->load->view('layout/header');
$this->load->view('song_album_list', ['songs' => $songs]);
$this->load->view('layout/footer_album');
$this->load->view('layout/footer');
}
}
?>

View File

@ -9,16 +9,16 @@ class artistes extends CI_Controller {
}
public function index(){
$artistes = $this->model_music->getArtists();
$this->load->view('layout/header_artistes');
$this->load->view('layout/header');
$this->load->view('artistes_list',['artistes'=>$artistes]);
$this->load->view('layout/footer_artistes');
$this->load->view('layout/footer');
}
public function view($AlbumsOfArtistId){
$AlbumsOfArtist = $this->model_music->getAlbumsOfArtist($AlbumsOfArtistId);
$this->load->view('layout/header_artistes');
$this->load->view('albums_artist_list',['AlbumsOfArtist'=>$AlbumsOfArtist]);
$this->load->view('layout/footer_artistes');
$AlbumsOfArtists = $this->model_music->getAlbumsOfArtist($AlbumsOfArtistId);
$this->load->view('layout/header');
$this->load->view('albums_artist_list',['AlbumsOfArtists'=>$AlbumsOfArtists]);
$this->load->view('layout/footer');
}
}

View File

@ -10,8 +10,8 @@ class Song extends CI_Controller {
public function view($album_id){
$songs = $this->model_music->getSongOfAlbum($album_id);
$this->load->view('layout/header_song');
$this->load->view('layout/header');
$this->load->view('song_album_list',['songs'=>$songs]);
$this->load->view('layout/footer_song');
$this->load->view('layout/footer');
}
}

View File

@ -8,8 +8,7 @@ class welcome extends CI_Controller {
$this->load->model('model_music');
}
public function index(){
$this->load->view('layout/header');
$this->load->view('layout/footer');
$this->load->view('Welcome');
}
}

View File

@ -0,0 +1,108 @@
<!doctype html>
<html lang="en" class="has-navbar-fixed-top">
<head>
<meta charset="UTF-8" />
<title>SpotiFly</title>
<link rel="stylesheet" href="<?= base_url('assets/style.css') ?>">
</head>
<body>
<main class='container'>
<header class="navbar">
<div class="logo">
<img src="assets/img/Logo1.png" alt="SpotiFly">
</div>
<nav class="menu">
<ul>
<li><?= anchor('https://dwarves.iut-fbleau.fr/~boutaric/SAEWEB2.2/ci/','Home'); ?></li>
<li><?= anchor('albums','Albums'); ?></li>
<li><?= anchor('artistes','Artistes'); ?></li>
<li><?= anchor('playlist','Playlist'); ?></li>
</ul>
</nav>
<div class="user">
<a class="bouton" href="html/Connexion.html">Connexion</a>
<a class="bouton" href="html/Inscription.html">S'inscrire</a>
</div>
</header>
<div id="Page">
<div class="content">
<img src="assets/img/logo_page.png" alt="SpotiFly">
<div class="text-page">
<h2>SpotiFly : envole-toi au rythme de la musique !</h2>
</div>
</div>
</div>
<div id="header"> </div>
<div class="content">
<section id="about" class="box">
<div class="box-content">
<img src="assets/img/argent.png" alt="Description de l'image 2">
<div class="text-content">
<h2>1 mois gratuit?</h2>
<p>"Découvrez une expérience musicale sans limites avec notre offre exclusive : abonnez-vous dès aujourd'hui et bénéficiez d'un mois complet GRATUIT pour explorer notre vaste catalogue de musique. Plongez dans un univers de sonorités variées et profitez d'un accès illimité à vos artistes préférés, sans engagement ! Rejoignez-nous dès maintenant pour un mois d'exploration musicale sans pareil."</p>
</div>
</div>
</section>
<section id="product" class="box">
<div class="box-img">
<img src="assets/img/argent.png" alt="Description de l'image 3">
<div class="text-content">
<h2>La Cognition</h2>
<p>Découvrez notre nouveaux cube v3 qui peut avoir la voix de votre choix.</p>
<p>Plongez dans une réalité la cognition rencontre la technologie. Notre cube connecté va au-delà de l'ordinaire, réagissant à votre pensée et intégrant la puissance de la cognition pour une expérience holographique incomparable.</p>
</div>
</div>
</section>
<section id="sale" class="box">
<div class="box-content">
<img src="assets/img/Statistique.png" alt="Description de l'image 4">
<div class="text-content">
<h2>Statistiques</h2>
<p>"Découvrez les statistiques de notre application de musique : des millions d'utilisateurs s'immergent dans une expérience audio immersive, créant des milliers de playlists et explorant une multitude de genres musicaux, tout en bénéficiant d'un mois gratuit dès l'abonnement !"</p>
</div>
</div>
</section>
</div>
<footer class="footer">
<div class="footer-content">
<div class="footer-section">
<h3>Mentions légales</h3>
<a href="html/mention_legal.html">Consulter nos mentions légales</a> <br>
<a href="Charte_graphique.pdf" target="_blank">Consulter notre chartre graphique</a>
</div>
<div class="footer-section">
<h3>Plan du site</h3>
<a href="html/plan.html">Consulter le plan du site</a>
</div>
<div class="footer-section">
<h3>Contact</h3>
<p>Email : <a href="mailto:contact.Spotifly@gmail.com">contact.SpotiFly@gmail.com</a></p>
<p>
</div>
<div class="footer-section-reseaux">
<h3>Réseaux sociaux</h3>
<div class="logo-reseaux">
<p>
<a href="https://www.instagram.com/" target="_blank" class="social-icon">
<img src="assets/img/Instagram.png" alt="Logo Instagram">
</a>
</p>
<p>
<a href="https://www.X.com/" target="_blank" class="social-icon">
<img src="assets/img/twitter.png" alt="Logo X">
</a>
</p>
</div>
</div>
</div>
<div class="footer-logo">
<img src="assets/img/SpotiFly.png" alt="SpotiFly Logo">
<p>&copy; 2024 SpotiFly.</p>
</div>
</footer>
<script src="assets/bouton.js"></script>
<button id="scrollTopBtn" onclick="scrollToTop()">
<span>&#8593;</span>
</button>
</body>
</html>

View File

@ -1,15 +1,16 @@
<h5>Albums of the artist</h5>
<section class="list">
<?php
foreach($AlbumsOfArtist as $AlbumOfArtists){
echo "<div><article>";
echo "<header class='short-text'>";
echo anchor("albums/view/{$AlbumOfArtists->id}","{$AlbumOfArtists->name}");
echo "<br>";
echo "</header>";
echo "</article></div>";
}
?>
</section>
<h5>Liste des albums</h5>
<section class="container">
<?php
foreach ($AlbumsOfArtists as $AlbumsOfArtist) {
echo "<div class='album'><article>";
echo "<header class='album-title'>";
echo anchor("albums/view/{$AlbumsOfArtist->id}", "{$AlbumsOfArtist->name}");
echo "<br>";
echo "</header>";
echo '<img src="data:image/jpeg;base64,' . base64_encode($AlbumsOfArtist->jpeg) . '" alt="' . $AlbumsOfArtist->name . '" />';
echo "<footer class='short-text'>$AlbumsOfArtist->year</footer>";
echo "</article></div>";
}
?>
</section>

View File

@ -1,5 +1,5 @@
<h5>Artists list</h5>
<section class="list">
<section class="artiste">
<?php
foreach($artistes as $artiste){
//echo "<div><article>";

View File

@ -27,19 +27,19 @@
<div class="logo-reseaux">
<p>
<a href="https://www.instagram.com/" target="_blank" class="social-icon">
<img src="img/Instagram.png" alt="Logo Instagram">
<img src="../assets/img/Instagram.png" alt="Logo Instagram">
</a>
</p>
<p>
<a href="https://www.X.com/" target="_blank" class="social-icon">
<img src="img/twitter.png" alt="Logo X">
<img src="../assets/img/twitter.png" alt="Logo X">
</a>
</p>
</div>
</div>
</div>
<div class="footer-logo">
<img src="img/logo_blanc.png" alt="SpotiFly Logo">
<img src="../assets/img/SpotiFly.png" alt="SpotiFly Logo">
<p>&copy; 2024 SpotiFly.</p>
</div>
</footer>

View File

@ -1,47 +0,0 @@
<!doctype html>
<html lang="en" class="has-navbar-fixed-top">
<head>
<meta charset="UTF-8" />
<title>MUSIC APP</title>
<link rel="stylesheet" href="<?= base_url('assets/style.css') ?>">
</head>
<body>
<footer class="footer">
<div class="footer-content">
<div class="footer-section">
<h3>Mentions légales</h3>
<a href="html/mention_legal.html">Consulter nos mentions légales</a> <br>
<a href="Charte_graphique.pdf" target="_blank">Consulter notre chartre graphique</a>
</div>
<div class="footer-section">
<h3>Plan du site</h3>
<a href="html/plan.html">Consulter le plan du site</a>
</div>
<div class="footer-section">
<h3>Contact</h3>
<p>Email : <a href="mailto:contact.Spotifly@gmail.com">contact.SpotiFly@gmail.com</a></p>
<p>
</div>
<div class="footer-section-reseaux">
<h3>Réseaux sociaux</h3>
<div class="logo-reseaux">
<p>
<a href="https://www.instagram.com/" target="_blank" class="social-icon">
<img src="img/Instagram.png" alt="Logo Instagram">
</a>
</p>
<p>
<a href="https://www.X.com/" target="_blank" class="social-icon">
<img src="img/twitter.png" alt="Logo X">
</a>
</p>
</div>
</div>
</div>
<div class="footer-logo">
<img src="img/logo_blanc.png" alt="SpotiFly Logo">
<p>&copy; 2024 SpotiFly.</p>
</div>
</footer>
</body>
</html>

View File

@ -1,47 +0,0 @@
<!doctype html>
<html lang="en" class="has-navbar-fixed-top">
<head>
<meta charset="UTF-8" />
<title>MUSIC APP</title>
<link rel="stylesheet" href="<?= base_url('assets/style.css') ?>">
</head>
<body>
<footer class="footer">
<div class="footer-content">
<div class="footer-section">
<h3>Mentions légales</h3>
<a href="html/mention_legal.html">Consulter nos mentions légales</a> <br>
<a href="Charte_graphique.pdf" target="_blank">Consulter notre chartre graphique</a>
</div>
<div class="footer-section">
<h3>Plan du site</h3>
<a href="html/plan.html">Consulter le plan du site</a>
</div>
<div class="footer-section">
<h3>Contact</h3>
<p>Email : <a href="mailto:contact.Spotifly@gmail.com">contact.SpotiFly@gmail.com</a></p>
<p>
</div>
<div class="footer-section-reseaux">
<h3>Réseaux sociaux</h3>
<div class="logo-reseaux">
<p>
<a href="https://www.instagram.com/" target="_blank" class="social-icon">
<img src="img/Instagram.png" alt="Logo Instagram">
</a>
</p>
<p>
<a href="https://www.X.com/" target="_blank" class="social-icon">
<img src="img/twitter.png" alt="Logo X">
</a>
</p>
</div>
</div>
</div>
<div class="footer-logo">
<img src="img/logo_blanc.png" alt="SpotiFly Logo">
<p>&copy; 2024 SpotiFly.</p>
</div>
</footer>
</body>
</html>

View File

@ -1,47 +0,0 @@
<!doctype html>
<html lang="en" class="has-navbar-fixed-top">
<head>
<meta charset="UTF-8" />
<title>MUSIC APP</title>
<link rel="stylesheet" href="<?= base_url('assets/style.css') ?>">
</head>
<body>
<footer class="footer">
<div class="footer-content">
<div class="footer-section">
<h3>Mentions légales</h3>
<a href="html/mention_legal.html">Consulter nos mentions légales</a> <br>
<a href="Charte_graphique.pdf" target="_blank">Consulter notre chartre graphique</a>
</div>
<div class="footer-section">
<h3>Plan du site</h3>
<a href="html/plan.html">Consulter le plan du site</a>
</div>
<div class="footer-section">
<h3>Contact</h3>
<p>Email : <a href="mailto:contact.Spotifly@gmail.com">contact.SpotiFly@gmail.com</a></p>
<p>
</div>
<div class="footer-section-reseaux">
<h3>Réseaux sociaux</h3>
<div class="logo-reseaux">
<p>
<a href="https://www.instagram.com/" target="_blank" class="social-icon">
<img src="img/Instagram.png" alt="Logo Instagram">
</a>
</p>
<p>
<a href="https://www.X.com/" target="_blank" class="social-icon">
<img src="img/twitter.png" alt="Logo X">
</a>
</p>
</div>
</div>
</div>
<div class="footer-logo">
<img src="img/logo_blanc.png" alt="SpotiFly Logo">
<p>&copy; 2024 SpotiFly.</p>
</div>
</footer>
</body>
</html>

View File

@ -1,15 +1,18 @@
<!doctype html>
<html lang="en" class="has-navbar-fixed-top">
<html lang="fr" class="has-navbar-fixed-top">
<head>
<meta charset="UTF-8" />
<title>SpotiFly</title>
<link rel="stylesheet" href="<?= base_url('assets/style.css') ?>">
<link rel="stylesheet" href="<?= base_url('assets/song.css') ?>">
<link rel="stylesheet" href="<?= base_url('assets/artiste.css') ?>">
<link rel="stylesheet" href="<?= base_url('assets/album.css') ?>">
</head>
<body>
<main class='container'>
<main class='contain'>
<header class="navbar">
<div class="logo">
<img src="assets/img/SpotiFly.png" alt="SpotiFly">
<img src="../assets/img/Logo1.png" alt="SpotiFly">
</div>
<nav class="menu">
<ul>
@ -22,50 +25,12 @@
<div class="user">
<a class="bouton" href="html/Connexion.html">Connexion</a>
<a class="bouton" href="html/Inscription.html">S'inscrire</a>
</div>
</header>
<div id="Page">
<div class="content">
<img src="assets/img/SpotiFly.png" alt="SpotiFly">
<div class="text-page">
<h2>SpotiFly : envole-toi au rythme de la musique !</h2>
</div>
</div>
</div>
<div id="header"> </div>
<div class="content">
<section id="about" class="box">
<div class="box-content">
<img src="assets/img/argent.png" alt="Description de l'image 2">
<div class="text-content">
<h2>1 mois gratuit?</h2>
<p>"Découvrez une expérience musicale sans limites avec notre offre exclusive : abonnez-vous dès aujourd'hui et bénéficiez d'un mois complet GRATUIT pour explorer notre vaste catalogue de musique. Plongez dans un univers de sonorités variées et profitez d'un accès illimité à vos artistes préférés, sans engagement ! Rejoignez-nous dès maintenant pour un mois d'exploration musicale sans pareil."</p>
</div>
</div>
</section>
<section id="product" class="box">
<div class="box-img">
<img src="assets/img/argent.png" alt="Description de l'image 3">
<div class="text-content">
<h2>La Cognition</h2>
<p>Découvrez notre nouveaux cube v3 qui peut avoir la voix de votre choix.</p>
<p>Plongez dans une réalité la cognition rencontre la technologie. Notre cube connecté va au-delà de l'ordinaire, réagissant à votre pensée et intégrant la puissance de la cognition pour une expérience holographique incomparable.</p>
</div>
</div>
</section>
<section id="sale" class="box">
<div class="box-content">
<img src="assets/img/Statistique.png" alt="Description de l'image 4">
<div class="text-content">
<h2>Statistiques</h2>
<p>"Découvrez les statistiques de notre application de musique : des millions d'utilisateurs s'immergent dans une expérience audio immersive, créant des milliers de playlists et explorant une multitude de genres musicaux, tout en bénéficiant d'un mois gratuit dès l'abonnement !"</p>
</div>
</div>
</section>
</div>
<script src="assets/bouton.js"></script>
</div>
</header>
<script src="../assets/bouton.js"></script>
<button id="scrollTopBtn" onclick="scrollToTop()">
<span>&#8593;</span>
</button>593;</span>
</button>
</body>
</html>
</body>
</html>

View File

@ -1,33 +0,0 @@
<!doctype html>
<html lang="en" class="has-navbar-fixed-top">
<head>
<meta charset="UTF-8" />
<title>SpotiFly</title>
<link rel="stylesheet" href="<?= base_url('assets/style.css') ?>">
<link rel="stylesheet" href="<?= base_url('assets/album.css') ?>">
</head>
<body>
<main class='container'>
<header class="navbar">
<div class="logo">
<img src="assets/img/SpotiFly.png" alt="SpotiFly">
</div>
<nav class="menu">
<ul>
<li><?= anchor('https://dwarves.iut-fbleau.fr/~boutaric/SAEWEB2.2/ci/','Home'); ?></li>
<li><?= anchor('albums','Albums'); ?></li>
<li><?= anchor('artistes','Artistes'); ?></li>
<li><?= anchor('playlist','Playlist'); ?></li>
</ul>
</nav>
<div class="user">
<a class="bouton" href="html/Connexion.html">Connexion</a>
<a class="bouton" href="html/Inscription.html">S'inscrire</a>
</div>
</header>
<script src="assets/bouton.js"></script>
<button id="scrollTopBtn" onclick="scrollToTop()">
<span>&#8593;</span>
</button>
</body>
</html>

View File

@ -1,32 +0,0 @@
<!doctype html>
<html lang="en" class="has-navbar-fixed-top">
<head>
<meta charset="UTF-8" />
<title>SpotiFly</title>
<link rel="stylesheet" href="<?= base_url('assets/style.css') ?>">
</head>
<body>
<main class='container'>
<header class="navbar">
<div class="logo">
<img src="assets/img/SpotiFly.png" alt="SpotiFly">
</div>
<nav class="menu">
<ul>
<li><?= anchor('https://dwarves.iut-fbleau.fr/~boutaric/SAEWEB2.2/ci/','Home'); ?></li>
<li><?= anchor('albums','Albums'); ?></li>
<li><?= anchor('artistes','Artistes'); ?></li>
<li><?= anchor('playlist','Playlist'); ?></li>
</ul>
</nav>
<div class="user">
<a class="bouton" href="html/Connexion.html">Connexion</a>
<a class="bouton" href="html/Inscription.html">S'inscrire</a>
</div>
</header>
<script src="assets/bouton.js"></script>
<button id="scrollTopBtn" onclick="scrollToTop()">
<span>&#8593;</span>
</button>
</body>
</html>

View File

@ -1,32 +0,0 @@
<!doctype html>
<html lang="en" class="has-navbar-fixed-top">
<head>
<meta charset="UTF-8" />
<title>SpotiFly</title>
<link rel="stylesheet" href="<?= base_url('assets/style.css') ?>">
</head>
<body>
<main class='container'>
<header class="navbar">
<div class="logo">
<img src="assets/img/SpotiFly.png" alt="SpotiFly">
</div>
<nav class="menu">
<ul>
<li><?= anchor('https://dwarves.iut-fbleau.fr/~boutaric/SAEWEB2.2/ci/','Home'); ?></li>
<li><?= anchor('albums','Albums'); ?></li>
<li><?= anchor('artistes','Artistes'); ?></li>
<li><?= anchor('playlist','Playlist'); ?></li>
</ul>
</nav>
<div class="user">
<a class="bouton" href="html/Connexion.html">Connexion</a>
<a class="bouton" href="html/Inscription.html">S'inscrire</a>
</div>
</header>
<script src="assets/bouton.js"></script>
<button id="scrollTopBtn" onclick="scrollToTop()">
<span>&#8593;</span>
</button>
</body>
</html>

View File

@ -1,100 +0,0 @@
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Welcome to CodeIgniter</title>
<style type="text/css">
::selection { background-color: #E13300; color: white; }
::-moz-selection { background-color: #E13300; color: white; }
body {
background-color: #fff;
margin: 40px;
font: 13px/20px normal Helvetica, Arial, sans-serif;
color: #4F5155;
}
a {
color: #003399;
background-color: transparent;
font-weight: normal;
text-decoration: none;
}
a:hover {
color: #97310e;
}
h1 {
color: #444;
background-color: transparent;
border-bottom: 1px solid #D0D0D0;
font-size: 19px;
font-weight: normal;
margin: 0 0 14px 0;
padding: 14px 15px 10px 15px;
}
code {
font-family: Consolas, Monaco, Courier New, Courier, monospace;
font-size: 12px;
background-color: #f9f9f9;
border: 1px solid #D0D0D0;
color: #002166;
display: block;
margin: 14px 0 14px 0;
padding: 12px 10px 12px 10px;
}
#body {
margin: 0 15px 0 15px;
min-height: 96px;
}
p {
margin: 0 0 10px;
padding:0;
}
p.footer {
text-align: right;
font-size: 11px;
border-top: 1px solid #D0D0D0;
line-height: 32px;
padding: 0 10px 0 10px;
margin: 20px 0 0 0;
}
#container {
margin: 10px;
border: 1px solid #D0D0D0;
box-shadow: 0 0 8px #D0D0D0;
}
</style>
</head>
<body>
<div id="container">
<h1>Welcome to CodeIgniter!</h1>
<div id="body">
<p>The page you are looking at is being generated dynamically by CodeIgniter.</p>
<p>If you would like to edit this page you'll find it located at:</p>
<code>application/views/welcome_message.php</code>
<p>The corresponding controller for this page is found at:</p>
<code>application/controllers/Welcome.php</code>
<p>If you are exploring CodeIgniter for the very first time, you should start by reading the <a href="userguide3/">User Guide</a>.</p>
</div>
<p class="footer">Page rendered in <strong>{elapsed_time}</strong> seconds. <?php echo (ENVIRONMENT === 'development') ? 'CodeIgniter Version <strong>' . CI_VERSION . '</strong>' : '' ?></p>
</div>
</body>
</html>

View File

@ -1,4 +1,3 @@
/* assets/albums_style.css */
.container {
display: flex;
flex-wrap: wrap;
@ -9,11 +8,12 @@
.album {
box-sizing: border-box;
width: 18%;
width: 18%;
margin-bottom: 20px;
border: 1px solid #ccc;
border-radius: 10px;
padding: 10px;
margin-top: 50px;
text-align: center;
background-color: #f9f9f9;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

50
ci/assets/artiste.css Normal file
View File

@ -0,0 +1,50 @@
/* artiste.css */
/* Corps principal */
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 0;
}
/* Conteneur principal */
.container {
width: 80%;
margin: auto;
overflow: hidden;
}
/* Section des artistes */
.artiste {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 20px;
}
/* Style des liens des artistes */
.artiste a {
display: block;
width: 80%;
border: 1px solid #ddd;
padding: 10px;
margin: 10px 0;
text-align: center;
background-color: #fff;
text-decoration: none;
color: #333;
border-radius: 5px;
transition: background-color 0.3s, border-color 0.3s;
}
/* Effet au survol des liens des artistes */
.artiste a:hover {
background-color: #f0f0f0;
border-color: #ccc;
}
/* Couleur des liens visités */
.artiste a:visited {
color: #333;
}

BIN
ci/assets/img/Instagram.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 91 KiB

BIN
ci/assets/img/Logo1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 882 B

BIN
ci/assets/img/Logo2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

BIN
ci/assets/img/logo_page.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 181 KiB

BIN
ci/assets/img/twitter.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

22
ci/assets/song.css Normal file
View File

@ -0,0 +1,22 @@
/* Style de la liste des chansons */
.list {
display: flex;
flex-direction: column;
align-items: center;
margin: 20px;
}
.list div {
width: 100%;
max-width: 600px;
margin: 10px 0;
border: 1px solid #ccc;
padding: 15px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
background-color: #f9f9f9;
}
.short-text {
font-size: 18px;
font-weight: bold;
}

View File

@ -14,15 +14,17 @@ body {
}
.navbar {
background-color: black;
padding: 20px; /* Ajuste la valeur de padding selon tes besoins */
padding: 20px;
display: flex;
justify-content: space-between;
align-items: center;
position: fixed;
width: 100%;
top: 0;
z-index: 1000;
z-index: 1000;
box-sizing: border-box;
}
.bouton a{
color: #FFF;
text-decoration: none;
@ -103,8 +105,8 @@ body {
}
#Page img {
width: 400px;
height: 400PX;
width: 1000px;
height: 500PX;
}
.text-page {
@ -212,20 +214,21 @@ img {
max-width: 100%;
height: auto;
}
.footer {
background-color: black;
color: white;
padding: 20px;
padding: 20px;
text-align: center;
margin-top: 20px;
margin-top: 20px;
width: 100%;
box-sizing: border-box;
}
.footer-content {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
}
.footer-section {
text-align: center;
margin: 10px;