Files
TimeTracker/app/templates/errors/403.html
T
Dries Peeters 463704f054 feat(ui): refresh shared layout patterns and responsive screens
Unify buttons, cards, headers, toasts, and form treatments across the app so screens feel consistent and are easier to scan on desktop and mobile. Update the broader template set to use the shared UI primitives and responsive spacing patterns introduced in this refresh.
2026-03-06 22:15:06 +01:00

34 lines
1.9 KiB
HTML

{% extends "base.html" %}
{% block title %}{{ _('403 Forbidden') }} - {{ app_name }}{% endblock %}
{% block content %}
<div class="flex items-center justify-center min-h-[60vh] px-4 py-8">
<div class="w-full max-w-md text-center">
<div class="bg-card-light dark:bg-card-dark rounded-xl border border-border-light dark:border-border-dark shadow-sm p-6 sm:p-8">
<div class="inline-flex items-center justify-center w-16 h-16 sm:w-20 sm:h-20 rounded-full bg-red-100 dark:bg-red-900/30 mb-4">
<i class="fas fa-ban text-2xl sm:text-3xl text-red-500"></i>
</div>
<h1 class="text-5xl font-bold text-text-light/20 dark:text-text-dark/20 mb-2">403</h1>
<h2 class="text-lg font-semibold text-text-light dark:text-text-dark mb-2">{{ _('Access Denied') }}</h2>
<p class="text-sm text-text-light/60 dark:text-text-dark/60 mb-6">
{{ _("You don't have permission to access this resource. This could be due to:") }}
</p>
<ul class="text-sm text-text-light/70 dark:text-text-dark/70 space-y-1 mb-6">
<li><i class="fas fa-circle text-[5px] mr-2 align-middle"></i>{{ _('Insufficient privileges') }}</li>
<li><i class="fas fa-circle text-[5px] mr-2 align-middle"></i>{{ _('Not logged in') }}</li>
<li><i class="fas fa-circle text-[5px] mr-2 align-middle"></i>{{ _('Resource access restrictions') }}</li>
</ul>
<div class="flex flex-col sm:flex-row items-center justify-center gap-3">
<a href="{{ url_for('main.dashboard') }}" class="btn btn-primary">
<i class="fas fa-home"></i> {{ _('Go to Dashboard') }}
</a>
<a href="{{ url_for('auth.login') }}" class="btn btn-secondary">
<i class="fas fa-sign-in-alt"></i> {{ _('Login') }}
</a>
</div>
</div>
</div>
</div>
{% endblock %}