feat: enhance Erugo theme to responsive full-screen cyber glassmorphism template
This commit is contained in:
eldov
@@ -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>
|
||||
|
||||
@@ -1,50 +1,73 @@
|
||||
<!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'] }} - Wird vorbereitet</title>
|
||||
@vite('resources/js/app.js')
|
||||
|
||||
<script>
|
||||
function reload() {
|
||||
window.location.reload();
|
||||
}
|
||||
</script>
|
||||
|
||||
</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(0, 242, 254, 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(0, 242, 254, 0.3) !important;
|
||||
border-radius: 24px !important;
|
||||
box-shadow: 0 25px 60px rgba(0, 0, 0, 0.7), 0 0 35px rgba(0, 242, 254, 0.2) !important;
|
||||
padding: 44px 40px !important;
|
||||
text-align: center !important;
|
||||
}
|
||||
.share-not-ready h1 {
|
||||
font-size: 1.8rem !important;
|
||||
font-weight: 700 !important;
|
||||
color: #00f2fe !important;
|
||||
margin-bottom: 12px !important;
|
||||
}
|
||||
.share-not-ready p {
|
||||
color: #94a3b8 !important;
|
||||
font-size: 1rem !important;
|
||||
line-height: 1.6 !important;
|
||||
}
|
||||
.btn-reload {
|
||||
margin-top: 20px !important;
|
||||
background: linear-gradient(135deg, #00f2fe 0%, #4facfe 100%) !important;
|
||||
color: #030712 !important;
|
||||
font-weight: 700 !important;
|
||||
padding: 12px 28px !important;
|
||||
border-radius: 12px !important;
|
||||
border: none !important;
|
||||
cursor: pointer !important;
|
||||
box-shadow: 0 4px 20px rgba(0, 242, 254, 0.35) !important;
|
||||
}
|
||||
</style>
|
||||
<div class="share-not-ready">
|
||||
<div class="share-status-inner">
|
||||
<h1><svg class="lucide lucide-circle-dashed" xmlns="http://www.w3.org/2000/svg" width="24" height="24"
|
||||
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
<path d="M10.1 2.182a10 10 0 0 1 3.8 0" />
|
||||
<path d="M13.9 21.818a10 10 0 0 1-3.8 0" />
|
||||
<path d="M17.609 3.721a10 10 0 0 1 2.69 2.7" />
|
||||
<path d="M2.182 13.9a10 10 0 0 1 0-3.8" />
|
||||
<path d="M20.279 17.609a10 10 0 0 1-2.7 2.69" />
|
||||
<path d="M21.818 10.1a10 10 0 0 1 0 3.8" />
|
||||
<path d="M3.721 6.391a10 10 0 0 1 2.7-2.69" />
|
||||
<path d="M6.391 20.279a10 10 0 0 1-2.69-2.7" />
|
||||
</svg>Share is being processed</h1>
|
||||
<p>Try again in a few moments.</p>
|
||||
<button onclick="reload()">Try again now</button>
|
||||
<h1>Transfer Wird Vorbereitet...</h1>
|
||||
<p>Die Dateien werden gerade verarbeitet oder hochgeladen.<br><small style="color: #64748b;">Diese Seite aktualisiert sich in Kürze automatisch.</small></p>
|
||||
<button class="btn-reload" onclick="reload()">Neu Laden</button>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user