jpawlowski/hass.tibber_prices
1
0
Fork 0
mirror of https://github.com/jpawlowski/hass.tibber_prices.git synced 2026-03-29 21:03:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

chore: Update logo and icons for Tibber Prices Integration

Browse source
This commit is contained in:
Julian Pawlowski 2025-12-07 19:00:32 +00:00
parent 98512672ae
commit 4bd90ccdee
20 changed files with 566 additions and 374 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
docs/developer/docusaurus.config.ts
View file

@ -5,7 +5,7 @@ import type * as Preset from '@docusaurus/preset-classic';
const config: Config = {
title: 'Tibber Prices - Developer Guide',
tagline: 'Developer documentation for the Tibber Prices custom integration',
favicon: 'img/logo.svg',
favicon: 'img/icon.svg',
future: {
v4: true,
@ -139,7 +139,7 @@ const config: Config = {
title: 'Tibber Prices HA',
logo: {
alt: 'Tibber Prices Integration Logo',
src: 'img/logo.svg',
src: 'img/icon.svg',
},
items: [
{

108
docs/developer/static/img/header-dark.svg
View file

@ -14,61 +14,65 @@
</linearGradient>
</defs>
<g transform="translate(35, 50) scale(0.25)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Centered content group -->
<g transform="translate(67, 0)">
<g transform="translate(5, 20) scale(0.38)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Euro symbol -->
<text x="145" y="58"
<!-- Euro symbol -->
<text x="145" y="53"
font-family="Arial, sans-serif"
font-size="32"
font-weight="bold"
fill="white"
text-anchor="middle"
dominant-baseline="middle">€</text>
</g>
<!-- Integration Name (light text for dark mode) -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="32"
font-size="24"
font-weight="700"
fill="#E8E8E8">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#B0B0B0">Custom Integration</text>
<!-- Vertical Divider (lighter) -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#666666"
stroke-width="2"/>
<!-- "for" text (lighter) -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#B0B0B0">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text (light text for dark mode) -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="white"
text-anchor="middle">€</text>
fill="#E8E8E8">Tibber</text>
</g>
<!-- Integration Name (light text for dark mode) -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="24"
font-weight="700"
fill="#E8E8E8">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#B0B0B0">Custom Integration</text>
<!-- Vertical Divider (lighter) -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#666666"
stroke-width="2"/>
<!-- "for" text (lighter) -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#888888">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text (light text for dark mode) -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="#E8E8E8">Tibber</text>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

108
docs/developer/static/img/header.svg
View file

@ -14,61 +14,65 @@
</linearGradient>
</defs>
<g transform="translate(35, 50) scale(0.25)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Centered content group -->
<g transform="translate(67, 0)">
<g transform="translate(5, 20) scale(0.38)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Euro symbol -->
<text x="145" y="58"
<!-- Euro symbol -->
<text x="145" y="53"
font-family="Arial, sans-serif"
font-size="32"
font-weight="bold"
fill="white"
text-anchor="middle"
dominant-baseline="middle">€</text>
</g>
<!-- Integration Name -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="32"
font-size="24"
font-weight="700"
fill="#333333">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#666666">Custom Integration</text>
<!-- Vertical Divider -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#CCCCCC"
stroke-width="2"/>
<!-- "for" text -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#666666">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="white"
text-anchor="middle">€</text>
fill="#333333">Tibber</text>
</g>
<!-- Integration Name -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="24"
font-weight="700"
fill="#333333">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#666666">Custom Integration</text>
<!-- Vertical Divider -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#CCCCCC"
stroke-width="2"/>
<!-- "for" text -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#999999">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="#333333">Tibber</text>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB

17
docs/developer/static/img/icon.svg Normal file
View file

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;">
<g transform="matrix(1.26852,0,0,1.26852,-59.3148,-2.02778)">
<g>
<path d="M100,20L70,90L100,85L80,150L140,80L110,85L100,20Z" style="fill:url(#_Linear1);fill-rule:nonzero;"/>
<circle cx="145" cy="50" r="35" style="fill:url(#_Linear2);stroke:white;stroke-width:4px;"/>
<g transform="matrix(1,0,0,1,143.018,60.8601)">
<text x="-11.906px" y="0px" style="font-family:'Helvetica-Bold', 'Helvetica';font-weight:700;font-size:32px;fill:white;">€</text>
</g>
</g>
</g>
<defs>
<linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,130,-130,70,70,20)"><stop offset="0" style="stop-color:rgb(0,212,255);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(0,153,204);stop-opacity:1"/></linearGradient>
<linearGradient id="_Linear2" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,70,-70,70,110,15)"><stop offset="0" style="stop-color:rgb(255,215,0);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(255,165,0);stop-opacity:1"/></linearGradient>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
docs/developer/static/img/logo.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 9.4 KiB

29
docs/developer/static/img/logo.svg
View file

@ -1,29 +0,0 @@
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<!-- Tibber Prices Logo: Lightning bolt + Price tag + T -->
<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 symbol 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>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.2 KiB

4
docs/user/docusaurus.config.ts
View file

@ -5,7 +5,7 @@ import type * as Preset from '@docusaurus/preset-classic';
const config: Config = {
title: 'Tibber Prices Integration',
tagline: 'Custom Home Assistant integration for Tibber electricity prices',
favicon: 'img/logo.svg',
favicon: 'img/icon.svg',
future: {
v4: true,
@ -139,7 +139,7 @@ const config: Config = {
title: 'Tibber Prices HA',
logo: {
alt: 'Tibber Prices Integration Logo',
src: 'img/logo.svg',
src: 'img/icon.svg',
},
items: [
{

108
docs/user/static/img/header-dark.svg
View file

@ -14,61 +14,65 @@
</linearGradient>
</defs>
<g transform="translate(35, 50) scale(0.25)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Centered content group -->
<g transform="translate(67, 0)">
<g transform="translate(5, 20) scale(0.38)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Euro symbol -->
<text x="145" y="58"
<!-- Euro symbol -->
<text x="145" y="53"
font-family="Arial, sans-serif"
font-size="32"
font-weight="bold"
fill="white"
text-anchor="middle"
dominant-baseline="middle">€</text>
</g>
<!-- Integration Name (light text for dark mode) -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="32"
font-size="24"
font-weight="700"
fill="#E8E8E8">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#B0B0B0">Custom Integration</text>
<!-- Vertical Divider (lighter) -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#666666"
stroke-width="2"/>
<!-- "for" text (lighter) -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#B0B0B0">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text (light text for dark mode) -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="white"
text-anchor="middle">€</text>
fill="#E8E8E8">Tibber</text>
</g>
<!-- Integration Name (light text for dark mode) -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="24"
font-weight="700"
fill="#E8E8E8">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#B0B0B0">Custom Integration</text>
<!-- Vertical Divider (lighter) -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#666666"
stroke-width="2"/>
<!-- "for" text (lighter) -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#888888">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text (light text for dark mode) -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="#E8E8E8">Tibber</text>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

108
docs/user/static/img/header.svg
View file

@ -14,61 +14,65 @@
</linearGradient>
</defs>
<g transform="translate(35, 50) scale(0.25)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Centered content group -->
<g transform="translate(67, 0)">
<g transform="translate(5, 20) scale(0.38)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Euro symbol -->
<text x="145" y="58"
<!-- Euro symbol -->
<text x="145" y="53"
font-family="Arial, sans-serif"
font-size="32"
font-weight="bold"
fill="white"
text-anchor="middle"
dominant-baseline="middle">€</text>
</g>
<!-- Integration Name -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="32"
font-size="24"
font-weight="700"
fill="#333333">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#666666">Custom Integration</text>
<!-- Vertical Divider -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#CCCCCC"
stroke-width="2"/>
<!-- "for" text -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#666666">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="white"
text-anchor="middle">€</text>
fill="#333333">Tibber</text>
</g>
<!-- Integration Name -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="24"
font-weight="700"
fill="#333333">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#666666">Custom Integration</text>
<!-- Vertical Divider -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#CCCCCC"
stroke-width="2"/>
<!-- "for" text -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#999999">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="#333333">Tibber</text>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB

17
docs/user/static/img/icon.svg Normal file
View file

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;">
<g transform="matrix(1.26852,0,0,1.26852,-59.3148,-2.02778)">
<g>
<path d="M100,20L70,90L100,85L80,150L140,80L110,85L100,20Z" style="fill:url(#_Linear1);fill-rule:nonzero;"/>
<circle cx="145" cy="50" r="35" style="fill:url(#_Linear2);stroke:white;stroke-width:4px;"/>
<g transform="matrix(1,0,0,1,143.018,60.8601)">
<text x="-11.906px" y="0px" style="font-family:'Helvetica-Bold', 'Helvetica';font-weight:700;font-size:32px;fill:white;">€</text>
</g>
</g>
</g>
<defs>
<linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,130,-130,70,70,20)"><stop offset="0" style="stop-color:rgb(0,212,255);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(0,153,204);stop-opacity:1"/></linearGradient>
<linearGradient id="_Linear2" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,70,-70,70,110,15)"><stop offset="0" style="stop-color:rgb(255,215,0);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(255,165,0);stop-opacity:1"/></linearGradient>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
docs/user/static/img/logo.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 9.4 KiB

29
docs/user/static/img/logo.svg
View file

@ -1,29 +0,0 @@
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<!-- Tibber Prices Logo: Lightning bolt + Price tag + T -->
<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 symbol 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>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.2 KiB

19
images/dark_icon.svg Normal file
View file

@ -0,0 +1,19 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;">
<rect x="0" y="0" width="200" height="200" style="fill:url(#_Linear1);"/>
<g transform="matrix(1.26852,0,0,1.26852,-59.3148,-2.02778)">
<g>
<path d="M100,20L70,90L100,85L80,150L140,80L110,85L100,20Z" style="fill:url(#_Linear2);fill-rule:nonzero;"/>
<circle cx="145" cy="50" r="35" style="fill:url(#_Linear3);stroke:white;stroke-width:4px;"/>
<g transform="matrix(1,0,0,1,143.018,60.8601)">
<text x="-11.906px" y="0px" style="font-family:'Helvetica-Bold', 'Helvetica';font-weight:700;font-size:32px;fill:white;">€</text>
</g>
</g>
</g>
<defs>
<linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(200,200,-200,200,0,0)"><stop offset="0" style="stop-color:rgb(0,212,255);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(0,153,204);stop-opacity:1"/></linearGradient>
<linearGradient id="_Linear2" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,130,-130,70,70,20)"><stop offset="0" style="stop-color:white;stop-opacity:1"/><stop offset="0.31" style="stop-color:rgb(246,246,246);stop-opacity:1"/><stop offset="0.41" style="stop-color:rgb(224,224,224);stop-opacity:1"/><stop offset="0.49" style="stop-color:rgb(200,200,200);stop-opacity:1"/><stop offset="0.58" style="stop-color:rgb(224,224,224);stop-opacity:1"/><stop offset="0.68" style="stop-color:rgb(246,246,246);stop-opacity:1"/><stop offset="1" style="stop-color:white;stop-opacity:1"/></linearGradient>
<linearGradient id="_Linear3" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,70,-70,70,110,15)"><stop offset="0" style="stop-color:rgb(255,215,0);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(255,165,0);stop-opacity:1"/></linearGradient>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.2 KiB

29
images/dark_logo.svg Normal file
View file

@ -0,0 +1,29 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 400 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;">
<g transform="matrix(1.1242,0,0,1.1242,103.468,63.1904)">
<text x="0px" y="0px" style="font-family:'Helvetica-Bold', 'Helvetica';font-weight:700;font-size:42px;fill:rgb(232,232,232);">T<tspan x="24.917px 36.586px " y="0px 0px ">ib</tspan>ber Prices</text>
</g>
<g transform="matrix(1,0,0,1,120,90)">
<g transform="matrix(1.1242,0,0,1.1242,112.968,1.29547)">
<text x="0px" y="0px" style="font-family:'Helvetica';font-size:14px;fill:rgb(153,153,153);">powered by</text>
</g>
<g transform="matrix(0.417583,0,0,0.417583,218.162,-1.31861)">
<path d="M0,-30L-15,5L0,0L-8,25L18,-5L5,0L0,-30Z" style="fill:rgb(51,224,255);fill-rule:nonzero;"/>
</g>
<g transform="matrix(1.1242,0,0,1.1242,225.388,1.29547)">
<text x="0px" y="0px" style="font-family:'Helvetica-Bold', 'Helvetica';font-weight:700;font-size:16px;fill:rgb(232,232,232);">T<tspan x="9.492px 13.938px " y="0px 0px ">ib</tspan>ber</text>
</g>
</g>
<g transform="matrix(0.888889,0,0,0.888889,-62.2222,-9.33333)">
<path d="M100,20L70,90L100,85L80,150L140,80L110,85L100,20Z" style="fill:url(#_Linear1);fill-rule:nonzero;"/>
<circle cx="145" cy="50" r="35" style="fill:url(#_Linear2);stroke:white;stroke-width:4px;"/>
<g transform="matrix(1,0,0,1,143.018,60.8601)">
<text x="-11.906px" y="0px" style="font-family:'Helvetica-Bold', 'Helvetica';font-weight:700;font-size:32px;fill:white;">€</text>
</g>
</g>
<defs>
<linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,130,-130,70,70,20)"><stop offset="0" style="stop-color:rgb(0,212,255);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(0,153,204);stop-opacity:1"/></linearGradient>
<linearGradient id="_Linear2" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,70,-70,70,110,15)"><stop offset="0" style="stop-color:rgb(255,215,0);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(255,165,0);stop-opacity:1"/></linearGradient>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.5 KiB

108
images/header-dark.svg
View file

@ -14,61 +14,65 @@
</linearGradient>
</defs>
<g transform="translate(35, 50) scale(0.25)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Centered content group -->
<g transform="translate(67, 0)">
<g transform="translate(5, 20) scale(0.38)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Euro symbol -->
<text x="145" y="58"
<!-- Euro symbol -->
<text x="145" y="53"
font-family="Arial, sans-serif"
font-size="32"
font-weight="bold"
fill="white"
text-anchor="middle"
dominant-baseline="middle">€</text>
</g>
<!-- Integration Name (light text for dark mode) -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="32"
font-size="24"
font-weight="700"
fill="#E8E8E8">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#B0B0B0">Custom Integration</text>
<!-- Vertical Divider (lighter) -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#666666"
stroke-width="2"/>
<!-- "for" text (lighter) -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#B0B0B0">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text (light text for dark mode) -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="white"
text-anchor="middle">€</text>
fill="#E8E8E8">Tibber</text>
</g>
<!-- Integration Name (light text for dark mode) -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="24"
font-weight="700"
fill="#E8E8E8">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#B0B0B0">Custom Integration</text>
<!-- Vertical Divider (lighter) -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#666666"
stroke-width="2"/>
<!-- "for" text (lighter) -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#888888">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text (light text for dark mode) -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="#E8E8E8">Tibber</text>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

108
images/header.svg
View file

@ -14,61 +14,65 @@
</linearGradient>
</defs>
<g transform="translate(35, 50) scale(0.25)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Centered content group -->
<g transform="translate(67, 0)">
<g transform="translate(5, 20) scale(0.38)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Euro symbol -->
<text x="145" y="58"
<!-- Euro symbol -->
<text x="145" y="53"
font-family="Arial, sans-serif"
font-size="32"
font-weight="bold"
fill="white"
text-anchor="middle"
dominant-baseline="middle">€</text>
</g>
<!-- Integration Name -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="32"
font-size="24"
font-weight="700"
fill="#777777">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#777777">Custom Integration</text>
<!-- Vertical Divider -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#999999"
stroke-width="2"/>
<!-- "for" text -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#777777">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="white"
text-anchor="middle">€</text>
fill="#777777">Tibber</text>
</g>
<!-- Integration Name -->
<text x="90" y="45"
font-family="Arial, sans-serif"
font-size="24"
font-weight="700"
fill="#333333">Tibber Prices</text>
<text x="90" y="65"
font-family="Arial, sans-serif"
font-size="12"
font-weight="normal"
fill="#666666">Custom Integration</text>
<!-- Vertical Divider -->
<line x1="270" y1="25" x2="270" y2="75"
stroke="#CCCCCC"
stroke-width="2"/>
<!-- "for" text -->
<text x="290" y="55"
font-family="Arial, sans-serif"
font-size="14"
font-weight="normal"
fill="#999999">for</text>
<!-- Tibber Logo (right side - simplified) -->
<g transform="translate(335, 50)">
<!-- Lightning bolt symbol -->
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text -->
<text x="365" y="58"
font-family="Arial, sans-serif"
font-size="28"
font-weight="bold"
fill="#333333">Tibber</text>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB

17
images/icon.svg Normal file
View file

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;">
<g transform="matrix(1.26852,0,0,1.26852,-59.3148,-2.02778)">
<g>
<path d="M100,20L70,90L100,85L80,150L140,80L110,85L100,20Z" style="fill:url(#_Linear1);fill-rule:nonzero;"/>
<circle cx="145" cy="50" r="35" style="fill:url(#_Linear2);stroke:white;stroke-width:4px;"/>
<g transform="matrix(1,0,0,1,143.018,60.8601)">
<text x="-11.906px" y="0px" style="font-family:'Helvetica-Bold', 'Helvetica';font-weight:700;font-size:32px;fill:white;">€</text>
</g>
</g>
</g>
<defs>
<linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,130,-130,70,70,20)"><stop offset="0" style="stop-color:rgb(0,212,255);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(0,153,204);stop-opacity:1"/></linearGradient>
<linearGradient id="_Linear2" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,70,-70,70,110,15)"><stop offset="0" style="stop-color:rgb(255,215,0);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(255,165,0);stop-opacity:1"/></linearGradient>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
images/logo.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 9.4 KiB

