Browse Source

Check W3C Validator

master
SERNY Sacha 3 years ago
parent
commit
0d5336677c
  1. 9
      fun.html
  2. 21
      home.html
  3. 156
      index.html
  4. 168
      musique.html
  5. 4
      reading.html
  6. 2
      sign_in.php
  7. 2
      sign_up.php
  8. 3
      style/style_log.css

9
fun.html

@ -13,10 +13,10 @@
<body>
<header>
<h1><a class="_title" href="home.html"><span class="word1">Pop</span><span class="word3">Op</span></a></h1>
<h1><a class="_title" href="index.html"><span class="word1">Pop</span><span class="word3">Op</span></a></h1>
<ul>
<li><a href="fun.html">Fun</a></li>
<li><a href="index.html">Musiques</a></li>
<li><a href="musique.html">Musiques</a></li>
<li><a href="reading.html">Lectures</a></li>
</ul>
<div>
@ -79,9 +79,8 @@
</div>
</main>
<footer>
<a href="mentions-legales.html" target="_blank">Mentions légales.</a> <br> Mise en page
par
SERNY Sacha. Données par <a href="https://www.wikipedia.org">Wikipedia</a>
<a href="mentions-legales.html" target="_blank">Mentions légales.</a> <br> Mise en page par SERNY Sacha. Données
par <a href="https://www.wikipedia.org">Wikipedia</a>
</footer>
</body>

21
home.html

@ -1,21 +0,0 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Titre</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="style/style_home.css" rel="stylesheet">
<link rel="icon" type="image/x-icon" href="_content/favicon-32x32.png">
</head>
<body>
<main class="home">
<div class="title">
<h1><a href="index.html">PopOp</a></h1>
</div>
</main>
</body>
</html>

156
index.html

