identity-vault/app/views/errors/unprocessable_entity.html.erb
2025-12-29 16:19:10 -05:00

100 lines
2.5 KiB
Text

<style>
.error-page {
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
padding: 2rem;
text-align: center;
}
.error-page-content {
max-width: 600px;
}
.error-icon {
width: 80px;
height: 80px;
margin: 0 auto 1.5rem;
color: var(--pico-primary);
}
.error-code {
font-size: 4rem;
font-weight: 700;
color: var(--pico-primary);
margin-bottom: 0.5rem;
line-height: 1;
}
.error-title {
font-size: 1.5rem;
margin-bottom: 0.5rem;
}
.error-description {
margin-bottom: 2rem;
opacity: 0.8;
}
.error-id-box {
background: var(--pico-card-background-color);
border: 2px solid var(--pico-primary);
border-radius: var(--pico-border-radius);
padding: 1.5rem;
margin-bottom: 2rem;
}
.error-id-label {
font-size: 0.875rem;
margin-bottom: 1rem;
opacity: 0.9;
}
.error-id-code {
display: block;
font-family: monospace;
font-size: 0.9rem;
padding: 0.75rem 1rem;
background: var(--pico-background-color);
border: 1px solid var(--pico-muted-border-color);
border-radius: var(--pico-border-radius);
cursor: pointer;
transition: all 0.2s;
font-weight: 600;
}
.error-id-code:hover {
border-color: var(--pico-primary);
background: var(--pico-primary-focus);
}
.copy-feedback {
display: none;
margin-top: 0.5rem;
color: #2ecc71;
font-size: 0.875rem;
font-weight: 600;
}
.copy-feedback.show {
display: block;
}
</style>
<div class="error-page">
<div class="error-page-content">
<svg class="error-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18.364 18.364A9 9 0 005.636 5.636m12.728 12.728A9 9 0 015.636 5.636m12.728 12.728L5.636 5.636"></path>
</svg>
<div class="error-code">422</div>
<h1 class="error-title">Unprocessable Entity</h1>
<p class="error-description">The change you wanted was rejected.</p>
<% if @event_id.present? %>
<div class="error-id-box">
<p class="error-id-label">Error ID:</p>
<code
class="error-id-code"
data-error-id="<%= @event_id %>"
onclick="copyErrorId(this)"
title="Click to copy">
<%= @event_id %>
</code>
<div class="copy-feedback">✓ Copied to clipboard!</div>
</div>
<% end %>
<a href="/" role="button">Go back home</a>
</div>
</div>