ANDJ
abf761db07
Ich habe soweit automatisiert the Emails sortieren aber ich muss noch schauen was es fur bugs es gibt wenn die app online ist deswegen wurde ich mit diesen Commit die website veroffentlichen obwohjl es sein konnte das es noch nicht fertig ist und verkaufs bereit
101 lines
3.0 KiB
HTML
101 lines
3.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Zahlung Abgebrochen - EmailSorter</title>
|
|
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
<style>
|
|
:root {
|
|
--bg: #0a0a0f;
|
|
--warning: #f59e0b;
|
|
--warning-glow: rgba(245, 158, 11, 0.2);
|
|
--text: #e4e4e7;
|
|
--text-muted: #71717a;
|
|
--accent: #6366f1;
|
|
}
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
body {
|
|
font-family: 'Space Grotesk', sans-serif;
|
|
background: var(--bg);
|
|
color: var(--text);
|
|
min-height: 100vh;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
text-align: center;
|
|
}
|
|
.bg {
|
|
position: fixed;
|
|
top: 0; left: 0; right: 0; bottom: 0;
|
|
background: radial-gradient(circle at 50% 50%, var(--warning-glow) 0%, transparent 50%);
|
|
pointer-events: none;
|
|
}
|
|
.container {
|
|
position: relative;
|
|
z-index: 1;
|
|
padding: 2rem;
|
|
}
|
|
.icon {
|
|
width: 100px;
|
|
height: 100px;
|
|
background: rgba(245, 158, 11, 0.2);
|
|
border: 3px solid var(--warning);
|
|
border-radius: 50%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin: 0 auto 2rem;
|
|
font-size: 3rem;
|
|
}
|
|
h1 {
|
|
font-size: 2rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
p {
|
|
color: var(--text-muted);
|
|
margin-bottom: 2rem;
|
|
max-width: 400px;
|
|
}
|
|
.buttons {
|
|
display: flex;
|
|
gap: 1rem;
|
|
justify-content: center;
|
|
flex-wrap: wrap;
|
|
}
|
|
.btn {
|
|
display: inline-block;
|
|
padding: 1rem 2rem;
|
|
border-radius: 8px;
|
|
text-decoration: none;
|
|
font-weight: 600;
|
|
transition: all 0.2s;
|
|
}
|
|
.btn-primary {
|
|
background: var(--accent);
|
|
color: white;
|
|
}
|
|
.btn-secondary {
|
|
background: transparent;
|
|
color: var(--text-muted);
|
|
border: 1px solid var(--text-muted);
|
|
}
|
|
.btn:hover {
|
|
transform: translateY(-2px);
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="bg"></div>
|
|
<div class="container">
|
|
<div class="icon">✕</div>
|
|
<h1>Zahlung Abgebrochen</h1>
|
|
<p>Die Zahlung wurde abgebrochen. Keine Sorge, es wurde nichts berechnet. Du kannst jederzeit erneut versuchen.</p>
|
|
<div class="buttons">
|
|
<a href="/" class="btn btn-primary">Erneut Versuchen</a>
|
|
<a href="/" class="btn btn-secondary">Zur Startseite</a>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|