@ -2,160 +2,20 @@
<html lang="fr">
<head>
<title>PopOp</title>
<title>Titre</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="style/style_index.css" rel="stylesheet">
<link href="style/style_main.css" rel="stylesheet">
<link href="style/style_home.css" rel="stylesheet">
<link rel="icon" type="image/x-icon" href="_content/favicon-32x32.png">
</head>
<body>
<header>
<h1><a class="_title" href="home.html"><span class="word1">Pop</span><span class="word3">Op</span></a></h1>
<ul>
<li><a href="fun.html">Fun</a></li>
<li><a href="index.html">Musiques</a></li>
<li><a href="reading.html">Lectures</a></li>
</ul>
<div>
<a href="sign_in.php">Se connecter</a>
<a href="sign_up.php">S'inscrire</a>
</div>
</header>
<main>
<div class="main-side">
<a href="https://open.spotify.com/track/2dLLR6qlu5UJ5gk0dKz0h3?si=dce69b1c4a26487d" class="element elmnt1"
target="_blank">
<img src="_content/picture2.jpg" alt="thumbnail">
<div>
<h2>Royals</h2>
<p>Royals - Lorde<br></p>
<p class="hidden">Ella Marija Lani Yelich-O'Connor dite Lorde, née le 7 novembre 1996 à Auckland, en
Nouvelle-Zélande, est une auteure-compositrice-interprétatrice et productrice néo-zélandaise.
</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/search/numb%20link" class="element elmnt2">
<img src="_content/picture1.jpg" alt="thumbnail" target="_blank">
<div>
<h2>Numb</h2>
<p>Numb - Linkin Park<br></p>
<p class="hidden">Linkin Park est un groupe de rock et de metal américain, originaire d'Agoura Hills
en Californie. Il est formé en 1996.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/6xWFzrQE9KIioQSYXlVN2t?si=a8ebcfbc70804976" class="element elmnt1">
<img src="_content/picture3.jpg" alt="thumbnail" target="_blank">
<div>
<h2>Red</h2>
<p>Red - Survive said the prophet <br></p>
<p class="hidden">Survive Said The Prophet est un groupe de rock alternatif japonais originaire de
Tōkyō. Il est actuellement composé de 5 membres : Yosh, Yudai, Ivan, Tatsuya et Show.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/2lXu7SNGIKHJ8EV2EetYFa?si=f29c10aab5964beb" class="element elmnt2">
<img src="_content/picture4.jpeg" alt="thumbnail" target="_blank">
<div>
<h2>命に嫌われて</h2>
<p>命に嫌われている。- Majiko<br></p>
<p class="hidden">majiko (まじ娘) est un auteur-compositeur-interprète japonais. Elle a commencé sa
carrière en faisant des reprises de chansons sur Nico Nico Douga.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/1x5sYLZiu9r5E43kMlt9f8?si=631da71145414cc0" class="element">
<img src="_content/picture5.jpg" alt="thumbnail" target="_blank">
<div>
<h2>Symphony</h2>
<p>Symphony - Clean Bandit (feat. Zara Larsson)></p>
<p class="hidden">Clean Bandit est un groupe de musique électronique anglais, fondé à Cambridge en
2009. Il est composé de trois membres : Grace Chatto, Luke Patterson et Jack Patterson.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/7djl4lZ6guZYAckDsfzrfs?si=e9c779cc72644f81" class="element elmnt2">
<img src="_content/picture6.jpg" alt="thumbnail" target="_blank">
<div>
<h2>Reckoning song</h2>
<p>Reckoning song (cover) - Asaf Avidan, The Mojos</p>
<p class="hidden">Asaf Avidan est un auteur-compositeur-interprète israélien né le 23 mars 1980 à
Jérusalem.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/1hwJKpe0BPUsq6UUrwBWTw?si=71cfd097e58349b0" class="element elmnt2">
<img src="_content/picture7.jpg" alt="thumbnail" target="_blank" width="150" height="150">
<div>
<h2>Boulevard of..</h2>
<p>Boulevard of Broken Dreams - Green Day</p>
<p class="hidden">Green Day est un groupe de punk rock américain, originaire de Berkeley, en
Californie.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/album/3zpPQp0SG0voOUtkovK7O5" class="element elmnt2">
<img src="_content/picture8.jpg" alt="thumbnail" target="_blank">
<div>
<h2>Centuries</h2>
<p>Centuries - Fall Out Boy</p>
<p class="hidden">Fall Out Boy (FOB) est un groupe de rock américain, originaire de Wilmette, près
de Chicago.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/2U5kSevItDmL0XzSDyemRp?si=dff1294e198f4439" class="element elmnt1">
<img src="_content/picture9.jpg" alt="thumbnail" target="_blank">
<div>
<h2>Le temps est bon</h2>
<p>Le temps est bon - Bon Entendeur </p>
<p class="hidden">Bon Entendeur est le nom d’un collectif musical français, fondé en 2012 par Arnaud
Bonet.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/62yJjFtgkhUrXktIoSjgP2?si=8de8d5f411a04de7" class="element elmnt2">
<img src="_content/picture10.jpg" alt="thumbnail" target="_blank">
<div>
<h2>Radioactive</h2>
<p>Radioactive - Imagine Dragons<br></p>
<p class="hidden">Imagine Dragons est un groupe de pop rock américain, originaire de Las Vegas, dans
le Nevada.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
</div>
<div class="main-contents">
<aside>
<h2>À propos...</h2>
<p>Voici un site très peu utile et pertinent afin de rendre un travail un minimum
complété. Voilà Voilà, <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">
cliquez ici</a> pour découvrir l'envers du décor (ou pas). <br><br>
Le rhinopharyngitolaryngographologie et cyclopentanoperhydrophénanthrène met en avant la
contraventionnalisation anticonstitutionnelle mis en avant les apports en
aminométhylpyrimidinylhydroxyéthylméthylthiazolium.</p>
</aside>
<aside>
<h2>Fun Fact</h2>
<p>En cliquant sur le lien vous accèderai à plus d'informations sur les conditions de création de ce
site : <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">Cliquez ici</a>
</aside>
<aside>
<h2>Image aléatoire</h2>
<p>Un site du nom de <a href="https://picsum.photos" target="_blank">picsum</a> affiche une image
aléatoire. Rien de
plus.
</p>
<img src="https://picsum.photos/400/240" alt="random-pic" height="240" width="400">
</aside>
<main class="home">
<div class="title">
<h1><a href="musique.html">PopOp</a></h1>
</div>
</main>
<footer>
<a href="mentions-legales.html" target="_blank">Mentions légales.</a> <br> Mise en page
par
SERNY Sacha. Données par <a href="https://www.wikipedia.org">Wikipedia</a>
</footer>
</body>
</html>

168
musique.html

