[camélianimes] première base du site
All checks were successful
camelia / deploy (push) Successful in 35s
All checks were successful
camelia / deploy (push) Successful in 35s
This commit is contained in:
parent
76663ce15f
commit
9cd723f48d
BIN
p/camelianimes/images/39372436_p0_master1200.jpg
Normal file
BIN
p/camelianimes/images/39372436_p0_master1200.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 741 KiB |
BIN
p/camelianimes/images/60834799_p0_master1200.jpg
Normal file
BIN
p/camelianimes/images/60834799_p0_master1200.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 956 KiB |
BIN
p/camelianimes/images/65751842_p0_master1200.jpg
Normal file
BIN
p/camelianimes/images/65751842_p0_master1200.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 666 KiB |
BIN
p/camelianimes/images/70764381_p0_master1200.jpg
Normal file
BIN
p/camelianimes/images/70764381_p0_master1200.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 442 KiB |
BIN
p/camelianimes/images/72278604_p0_master1200.jpg
Normal file
BIN
p/camelianimes/images/72278604_p0_master1200.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 794 KiB |
BIN
p/camelianimes/images/79704508_p0_master1200.jpg
Normal file
BIN
p/camelianimes/images/79704508_p0_master1200.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 704 KiB |
BIN
p/camelianimes/images/90908293_p2_master1200.jpg
Normal file
BIN
p/camelianimes/images/90908293_p2_master1200.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 707 KiB |
BIN
p/camelianimes/images/91837671_p0_master1200.jpg
Normal file
BIN
p/camelianimes/images/91837671_p0_master1200.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 748 KiB |
48
p/camelianimes/index.html
Normal file
48
p/camelianimes/index.html
Normal file
@ -0,0 +1,48 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Camélianimes - Accueil</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<a href="index.html">Accueil</a>
|
||||||
|
<a href="pages/infos.html">Description</a>
|
||||||
|
<a href="pages/liste.html">Liste</a>
|
||||||
|
<a href="pages/calendrier.html">Calendrier</a>
|
||||||
|
<a href="pages/credits.html">Crédits</a>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="home-background">
|
||||||
|
<div class="home-content">
|
||||||
|
<h1>Camélianimes</h1>
|
||||||
|
<p>Viens regarder avec nous, chaque lundi à 22h00, l'animé sélectionné !<br>
|
||||||
|
En ce moment c'est « BOFURI » (saison 2)</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
let currentImageIndex = 0;
|
||||||
|
const images = [
|
||||||
|
'images/39372436_p0_master1200.jpg',
|
||||||
|
'images/60834799_p0_master1200.jpg',
|
||||||
|
'images/65751842_p0_master1200.jpg',
|
||||||
|
'images/70764381_p0_master1200.jpg'
|
||||||
|
];
|
||||||
|
|
||||||
|
function changeBackgroundImage() {
|
||||||
|
document.querySelector('.home-background').style.backgroundImage = `url(${images[currentImageIndex]})`;
|
||||||
|
currentImageIndex = (currentImageIndex + 1) % images.length;
|
||||||
|
}
|
||||||
|
|
||||||
|
setInterval(changeBackgroundImage, 5000);
|
||||||
|
window.onload = changeBackgroundImage;
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
27
p/camelianimes/pages/calendrier.html
Normal file
27
p/camelianimes/pages/calendrier.html
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Camélianimes - Calendrier</title>
|
||||||
|
<link rel="stylesheet" href="../style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<a href="../index.html">Accueil</a>
|
||||||
|
<a href="infos.html">Description</a>
|
||||||
|
<a href="liste.html">Liste</a>
|
||||||
|
<a href="calendrier.html">Calendrier</a>
|
||||||
|
<a href="credits.html">Crédits</a>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
<h1>Calendrier</h1>
|
||||||
|
<p>Prochainement</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
32
p/camelianimes/pages/credits.html
Normal file
32
p/camelianimes/pages/credits.html
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Camélianimes - Crédits</title>
|
||||||
|
<link rel="stylesheet" href="../style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<a href="../index.html">Accueil</a>
|
||||||
|
<a href="infos.html">Description</a>
|
||||||
|
<a href="liste.html">Liste</a>
|
||||||
|
<a href="calendrier.html">Calendrier</a>
|
||||||
|
<a href="credits.html">Crédits</a>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
<h1>Crédits</h1>
|
||||||
|
<p>Sources des images utilisées sur la page d'accueil : </p>
|
||||||
|
<ul>
|
||||||
|
<li>Image 1: Source et lien.</li>
|
||||||
|
<li>Image 2: Source et lien.</li>
|
||||||
|
<!-- More credits if necessary -->
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
68
p/camelianimes/pages/infos.html
Normal file
68
p/camelianimes/pages/infos.html
Normal file
@ -0,0 +1,68 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Camélianimes - Description</title>
|
||||||
|
<link rel="stylesheet" href="../style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<a href="../index.html">Accueil</a>
|
||||||
|
<a href="infos.html">Description</a>
|
||||||
|
<a href="liste.html">Liste</a>
|
||||||
|
<a href="calendrier.html">Calendrier</a>
|
||||||
|
<a href="credits.html">Crédits</a>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
<h1>Description du projet</h1>
|
||||||
|
<p>
|
||||||
|
Coucou ! Si tu es ici, c'est que tu souhaites probablement savoir la méthode pour mettre MPV & Syncplay sur ton PC, afin de profiter des séances de Camélianime non ? Pas de soucis ! Je vais tout t'expliquer, tu as juste à suivre les étapes suivantes :
|
||||||
|
</p>
|
||||||
|
<h2>Comment télécharger et installer « MPV » ?</h2>
|
||||||
|
<p>
|
||||||
|
Note : « MPV » est un lecteur vidéo (comme « VLC » ou « PotPlayer » par exemple), compatible à l'utilisation de « Syncplay ».
|
||||||
|
</p>
|
||||||
|
<ol>
|
||||||
|
<li>Télécharger la dernière version de « MPV » sur son site : <a href="https://mpv.io/" target="_blank">https://mpv.io/</a>.</li>
|
||||||
|
<li>Créer un dossier MPV où vous souhaitez l'installer et y décompresser l'archive que vous venez de télécharger (normalement bootstrapper.zip).</li>
|
||||||
|
<li>L'installer en exécutant le fichier <code>updater.bat</code> contenu dans l'archive. Cela devrait ouvrir une fenêtre avec des lignes de commandes qui s'exécutent toutes seules, c'est normal. Laisser tout cela se terminer et c'est bon ! Vous avez « MPV » d'installé sur votre machine.</li>
|
||||||
|
</ol>
|
||||||
|
|
||||||
|
<h2>Comment télécharger et installer « Syncplay » ?</h2>
|
||||||
|
<p>
|
||||||
|
Note : « Syncplay » est un programme qui va synchroniser les lecteurs « MPV » de tous les participants à la séance, ainsi, si une personne fait play ou pause, cela lancera/arrêtera la vidéo pour tout le monde.
|
||||||
|
</p>
|
||||||
|
<ol>
|
||||||
|
<li>Télécharger la dernière version de « Syncplay » sur son site : <a href="https://syncplay.pl/" target="_blank">https://syncplay.pl/</a> (version portable pour Windows).</li>
|
||||||
|
<li>Créer un dossier Syncplay où vous souhaitez l'installer et y décompresser l'archive que vous venez de télécharger (normalement <code>Syncplay-Portable-Client-1.x.x.zip</code>).</li>
|
||||||
|
<li>Et voilà, c'est installé !</li>
|
||||||
|
</ol>
|
||||||
|
|
||||||
|
<h2>Comment configurer « Syncplay » ?</h2>
|
||||||
|
<p>En lançant <code>Syncplay.exe</code>, vous verrez une fenêtre avec différentes options à compléter, voici les informations à donner :</p>
|
||||||
|
<ol>
|
||||||
|
<li><strong>Server address:</strong> <code>shelter.moe:7373</code></li>
|
||||||
|
<li><strong>Server password:</strong> [laisser vide]</li>
|
||||||
|
<li><strong>Username:</strong> [mettre votre pseudo]</li>
|
||||||
|
<li><strong>Default room:</strong> <code>Camélianime</code></li>
|
||||||
|
<li><strong>Path to media player:</strong> [sélectionner le fichier <code>mpv.exe</code> dans le dossier où vous avez installé MPV préalablement]</li>
|
||||||
|
</ol>
|
||||||
|
<p>
|
||||||
|
Ensuite, vous n'avez plus qu'à cliquer sur « Store configuration and run Syncplay » ! Vous devriez voir une nouvelle fenêtre s'ouvrir (ainsi que le lecteur « MPV »). Dans l'encadré vide sous la liste des utilisateurs, faites un clic droit puis sélectionnez « Set trusted domains » et ajoutez les deux lignes suivantes :
|
||||||
|
</p>
|
||||||
|
<ul>
|
||||||
|
<li><code>syncplay.nanami.fr</code></li>
|
||||||
|
<li><code>camelia-studio.org</code></li>
|
||||||
|
</ul>
|
||||||
|
<p>Puis validez avec « OK ».</p>
|
||||||
|
|
||||||
|
<p>Voilà ! Vous êtes maintenant prêt à profiter confortablement des séances de Camélianime !</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
31
p/camelianimes/pages/liste.html
Normal file
31
p/camelianimes/pages/liste.html
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Camélianimes - Liste</title>
|
||||||
|
<link rel="stylesheet" href="../style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<a href="../index.html">Accueil</a>
|
||||||
|
<a href="infos.html">Description</a>
|
||||||
|
<a href="liste.html">Liste</a>
|
||||||
|
<a href="calendrier.html">Calendrier</a>
|
||||||
|
<a href="credits.html">Crédits</a>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
<h1>Liste des séries visionnées</h1>
|
||||||
|
<ul>
|
||||||
|
<li><a href="https://anilist.co/anime/1376" target="_blank">Great Teacher Onizuka (vf)</a></li>
|
||||||
|
<li><a href="https://anilist.co/anime/10103" target="_blank">Back Street Girls - Gokudols (vf)</a></li>
|
||||||
|
<!-- More series as per the list -->
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
116
p/camelianimes/style.css
Normal file
116
p/camelianimes/style.css
Normal file
@ -0,0 +1,116 @@
|
|||||||
|
/* style.css */
|
||||||
|
|
||||||
|
/* Global Styles */
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
font-family: Arial, sans-serif;
|
||||||
|
background-color: #2c2f33;
|
||||||
|
color: #ffffff;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
body a {
|
||||||
|
color: #7289da;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
body a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
background-color: #23272a;
|
||||||
|
padding: 10px;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav a {
|
||||||
|
margin: 0 15px;
|
||||||
|
color: #ffffff;
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav a:hover {
|
||||||
|
color: #7289da;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
padding-top: 70px;
|
||||||
|
max-width: 800px;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Page-specific Styles */
|
||||||
|
.home-background {
|
||||||
|
height: 100vh;
|
||||||
|
width: 100%;
|
||||||
|
position: relative;
|
||||||
|
background-size: cover;
|
||||||
|
background-position: center;
|
||||||
|
transition: background-image 1.5s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
text-align: center;
|
||||||
|
color: #ffffff;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
padding: 20px;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-content h1 {
|
||||||
|
font-size: 48px;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-content p {
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Description Page */
|
||||||
|
ol {
|
||||||
|
background: #40444b;
|
||||||
|
padding: 20px;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
ol li {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* List Page */
|
||||||
|
ul {
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul li {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul li a {
|
||||||
|
color: #7289da;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul li a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
footer {
|
||||||
|
padding: 10px;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
color: #99aab5;
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user