Files
boc/quixzoom-emoji-fix.patch
T
Bernt aee0f09db8 landvex: Fixar och tester klara för alla komponenter
- Datafabrik: Dockerfile fix, agentorkestrering fungerar
- Vision: Identify-modell, FAISS, OCR alla testade
- API: Alla 7 integrationstester passerade
- Upplösare: Entitetsupplösning verifierad
2026-07-05 06:41:32 +00:00

118 lines
3.4 KiB
Diff

# quixzoom.com Emoji Fix — Patch Instructions
# ============================================
# Replace all emojis with Lucide SVG icons
# Target: s3://quixzoom-landing-prod/index.html
#
# EMOJIS FOUND ON LIVE SITE (from screenshot):
# 🔒 GDPR Compliant → <svg class="icon"><use href="#icon-lock"/></svg>
# 💳 Stripe Connect Verified → <svg class="icon"><use href="#icon-credit-card"/></svg>
# 🆔 Identity Verified → <svg class="icon"><use href="#icon-shield-check"/></svg>
# 📋 DAC7 Reporting → <svg class="icon"><use href="#icon-file-text"/></svg>
## Step 1: Add Lucide Icon Sprite to <head>
Add this SVG sprite before closing </head>:
```html
<svg xmlns="http://www.w3.org/2000/svg" style="display:none">
<defs>
<symbol id="icon-lock" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="11" width="18" height="11" rx="2" ry="2"/>
<path d="M7 11V7a5 5 0 0 1 10 0v4"/>
</symbol>
<symbol id="icon-credit-card" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="1" y="4" width="22" height="16" rx="2" ry="2"/>
<line x1="1" y1="10" x2="23" y2="10"/>
</symbol>
<symbol id="icon-shield-check" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
<polyline points="9 12 12 15 16 10"/>
</symbol>
<symbol id="icon-file-text" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/>
<polyline points="14 2 14 8 20 8"/>
<line x1="16" y1="13" x2="8" y2="13"/>
<line x1="16" y1="17" x2="8" y2="17"/>
<polyline points="10 9 9 9 8 9"/>
</symbol>
</defs>
</svg>
```
## Step 2: Add CSS for Icons
```css
.trust-icon {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 0.85rem;
color: #334466;
}
.trust-icon svg {
width: 18px;
height: 18px;
flex-shrink: 0;
}
.trust-badge {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 8px 14px;
background: #f0f4fa;
border-radius: 8px;
font-size: 0.85rem;
color: #001E50;
font-weight: 500;
}
.trust-badge svg {
width: 20px;
height: 20px;
color: #C8763A;
}
```
## Step 3: Replace Emoji HTML
### BEFORE (current):
```html
<span>🔒 GDPR Compliant</span>
<span>💳 Stripe Connect Verified</span>
<span>🆔 Identity Verified</span>
<span>📋 DAC7 Reporting</span>
```
### AFTER (fixed):
```html
<span class="trust-badge">
<svg><use href="#icon-lock"/></svg>
GDPR Compliant
</span>
<span class="trust-badge">
<svg><use href="#icon-credit-card"/></svg>
Stripe Connect Verified
</span>
<span class="trust-badge">
<svg><use href="#icon-shield-check"/></svg>
Identity Verified
</span>
<span class="trust-badge">
<svg><use href="#icon-file-text"/></svg>
DAC7 Reporting
</span>
```
## Step 4: Deploy
```bash
aws s3 cp index.html s3://quixzoom-landing-prod/index.html
aws cloudfront create-invalidation --distribution-id YOUR_ID --paths "/*"
```
## Verification
- [ ] No emojis visible on quixzoom.com
- [ ] Icons render consistently across devices
- [ ] Colors match LandveX brand (#001E50, #C8763A)
- [ ] Mobile: icons scale correctly