@ -0,0 +1,168 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<title>PopOp</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="style/style_index.css" rel="stylesheet">
<link href="style/style_main.css" rel="stylesheet">
<link rel="icon" type="image/x-icon" href="_content/favicon-32x32.png">
</head>
<body>
<header>
<h1><a class="_title" href="index.html"><span class="word1">Pop</span><span class="word3">Op</span></a></h1>
<ul>
<li><a href="fun.html">Fun</a></li>
<li><a href="musique.html">Musiques</a></li>
<li><a href="reading.html">Lectures</a></li>
</ul>
<div>
<a href="sign_in.php">Se connecter</a>
<a href="sign_up.php">S'inscrire</a>
</div>
</header>
<main>
<div class="main-side">
<a href="https://open.spotify.com/track/2dLLR6qlu5UJ5gk0dKz0h3?si=dce69b1c4a26487d" class="element elmnt1"
target="_blank">
<img src="_content/picture2.jpg" alt="thumbnail">
<div>
<h2>Royals</h2>
<p>Royals - Lorde<br></p>
<p class="hidden">Ella Marija Lani Yelich-O'Connor dite Lorde, née le 7 novembre 1996 à Auckland, en
Nouvelle-Zélande, est une auteure-compositrice-interprétatrice et productrice néo-zélandaise.
</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/search/numb%20link" class="element elmnt2" target="_blank">
<img src="_content/picture1.jpg" alt="thumbnail">
<div>
<h2>Numb</h2>
<p>Numb - Linkin Park<br></p>
<p class="hidden">Linkin Park est un groupe de rock et de metal américain, originaire d'Agoura Hills
en Californie. Il est formé en 1996.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/6xWFzrQE9KIioQSYXlVN2t?si=a8ebcfbc70804976" class="element elmnt1"
target="_blank">
<img src="_content/picture3.jpg" alt="thumbnail">
<div>
<h2>Red</h2>
<p>Red - Survive said the prophet <br></p>
<p class="hidden">Survive Said The Prophet est un groupe de rock alternatif japonais originaire de
Tōkyō. Il est actuellement composé de 5 membres : Yosh, Yudai, Ivan, Tatsuya et Show.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/2lXu7SNGIKHJ8EV2EetYFa?si=f29c10aab5964beb" class="element elmnt2"
target="_blank">
<img src="_content/picture4.jpeg" alt="thumbnail">
<div>
<h2>命に嫌われて</h2>
<p>命に嫌われている。- Majiko<br></p>
<p class="hidden">majiko (まじ娘) est un auteur-compositeur-interprète japonais. Elle a commencé sa
carrière en faisant des reprises de chansons sur Nico Nico Douga.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/1x5sYLZiu9r5E43kMlt9f8?si=631da71145414cc0" class="element"
target="_blank">
<img src="_content/picture5.jpg" alt="thumbnail">
<div>
<h2>Symphony</h2>
<p>Symphony - Clean Bandit (feat. Zara Larsson)></p>
<p class="hidden">Clean Bandit est un groupe de musique électronique anglais, fondé à Cambridge en
2009. Il est composé de trois membres : Grace Chatto, Luke Patterson et Jack Patterson.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/7djl4lZ6guZYAckDsfzrfs?si=e9c779cc72644f81" class="element elmnt2"
target="_blank">
<img src="_content/picture6.jpg" alt="thumbnail">
<div>
<h2>Reckoning song</h2>
<p>Reckoning song (cover) - Asaf Avidan, The Mojos</p>
<p class="hidden">Asaf Avidan est un auteur-compositeur-interprète israélien né le 23 mars 1980 à
Jérusalem.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/1hwJKpe0BPUsq6UUrwBWTw?si=71cfd097e58349b0" class="element elmnt2"
target="_blank">
<img src="_content/picture7.jpg" alt="thumbnail" width="150" height="150">
<div>
<h2>Boulevard of..</h2>
<p>Boulevard of Broken Dreams - Green Day</p>
<p class="hidden">Green Day est un groupe de punk rock américain, originaire de Berkeley, en
Californie.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/album/3zpPQp0SG0voOUtkovK7O5" class="element elmnt2" target="_blank">
<img src="_content/picture8.jpg" alt="thumbnail">
<div>
<h2>Centuries</h2>
<p>Centuries - Fall Out Boy</p>
<p class="hidden">Fall Out Boy (FOB) est un groupe de rock américain, originaire de Wilmette, près
de Chicago.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/2U5kSevItDmL0XzSDyemRp?si=dff1294e198f4439" class="element elmnt1"
target="_blank">
<img src="_content/picture9.jpg" alt="thumbnail">
<div>
<h2>Le temps est bon</h2>
<p>Le temps est bon - Bon Entendeur </p>
<p class="hidden">Bon Entendeur est le nom d’un collectif musical français, fondé en 2012 par Arnaud
Bonet.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
<a href="https://open.spotify.com/track/62yJjFtgkhUrXktIoSjgP2?si=8de8d5f411a04de7" class="element elmnt2"
target="_blank">
<img src="_content/picture10.jpg" alt="thumbnail">
<div>
<h2>Radioactive</h2>
<p>Radioactive - Imagine Dragons<br></p>
<p class="hidden">Imagine Dragons est un groupe de pop rock américain, originaire de Las Vegas, dans
le Nevada.</p>
<u><img class="icon" src="_content/spotify-icon.png" alt="spotify-icon">Lien (légal)</u>
</div>
</a>
</div>
<div class="main-contents">
<aside>
<h2>À propos...</h2>
<p>Voici un site très peu utile et pertinent afin de rendre un travail un minimum
complété. Voilà Voilà, <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">
cliquez ici</a> pour découvrir l'envers du décor (ou pas). <br><br>
Le rhinopharyngitolaryngographologie et cyclopentanoperhydrophénanthrène met en avant la
contraventionnalisation anticonstitutionnelle mis en avant les apports en
aminométhylpyrimidinylhydroxyéthylméthylthiazolium.</p>
</aside>
<aside>
<h2>Fun Fact</h2>
<p>En cliquant sur le lien vous accèderai à plus d'informations sur les conditions de création de ce
site : <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">Cliquez ici</a>
</aside>
<aside>
<h2>Image aléatoire</h2>
<p>Un site du nom de <a href="https://picsum.photos" target="_blank">picsum</a> affiche une image
aléatoire. Rien de
plus.
</p>
<img src="https://picsum.photos/400/240" alt="random-pic" height="240" width="400">
</aside>
</div>
</main>
<footer>
<a href="mentions-legales.html" target="_blank">Mentions légales.</a> <br> Mise en page
par
SERNY Sacha. Données par <a href="https://www.wikipedia.org">Wikipedia</a>
</footer>
</body>