29
images/logo.svg Normal file
View file

@ -0,0 +1,29 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 400 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;">
<g transform="matrix(1.1242,0,0,1.1242,103.468,63.1904)">
<text x="0px" y="0px" style="font-family:'Helvetica-Bold', 'Helvetica';font-weight:700;font-size:42px;fill:rgb(119,119,119);">T<tspan x="24.917px 36.586px " y="0px 0px ">ib</tspan>ber Prices</text>
</g>
<g transform="matrix(1,0,0,1,120,90)">
<g transform="matrix(1.1242,0,0,1.1242,112.968,1.29547)">
<text x="0px" y="0px" style="font-family:'Helvetica';font-size:14px;fill:rgb(153,153,153);">powered by</text>
</g>
<g transform="matrix(0.417583,0,0,0.417583,218.162,-1.31861)">
<path d="M0,-30L-15,5L0,0L-8,25L18,-5L5,0L0,-30Z" style="fill:rgb(51,224,255);fill-rule:nonzero;"/>
</g>
<g transform="matrix(1.1242,0,0,1.1242,225.388,1.29547)">
<text x="0px" y="0px" style="font-family:'Helvetica-Bold', 'Helvetica';font-weight:700;font-size:16px;fill:rgb(119,119,119);">T<tspan x="9.492px 13.938px " y="0px 0px ">ib</tspan>ber</text>
</g>
</g>
<g transform="matrix(0.888889,0,0,0.888889,-62.2222,-9.33333)">
<path d="M100,20L70,90L100,85L80,150L140,80L110,85L100,20Z" style="fill:url(#_Linear1);fill-rule:nonzero;"/>
<circle cx="145" cy="50" r="35" style="fill:url(#_Linear2);stroke:white;stroke-width:4px;"/>
<g transform="matrix(1,0,0,1,143.018,60.8601)">
<text x="-11.906px" y="0px" style="font-family:'Helvetica-Bold', 'Helvetica';font-weight:700;font-size:32px;fill:white;">€</text>
</g>
</g>
<defs>
<linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,130,-130,70,70,20)"><stop offset="0" style="stop-color:rgb(0,212,255);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(0,153,204);stop-opacity:1"/></linearGradient>
<linearGradient id="_Linear2" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(70,70,-70,70,110,15)"><stop offset="0" style="stop-color:rgb(255,215,0);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(255,165,0);stop-opacity:1"/></linearGradient>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.5 KiB

