feat: enhance Erugo theme to responsive full-screen cyber glassmorphism template

This commit is contained in:
eldov
2026-08-30 06:32:14 +02:00
parent 43db9196cd
commit 0046c92ee3
5 changed files with 732 additions and 169 deletions
+38 -14
View File
@@ -1,32 +1,56 @@
<!doctype html>
<html lang="en">
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="icon" href="/api/favicon" type="image/svg+xml">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.0.2/css/bootstrap.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" rel="stylesheet"
integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<title>{{ $settings['application_name'] }}</title>
<title>{{ $settings['application_name'] }} - Fehler</title>
@vite('resources/js/app.js')
</head>
<body data-settings='{!! json_encode($settings) !!}'>
<style id="erugo-css-variables">
:root {
--primary-color: {{ $settings['css_primary_color'] }};
--secondary-color: {{ $settings['css_secondary_color'] }};
--accent-color: {{ $settings['css_accent_color'] }};
--accent-color-light: {{ $settings['css_accent_color_light'] }};
<style>
body {
font-family: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif !important;
background: #060913 radial-gradient(circle at 50% 30%, rgba(239, 68, 68, 0.15) 0%, transparent 60%) !important;
color: #f8fafc !important;
min-height: 100vh !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.share-not-ready {
width: min(540px, 92vw) !important;
background: rgba(15, 23, 42, 0.85) !important;
backdrop-filter: blur(28px) saturate(180%) !important;
border: 1px solid rgba(239, 68, 68, 0.35) !important;
border-radius: 24px !important;
box-shadow: 0 25px 60px rgba(0, 0, 0, 0.7), 0 0 35px rgba(239, 68, 68, 0.2) !important;
padding: 44px 40px !important;
text-align: center !important;
}
.share-not-ready h1 {
font-size: 1.9rem !important;
font-weight: 700 !important;
color: #ef4444 !important;
margin-bottom: 12px !important;
}
.share-not-ready p {
color: #94a3b8 !important;
font-size: 1rem !important;
line-height: 1.6 !important;
}
</style>
<div class="share-not-ready">
<div class="share-status-inner">
<h1>Bad Error</h1>
<p>Something went horribly wrong with this share. <br><small>Please ask the sender to try again.</small></p>
<h1>⚠️ Transfer Nicht Verfügbar</h1>
<p>Dieser Link ist abgelaufen oder die Dateien wurden gelöscht.<br><small style="color: #64748b;">Bitte kontaktiere den Absender für eine neue Freigabe.</small></p>
</div>
</div>
</body>