81 lines
2.9 KiB
HTML
81 lines
2.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Creative Crafter</title>
|
|
<script type="module" src="https://cdn.jsdelivr.net/npm/ldrs/dist/auto/quantum.js"></script>
|
|
<!-- Dein Stylesheet -->
|
|
<link rel="stylesheet" href="styles.css">
|
|
</head>
|
|
<body>
|
|
<!-- Ladeanimation -->
|
|
<div class="loader-container">
|
|
<l-quantum
|
|
size="90"
|
|
speed="1.75"
|
|
color="black"
|
|
></l-quantum>
|
|
</div>
|
|
|
|
<h1><img src="/icons/Controller.png" height="150svh"><br/>Creative Crafter</h1>
|
|
<h1>Flappy Witch</h1>
|
|
<div align='center'>
|
|
<img src="/programmieren/spiele/Flappy-Witch/logo.png" width="250">
|
|
</div>
|
|
<br/>
|
|
<div align='center'>
|
|
<a href="/programmieren/spiele/Flappy-Witch/FlappyWitch.html">
|
|
<button class="button">
|
|
<span class="button-text">Play</span>
|
|
</button>
|
|
</a>
|
|
<br/><br/>
|
|
<!-- Neuer Teilen-Button -->
|
|
<div class="tooltip-container">
|
|
<div class="button-content" onclick="shareText()">
|
|
<span class="text">Teilen</span>
|
|
<svg class="share-icon" viewBox="0 0 24 24">
|
|
<!-- Dein SVG-Icon hier -->
|
|
<path d="M14 9V5l7 7-7 7v-4H8v-6h6zM5 5v14"></path>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<br/><br/><br/>
|
|
<div align='center'>
|
|
<img src="/programmieren/spiele/Flappy-Witch/FlappyWitch1.png" width="250">
|
|
<img src="/programmieren/spiele/Flappy-Witch/FlappyWitch2.png" width="250">
|
|
</div>
|
|
<!-- JavaScript für Ladeanimation und Teilen-Funktion -->
|
|
<script>
|
|
// Ladeanimation beim Laden der Seite anzeigen
|
|
document.body.classList.add('loading');
|
|
// Ladeanimation entfernen, wenn die Seite vollständig geladen ist
|
|
window.addEventListener('load', () => {
|
|
document.body.classList.remove('loading');
|
|
});
|
|
|
|
// Teilen-Funktion
|
|
function shareText() {
|
|
const shareData = {
|
|
title: 'Flappy Witch',
|
|
text: 'Schau dir dieses fantastische Spiel an!',
|
|
url: 'https://www.creative-crafter.de/programmieren/spiele/Flappy-Witch/'
|
|
};
|
|
|
|
if (navigator.share) {
|
|
navigator.share(shareData)
|
|
.then(() => console.log('Erfolgreich geteilt'))
|
|
.catch((error) => console.log('Fehler beim Teilen', error));
|
|
} else {
|
|
// Fallback für Browser ohne Web Share API
|
|
// Öffnet einen Dialog zum Auswählen der App
|
|
const shareUrl = 'whatsapp://send?text=' + encodeURIComponent(shareData.text + ' ' + shareData.url);
|
|
window.open(shareUrl, '_blank');
|
|
}
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|