98
images/social-preview.svg Normal file
View file

@ -0,0 +1,98 @@
<svg viewBox="0 0 1280 640" xmlns="http://www.w3.org/2000/svg">
<!-- Social Preview for GitHub - 1280x640px -->
<!-- Background with subtle gradient -->
<defs>
<linearGradient id="bgGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#FFFFFF;stop-opacity:1" />
<stop offset="100%" style="stop-color:#E3E8ED;stop-opacity:1" />
</linearGradient>
<linearGradient id="boltGrad" 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="priceGrad" 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>
<!-- Background -->
<rect width="1280" height="640" fill="url(#bgGradient)"/>
<!-- Centered content group -->
<g transform="translate(640, 320)">
<!-- Custom Integration Logo (scaled larger for social preview) -->
<g transform="translate(-380, -100) scale(0.8)">
<!-- Lightning bolt -->
<path d="M 100 20 L 70 90 L 100 85 L 80 150 L 140 80 L 110 85 Z"
fill="url(#boltGrad)"
stroke="none"/>
<!-- Price tag circle -->
<circle cx="145" cy="50" r="35" fill="url(#priceGrad)" stroke="white" stroke-width="4"/>
<!-- Euro symbol -->
<text x="145" y="53"
font-family="Arial, sans-serif"
font-size="32"
font-weight="bold"
fill="white"
text-anchor="middle"
dominant-baseline="middle">€</text>
</g>
<!-- Main Title -->
<text x="0" y="-40"
font-family="Arial, sans-serif"
font-size="72"
font-weight="700"
fill="#333333"
text-anchor="middle">Tibber Prices</text>
<!-- Subtitle -->
<text x="0" y="20"
font-family="Arial, sans-serif"
font-size="32"
font-weight="normal"
fill="#666666"
text-anchor="middle">Custom Integration for Home Assistant</text>
<!-- Divider line -->
<line x1="-200" y1="60" x2="200" y2="60"
stroke="#999999"
stroke-width="2"/>
<!-- Description -->
<text x="0" y="110"
font-family="Arial, sans-serif"
font-size="24"
font-weight="normal"
fill="#777777"
text-anchor="middle">Quarter-hourly electricity prices with advanced analytics</text>
<!-- Tibber Logo reference (right bottom corner) -->
<g transform="translate(450, 150)">
<text x="0" y="0"
font-family="Arial, sans-serif"
font-size="20"
font-weight="normal"
fill="#999999"
text-anchor="end">powered by</text>
<!-- Small Tibber bolt -->
<g transform="translate(25, -5) scale(0.4)">
<path d="M 0 -30 L -15 5 L 0 0 L -8 25 L 18 -5 L 5 0 Z"
fill="#00D4FF"
stroke="none"/>
</g>
<!-- Tibber Text -->
<text x="50" y="0"
font-family="Arial, sans-serif"
font-size="24"
font-weight="bold"
fill="#333333">Tibber</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.6 KiB