neu
This commit is contained in:
parent
3b0b4e2273
commit
01fc30383c
90
index.html
90
index.html
@ -28,76 +28,23 @@
|
||||
.loading .loader-container {
|
||||
display: flex;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Ladeanimation -->
|
||||
<div class="loader-container">
|
||||
<l-quantum
|
||||
size="90"
|
||||
speed="1.75"
|
||||
color="black"
|
||||
></l-quantum>
|
||||
</div>
|
||||
|
||||
<!-- Deine anderen Inhalte hier -->
|
||||
<p></p>
|
||||
|
||||
<script>
|
||||
// Simulieren des Ladevorgangs
|
||||
document.body.classList.add('loading');
|
||||
|
||||
// Nach 3 Sekunden den Ladevorgang beenden
|
||||
setTimeout(() => {
|
||||
document.body.classList.remove('loading');
|
||||
}, 3000);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Creative Crafter</title>
|
||||
<link href="" rel="stylesheet">
|
||||
<style>
|
||||
@font-face {
|
||||
font-family: "Titillium";
|
||||
src: url("/Titillium-Web-Regular.ttf");
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Titillium';
|
||||
}
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1><img src="/icons/Controller.png" height="150svh">
|
||||
<br/>
|
||||
Creative Crafter</h1>
|
||||
<h3>Hi, meine Gamertag ist Creative Crafter. Auf dieser Website zeige ich euch meine Spiele.</h3>
|
||||
<h2><img src="/icons/spiele.png" height="25vh">Programmiern</h2>
|
||||
|
||||
|
||||
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Button Beispiel</title>
|
||||
<style>
|
||||
body, html {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bg-gradient {
|
||||
background: linear-gradient(to bottom, rgba(0,0,0,0.4), transparent);
|
||||
@ -138,6 +85,24 @@
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Ladeanimation -->
|
||||
<div class="loader-container">
|
||||
<l-quantum
|
||||
size="90"
|
||||
speed="1.75"
|
||||
color="black"
|
||||
></l-quantum>
|
||||
</div>
|
||||
|
||||
<!-- Deine anderen Inhalte hier -->
|
||||
<h1><img src="/icons/Controller.png" height="150svh">
|
||||
<br/>
|
||||
Creative Crafter</h1>
|
||||
<h3>Hi, meine Gamertag ist Creative Crafter. Auf dieser Website zeige ich euch meine Spiele.</h3>
|
||||
<h2><img src="/icons/spiele.png" height="25vh">Programmiern</h2>
|
||||
<a href="/programmieren/spiele/"><img src="/icons/meine-spiele.png" height="100vh"></a>
|
||||
|
||||
<!-- Button hinzufügen -->
|
||||
<div class="bg-gradient">
|
||||
<button class="button" onclick="window.location.href='/programmieren/spiele/'">
|
||||
<div class="button-inner">
|
||||
@ -145,8 +110,15 @@
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<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');
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
</body>
|
||||
</html>
|
Loading…
x
Reference in New Issue
Block a user