mirror of
https://github.com/pacnpal/thrillwiki_django_no_react.git
synced 2025-12-20 09:31:09 -05:00
6697d8890b
Implement robust security headers, including CSP with nonces, and integrate comprehensive SEO meta tags into the base template and homepage. Add inline styles for CSP compliance and improve theme management script for immediate theme application. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 48ecdb60-d0f0-4b75-95c9-34e409ef35fb Replit-Commit-Checkpoint-Type: intermediate_checkpoint
191 lines
9.0 KiB
HTML
191 lines
9.0 KiB
HTML
{% load static %}
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="csrf-token" content="{{ csrf_token }}" />
|
|
|
|
<!-- SEO Meta Tags -->
|
|
<title>{% block title %}ThrillWiki{% endblock %}</title>
|
|
<meta name="description" content="{% block meta_description %}Your ultimate guide to theme parks and attractions worldwide. Discover thrilling rides, explore amazing parks, and share your adventures with fellow enthusiasts.{% endblock %}" />
|
|
<meta name="keywords" content="{% block meta_keywords %}theme parks, roller coasters, attractions, rides, amusement parks, Disney, Universal, Cedar Point{% endblock %}" />
|
|
<meta name="author" content="ThrillWiki" />
|
|
<meta name="robots" content="{% block meta_robots %}index, follow{% endblock %}" />
|
|
<link rel="canonical" href="{% block canonical_url %}{{ request.scheme }}://{{ request.get_host }}{{ request.path }}{% endblock %}" />
|
|
|
|
<!-- Open Graph / Facebook -->
|
|
<meta property="og:type" content="{% block og_type %}website{% endblock %}" />
|
|
<meta property="og:url" content="{% block og_url %}{{ request.build_absolute_uri|default:'' }}{% endblock %}" />
|
|
<meta property="og:title" content="{% block og_title %}ThrillWiki{% endblock %}" />
|
|
<meta property="og:description" content="{% block og_description %}Your ultimate guide to theme parks and attractions worldwide. Discover thrilling rides, explore amazing parks, and share your adventures with fellow enthusiasts.{% endblock %}" />
|
|
<meta property="og:image" content="{% block og_image %}{% load static %}{{ request.scheme }}://{{ request.get_host }}{% static 'images/placeholders/default-park.jpg' %}{% endblock %}" />
|
|
<meta property="og:image:width" content="1200" />
|
|
<meta property="og:image:height" content="630" />
|
|
<meta property="og:site_name" content="ThrillWiki" />
|
|
<meta property="og:locale" content="en_US" />
|
|
|
|
<!-- Twitter -->
|
|
<meta name="twitter:card" content="{% block twitter_card %}summary_large_image{% endblock %}" />
|
|
<meta name="twitter:url" content="{% block twitter_url %}{{ request.build_absolute_uri|default:'' }}{% endblock %}" />
|
|
<meta name="twitter:title" content="{% block twitter_title %}ThrillWiki{% endblock %}" />
|
|
<meta name="twitter:description" content="{% block twitter_description %}Your ultimate guide to theme parks and attractions worldwide. Discover thrilling rides, explore amazing parks, and share your adventures with fellow enthusiasts.{% endblock %}" />
|
|
<meta name="twitter:image" content="{% block twitter_image %}{% load static %}{{ request.scheme }}://{{ request.get_host }}{% static 'images/placeholders/default-park.jpg' %}{% endblock %}" />
|
|
<meta name="twitter:creator" content="@ThrillWiki" />
|
|
<meta name="twitter:site" content="@ThrillWiki" />
|
|
|
|
<!-- Resource Hints for Performance -->
|
|
<link rel="dns-prefetch" href="//fonts.googleapis.com" />
|
|
<link rel="dns-prefetch" href="//fonts.gstatic.com" />
|
|
<link rel="dns-prefetch" href="//unpkg.com" />
|
|
<link rel="dns-prefetch" href="//cdnjs.cloudflare.com" />
|
|
{% block extra_dns_prefetch %}{% endblock %}
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
{% block extra_preconnect %}{% endblock %}
|
|
|
|
<!-- Preload Critical Resources -->
|
|
{% block critical_resources %}
|
|
<link rel="preload" href="{% static 'css/tailwind.css' %}" as="style" />
|
|
<link rel="preload" href="{% static 'js/theme.js' %}?v={{ version|default:'1.0' }}" as="script" />
|
|
<link rel="preload" href="{% static 'js/alpine.min.js' %}?v={{ version|default:'1.0' }}" as="script" />
|
|
<link rel="preload" href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" as="style" />
|
|
{% endblock %}
|
|
|
|
<!-- Module Preload for Modern Browsers -->
|
|
{% block module_preload %}{% endblock %}
|
|
|
|
<!-- Google Fonts with performance optimizations -->
|
|
<link
|
|
href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap"
|
|
rel="stylesheet"
|
|
/>
|
|
|
|
<!-- Prevent flash of wrong theme -->
|
|
<script src="{% static 'js/theme.js' %}?v={{ version|default:'1.0' }}"></script>
|
|
|
|
<!-- HTMX -->
|
|
<script src="https://unpkg.com/htmx.org@1.9.6" integrity="sha384-FYYOtJ1BoGZ1EZbdLzmaydhwRKh5zxCwWA0jzNEzSJYTzFxN2wjCjOj3gLyQYZGC" crossorigin="anonymous"></script>
|
|
|
|
<!-- Alpine.js Components (must load before Alpine.js) -->
|
|
<script src="{% static 'js/alpine-components.js' %}?v={{ version|default:'1.0' }}"></script>
|
|
|
|
<!-- Alpine.js (must load after components) -->
|
|
<script defer src="{% static 'js/alpine.min.js' %}?v={{ version|default:'1.0' }}"></script>
|
|
|
|
<!-- Location Autocomplete -->
|
|
<script defer src="{% static 'js/location-autocomplete.js' %}?v={{ version|default:'1.0' }}"></script>
|
|
|
|
<!-- Tailwind CSS -->
|
|
<link href="{% static 'css/tailwind.css' %}" rel="stylesheet" />
|
|
<link href="{% static 'css/components.css' %}" rel="stylesheet" />
|
|
<link href="{% static 'css/alerts.css' %}" rel="stylesheet" />
|
|
<link href="{% static 'css/inline-styles.css' %}" rel="stylesheet" />
|
|
|
|
<!-- Font Awesome -->
|
|
<link
|
|
rel="stylesheet"
|
|
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
|
|
integrity="sha512-9usAa10IRO0HhonpyAIVpjrylPvoDwiPUiKdWk5t3PyolY1cOd4DSE0Ga+ri4AuTroPR5aQvXU9xC6qOPnzFeg=="
|
|
crossorigin="anonymous"
|
|
/>
|
|
|
|
|
|
<!-- Structured Data (JSON-LD) -->
|
|
{% block structured_data %}
|
|
<script type="application/ld+json" nonce="{{ request.csp_nonce }}">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "WebSite",
|
|
"name": "ThrillWiki",
|
|
"description": "Your ultimate guide to theme parks and attractions worldwide",
|
|
"url": "{{ request.scheme }}://{{ request.get_host }}",
|
|
"potentialAction": {
|
|
"@type": "SearchAction",
|
|
"target": {
|
|
"@type": "EntryPoint",
|
|
"urlTemplate": "{{ request.scheme }}://{{ request.get_host }}/search/?q={search_term_string}"
|
|
},
|
|
"query-input": "required name=search_term_string"
|
|
},
|
|
"author": {
|
|
"@type": "Organization",
|
|
"name": "ThrillWiki"
|
|
}
|
|
}
|
|
</script>
|
|
{% endblock %}
|
|
|
|
{% block extra_head %}{% endblock %}
|
|
</head>
|
|
<body
|
|
class="flex flex-col min-h-screen text-gray-900 bg-gradient-to-br from-white via-blue-50 to-indigo-50 dark:from-gray-950 dark:via-indigo-950 dark:to-purple-950 dark:text-white"
|
|
{% block body_attributes %}{% endblock %}
|
|
>
|
|
<!-- Skip to content link for accessibility -->
|
|
<a href="#main-content" class="sr-only focus:not-sr-only focus:absolute focus:top-4 focus:left-4 focus:z-50 px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors">Skip to main content</a>
|
|
<!-- Enhanced Header -->
|
|
{% include 'components/layout/enhanced_header.html' %}
|
|
|
|
<!-- Flash Messages -->
|
|
{% if messages %}
|
|
<div class="fixed top-0 right-0 z-50 p-4 space-y-4" role="alert" aria-live="polite" aria-label="Notifications">
|
|
{% for message in messages %}
|
|
<div
|
|
class="alert {% if message.tags %}alert-{{ message.tags }}{% endif %}"
|
|
role="alert"
|
|
aria-describedby="alert-{{ forloop.counter }}"
|
|
>
|
|
<span id="alert-{{ forloop.counter }}">{{ message }}</span>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- Main Content -->
|
|
<main id="main-content" class="container flex-grow px-6 py-8 mx-auto" role="main">
|
|
{% block content %}{% endblock %}
|
|
</main>
|
|
|
|
<!-- Footer -->
|
|
<footer
|
|
class="mt-auto border-t bg-white/90 dark:bg-gray-800/90 backdrop-blur-lg border-gray-200/50 dark:border-gray-700/50"
|
|
role="contentinfo"
|
|
aria-label="Site footer"
|
|
>
|
|
<div class="container px-6 py-6 mx-auto">
|
|
<div class="flex items-center justify-between">
|
|
<div class="text-gray-600 dark:text-gray-400">
|
|
<p>© {% now "Y" %} ThrillWiki. All rights reserved.</p>
|
|
</div>
|
|
<nav class="space-x-4" role="navigation" aria-label="Footer links">
|
|
<a
|
|
href="{% url 'terms' %}"
|
|
class="text-gray-600 transition-colors hover:text-primary dark:text-gray-400 dark:hover:text-primary"
|
|
>Terms</a
|
|
>
|
|
<a
|
|
href="{% url 'privacy' %}"
|
|
class="text-gray-600 transition-colors hover:text-primary dark:text-gray-400 dark:hover:text-primary"
|
|
>Privacy</a
|
|
>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Global Auth Modal -->
|
|
<c-auth_modal />
|
|
|
|
<!-- Global Toast Container -->
|
|
<c-toast_container />
|
|
|
|
<!-- Custom JavaScript with cache control -->
|
|
<script src="{% static 'js/main.js' %}?v={{ version|default:'1.0' }}"></script>
|
|
<script src="{% static 'js/alerts.js' %}?v={{ version|default:'1.0' }}"></script>
|
|
|
|
{% block extra_js %}{% endblock %}
|
|
</body>
|
|
</html>
|