Import initial du site depuis le serveur
This commit is contained in:
WhyKorp's server
+2147
-2147
File diff suppressed because it is too large
Load Diff
+2226
-2226
File diff suppressed because it is too large
Load Diff
+2206
-2206
File diff suppressed because it is too large
Load Diff
+2147
-2147
File diff suppressed because it is too large
Load Diff
+93
-93
@@ -1,94 +1,94 @@
|
||||
body {
|
||||
font-family: 'Noto Sans', sans-serif;
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
}
|
||||
.container {
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
border: 2px solid #8C0312;
|
||||
border-radius: 25px;
|
||||
padding: 20px;
|
||||
background-color: #444;
|
||||
}
|
||||
.nav a {
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
padding: 10px 20px;
|
||||
border: 2px solid #8C0312;
|
||||
border-radius: 25px;
|
||||
background-color: #333;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
.nav a:hover {
|
||||
background-color: #8C0312;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.video-container {
|
||||
width: 80%;
|
||||
margin: 20px auto;
|
||||
border: 2px solid #8C0312;
|
||||
border-radius: 25px;
|
||||
overflow: hidden;
|
||||
padding-bottom: 56.25%;
|
||||
position: relative;
|
||||
}
|
||||
.video-container iframe {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
header {
|
||||
text-align: left;
|
||||
}
|
||||
.logo {
|
||||
width: 9.5%;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.title {
|
||||
display: inline-block;
|
||||
font-size: 48px;
|
||||
line-height: 60px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
div.footer {
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
border: 2px solid #8C0312;
|
||||
border-radius: 25px;
|
||||
padding: 20px;
|
||||
background-color: #444;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
img.flash {
|
||||
display: inline-block;
|
||||
width: 128px;
|
||||
transition: 0.4s;
|
||||
};
|
||||
|
||||
img.flash:hover {
|
||||
transition: 0.4s;
|
||||
width: 800px
|
||||
};
|
||||
|
||||
#results {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#results li {
|
||||
margin-bottom: 5px;
|
||||
cursor: pointer;
|
||||
body {
|
||||
font-family: 'Noto Sans', sans-serif;
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
}
|
||||
.container {
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
border: 2px solid #8C0312;
|
||||
border-radius: 25px;
|
||||
padding: 20px;
|
||||
background-color: #444;
|
||||
}
|
||||
.nav a {
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
padding: 10px 20px;
|
||||
border: 2px solid #8C0312;
|
||||
border-radius: 25px;
|
||||
background-color: #333;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
.nav a:hover {
|
||||
background-color: #8C0312;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.video-container {
|
||||
width: 80%;
|
||||
margin: 20px auto;
|
||||
border: 2px solid #8C0312;
|
||||
border-radius: 25px;
|
||||
overflow: hidden;
|
||||
padding-bottom: 56.25%;
|
||||
position: relative;
|
||||
}
|
||||
.video-container iframe {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
header {
|
||||
text-align: left;
|
||||
}
|
||||
.logo {
|
||||
width: 9.5%;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.title {
|
||||
display: inline-block;
|
||||
font-size: 48px;
|
||||
line-height: 60px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
div.footer {
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
border: 2px solid #8C0312;
|
||||
border-radius: 25px;
|
||||
padding: 20px;
|
||||
background-color: #444;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
img.flash {
|
||||
display: inline-block;
|
||||
width: 128px;
|
||||
transition: 0.4s;
|
||||
};
|
||||
|
||||
img.flash:hover {
|
||||
transition: 0.4s;
|
||||
width: 800px
|
||||
};
|
||||
|
||||
#results {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#results li {
|
||||
margin-bottom: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
+37
-37
@@ -1,37 +1,37 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap" rel="stylesheet">
|
||||
<link href="css/style.css" rel="stylesheet">
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="icon" href="img/logo.png">
|
||||
<title>Mik'A'Muz</title>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<header>
|
||||
<a href="https://www.facebook.com/mikamuzdj" target="_blank">
|
||||
<img class="logo" src="img/logo.png" alt="Logo">
|
||||
</a>
|
||||
<h1 class="title">Mik'A'Muz</h1>
|
||||
<h4>DJ amateur depuis plus de 15 ans passionné de musique depuis petit, je me ferai un plaisir de vous aMUZer sur des MUZiques de tous styles.</h4>
|
||||
</header>
|
||||
<hr>
|
||||
<h1>Liste de karaokés - 2026</h1>
|
||||
<p>Vous pouvez télécharger la liste des karaokés entière. Ou effectuer une recherche dans la liste tout en bas.</p>
|
||||
<div class="nav">
|
||||
<a href="Liste karaoké 2026 v2.pdf" target="_BLANK">Liste Karaoké 2026</a>
|
||||
</div>
|
||||
<br>
|
||||
<hr>
|
||||
<h1>Recherche dans la liste de karaoké</h1>
|
||||
<input type="text" id="searchInput" placeholder="Rechercher...">
|
||||
<ul id="results"></ul>
|
||||
</div>
|
||||
<div class="footer">
|
||||
Copyright | Whykorp® 2021-2026
|
||||
</div>
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap" rel="stylesheet">
|
||||
<link href="css/style.css" rel="stylesheet">
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="icon" href="img/logo.png">
|
||||
<title>Mik'A'Muz</title>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<header>
|
||||
<a href="https://www.facebook.com/mikamuzdj" target="_blank">
|
||||
<img class="logo" src="img/logo.png" alt="Logo">
|
||||
</a>
|
||||
<h1 class="title">Mik'A'Muz</h1>
|
||||
<h4>DJ amateur depuis plus de 15 ans passionné de musique depuis petit, je me ferai un plaisir de vous aMUZer sur des MUZiques de tous styles.</h4>
|
||||
</header>
|
||||
<hr>
|
||||
<h1>Liste de karaokés - 2026</h1>
|
||||
<p>Vous pouvez télécharger la liste des karaokés entière. Ou effectuer une recherche dans la liste tout en bas.</p>
|
||||
<div class="nav">
|
||||
<a href="Liste karaoké 2026 v2.pdf" target="_BLANK">Liste Karaoké 2026</a>
|
||||
</div>
|
||||
<br>
|
||||
<hr>
|
||||
<h1>Recherche dans la liste de karaoké</h1>
|
||||
<input type="text" id="searchInput" placeholder="Rechercher...">
|
||||
<ul id="results"></ul>
|
||||
</div>
|
||||
<div class="footer">
|
||||
Copyright | Whykorp® 2021-2026
|
||||
</div>
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
+32
-32
@@ -1,33 +1,33 @@
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const searchInput = document.getElementById('searchInput');
|
||||
const resultsList = document.getElementById('results');
|
||||
|
||||
// Charger le fichier CSV
|
||||
fetch('Liste karaoké 2026 v2.csv')
|
||||
.then(response => response.text())
|
||||
.then(data => {
|
||||
const lines = data.split('\n');
|
||||
const items = lines.map(line => line.trim());
|
||||
|
||||
// Fonction de recherche
|
||||
function search(query) {
|
||||
resultsList.innerHTML = '';
|
||||
const filteredItems = items.filter(item =>
|
||||
item.toLowerCase().includes(query.toLowerCase())
|
||||
);
|
||||
filteredItems.forEach(item => {
|
||||
let displayedItem = item.replace('.mp4', '').replace(';;;', '');
|
||||
const li = document.createElement('li');
|
||||
li.textContent = displayedItem;
|
||||
resultsList.appendChild(li);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// Écouter les changements de la barre de recherche
|
||||
searchInput.addEventListener('input', function () {
|
||||
search(searchInput.value);
|
||||
});
|
||||
})
|
||||
.catch(error => console.error('Erreur de chargement du fichier :', error));
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const searchInput = document.getElementById('searchInput');
|
||||
const resultsList = document.getElementById('results');
|
||||
|
||||
// Charger le fichier CSV
|
||||
fetch('Liste karaoké 2026 v2.csv')
|
||||
.then(response => response.text())
|
||||
.then(data => {
|
||||
const lines = data.split('\n');
|
||||
const items = lines.map(line => line.trim());
|
||||
|
||||
// Fonction de recherche
|
||||
function search(query) {
|
||||
resultsList.innerHTML = '';
|
||||
const filteredItems = items.filter(item =>
|
||||
item.toLowerCase().includes(query.toLowerCase())
|
||||
);
|
||||
filteredItems.forEach(item => {
|
||||
let displayedItem = item.replace('.mp4', '').replace(';;;', '');
|
||||
const li = document.createElement('li');
|
||||
li.textContent = displayedItem;
|
||||
resultsList.appendChild(li);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// Écouter les changements de la barre de recherche
|
||||
searchInput.addEventListener('input', function () {
|
||||
search(searchInput.value);
|
||||
});
|
||||
})
|
||||
.catch(error => console.error('Erreur de chargement du fichier :', error));
|
||||
});
|
||||
Reference in New Issue
Block a user