Apply UI/UX improvements and fix broken Bootstrap JS
- Add CSS custom properties for brand colors - Remove global font-weight: bold from body - Increase content panel opacity from 0.6 to 0.88 - Add dynamic lang attribute, favicon, and Open Graph meta tags - Move scripts to <head> with defer (required due to automagic-images plugin) - Disable automagic-images plugin (PHPHtmlParser strips all <script src> tags during HTML re-serialization, breaking Bootstrap JS and all dropdowns) - Add loading="lazy" to below-fold images across templates Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -3,7 +3,7 @@
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/glightbox/dist/css/glightbox.min.css">
|
||||
{% endblock %}
|
||||
{% block extra_js %}
|
||||
<script src="https://cdn.jsdelivr.net/npm/glightbox/dist/js/glightbox.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/glightbox/dist/js/glightbox.min.js" defer></script>
|
||||
{% endblock %}
|
||||
{% block content %}
|
||||
<div class="row mb-3">
|
||||
@@ -16,7 +16,7 @@
|
||||
{% for i in 1..12 %}
|
||||
<div class="col-6 col-md-4 col-lg-3">
|
||||
<a href="https://picsum.photos/seed/kunst{{ i }}/800/800" class="glightbox gallery-item" data-gallery="galerie" data-description="Werk {{ i }}">
|
||||
<div class="gallery-thumb"><img src="https://picsum.photos/seed/kunst{{ i }}/350/350" alt="Werk {{ i }}"></div>
|
||||
<div class="gallery-thumb"><img src="https://picsum.photos/seed/kunst{{ i }}/350/350" loading="lazy" alt="Werk {{ i }}"></div>
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
Reference in New Issue
Block a user