chore(docs): replace SVG logo with image for improved performance and compatibility

This commit is contained in:
Julian Pawlowski 2025-12-06 01:57:44 +00:00
parent d71f3408b9
commit e79bc97321

View file

@ -33,15 +33,13 @@
}
.logo {
font-size: 120px;
margin-bottom: 20px;
position: relative;
display: inline-block;
}
.logo svg {
width: 120px;
height: 120px;
.logo img {
height: 60px;
filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1));
}
@ -155,34 +153,7 @@
<body>
<div class="container">
<div class="logo">
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<!-- Tibber lightning bolt inspired shape -->
<defs>
<linearGradient id="boltGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#00D4FF;stop-opacity:1" />
<stop offset="100%" style="stop-color:#0099CC;stop-opacity:1" />
</linearGradient>
<linearGradient id="priceGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#FFD700;stop-opacity:1" />
<stop offset="100%" style="stop-color:#FFA500;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Stylized lightning bolt (Tibber inspired) -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z" fill="url(#boltGradient)"
stroke="none" />
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGradient)" stroke="white" stroke-width="4" />
<!-- Currency symbols inside price tag -->
<text x="145" y="58" font-family="Arial, sans-serif" font-size="32" font-weight="bold" fill="white"
text-anchor="middle">€</text>
<!-- Small "T" from Tibber style at bottom -->
<text x="100" y="185" font-family="Arial, sans-serif" font-size="24" font-weight="bold" fill="#667eea"
text-anchor="middle">T</text>
</svg>
<img src="/hass.tibber_prices/user/img/header.svg" alt="Tibber Prices for Tibber" />
</div>
<h1>Tibber Prices Documentation</h1>
<p class="tagline">Custom Home Assistant Integration</p>