Add favicon and improve demo page

- Add SVG favicon with privacy shield design
- Include standard .ico favicon for browser compatibility
- Add git repository link to demo page for easy access
- Clean up meta tags and remove unnecessary PWA complexity

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Ole-Morten Duesund 2025-09-08 13:05:14 +02:00
commit db8c59d226
5 changed files with 42 additions and 0 deletions

BIN
favicon-16x16.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
favicon-32x32.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 KiB

23
favicon.svg Normal file
View file

@ -0,0 +1,23 @@
<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="gradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#667eea;stop-opacity:1" />
<stop offset="100%" style="stop-color:#764ba2;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Background circle -->
<circle cx="16" cy="16" r="15" fill="url(#gradient)" stroke="#fff" stroke-width="1"/>
<!-- Shield shape representing privacy protection -->
<path d="M16 4 L12 6 L12 14 Q12 18 16 21 Q20 18 20 14 L20 6 Z" fill="white" opacity="0.9"/>
<!-- Lock symbol inside shield -->
<rect x="14" y="12" width="4" height="4" rx="0.5" fill="url(#gradient)"/>
<path d="M14.5 12 Q14.5 10.5 16 10.5 Q17.5 10.5 17.5 12" fill="none" stroke="url(#gradient)" stroke-width="1"/>
<!-- Small tracking dots -->
<circle cx="10" cy="26" r="1.5" fill="#4caf50" opacity="0.8"/>
<circle cx="22" cy="26" r="1.5" fill="#667eea" opacity="0.8"/>
<circle cx="16" cy="28" r="1" fill="#764ba2" opacity="0.6"/>
</svg>

After

Width:  |  Height:  |  Size: 1 KiB

View file

@ -4,6 +4,14 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>🍪 Privacy-First Demo | GDPR Compliant Tracking</title>
<!-- Favicon -->
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<!-- Meta Tags -->
<meta name="description" content="Experience GDPR-compliant optional tracking. Privacy protected by default with enhanced features available only when you choose to enable them.">
<meta name="author" content="olemd">
<style>
* {
box-sizing: border-box;
@ -324,6 +332,17 @@
</div>
<p><strong>Try it out!</strong> Click the colorful button in the bottom-right corner to see the consent flow in action. 👇</p>
<div style="margin-top: 2rem; padding: 1rem; background: #f8f9fa; border-radius: 8px; text-align: center;">
<p style="margin: 0; color: #666; font-size: 14px;">
💡 <strong>Want to use this in your project?</strong><br>
View source code and documentation at
<a href="https://kode.naiv.no/olemd/gdpr" target="_blank" rel="noopener"
style="color: #667eea; text-decoration: none; font-weight: 600;">
kode.naiv.no/olemd/gdpr
</a>
</p>
</div>
</div>
</div>
</div>