m038/natascha-rieter-nl
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Apply UI/UX improvements and fix broken Bootstrap JS

Browse Source 
- 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:
Mischa
2026-04-19 02:15:40 +02:00
parent 87b0893ebd
commit 589b70aae9
7 changed files with 38 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
user/themes/natascha/templates/partials/base.html.twig
+10 -4
View File
@@ -1,13 +1,22 @@
<!doctype html>
<html lang="nl">
<html lang="{{ grav.language.active ?? 'nl' }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% if page.title %}{{ page.title }} – {% endif %}Natascha Rieter</title>
<meta name="description" content="{{ page.header.description ?? 'Keramieke Galerie Groot Welsden – Natascha Rieter' }}">
<meta property="og:title" content="{% if page.title %}{{ page.title }} – {% endif %}Natascha Rieter">
<meta property="og:description" content="{{ page.header.description ?? 'Keramieke Galerie Groot Welsden – Natascha Rieter' }}">
<meta property="og:image" content="{{ url('theme://images/logo-blauw.png', true) }}">
<meta property="og:url" content="{{ page.permalink }}">
<meta property="og:type" content="website">
<link rel="icon" type="image/png" href="{{ url('theme://images/logo-vignet-blauw.png') }}">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css">
{% block extra_css %}{% endblock %}
<link rel="stylesheet" href="{{ url('theme://css/custom.css') }}">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" defer></script>
<script src="{{ url('theme://js/main.js') }}" defer></script>
{% block extra_js %}{% endblock %}
</head>
<body>
@@ -25,8 +34,5 @@
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
{% block extra_js %}{% endblock %}
<script src="{{ url('theme://js/main.js') }}"></script>
</body>
</html>