4
reading.html

@ -12,10 +12,10 @@
<body>
<header>
<h1><a class="_title" href="home.html"><span class="word1">Pop</span><span class="word3">Op</span></a></h1>
<h1><a class="_title" href="index.html"><span class="word1">Pop</span><span class="word3">Op</span></a></h1>
<ul>
<li><a href="fun.html">Fun</a></li>
<li><a href="index.html">Musiques</a></li>
<li><a href="musique.html">Musiques</a></li>
<li><a href="reading.html">Lectures</a></li>
</ul>
<div>

2
sign_in.php

@ -51,7 +51,7 @@ if (isset($_POST['submit'])) {
<body>
<div class="log-area">
<p>Connecte-toi pour accéder à plus de foncitonnalités</p>
<form action="" method="POST">
<form method="POST">
<div class="f_inputs">
<div>
<label for="f_email">Adresse mail : </label><input type="email" name="f_email" id="f_email" maxlength="70"

2
sign_up.php

@ -68,7 +68,7 @@ if (isset($_POST['submit'])) {
<body>
<div class="log-area">
<p>Inscris-toi pour accéder à plus de foncitonnalités</p>
<form action="" method="POST">
<form method="POST">
<div class="f_inputs">
<div>
<label for="f_pseudo">Pseudo       : </label><input type="text" id="f_pseudo" maxlength="70"

3
style/style_log.css

@ -26,16 +26,13 @@ a:-webkit-any-link {
}
input {
writing-mode: auto;
text-rendering: auto;
color: black;
letter-spacing: normal;
word-spacing: normal;
text-transform: none;
text-indent: auto;
text-shadow: none;
display: inline-block;
text-align: auto;
appearance: none;
background-color: white;
-webkit-rtl-ordering: none;

Loading…
Cancel
Save