fegger/time_to_leave
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Update logo assets and pin React 19.1.0 versions

Browse Source 
Add new SVG icon and logo variations for web app. Revert React
and React DOM to 19.1.0 to align with type definitions and
overrides. Remove privacy policy URL from mobile config and
disable hierarchical lookup in Metro bundler.
Pin React to 19.1.0 and add new logo assets
This commit is contained in:
Florian Egger
2026-05-13 17:05:22 +02:00
parent d0e61ebdb0
commit 6c7d57106c
9 changed files with 516 additions and 1793 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/mobile/package.json
+2 -2
View File
@@ -32,8 +32,8 @@
"devDependencies": {
"@eslint/js": "^9.39.4",
"@testing-library/react-native": "^13.3.3",
"@types/jest": "^30.0.0",
"@types/react": "^19",
"@types/jest": "29.5.14",
"@types/react": "~19.1.10",
"eslint-plugin-react": "^7.37.5",
"jest": "^29.7.0",
"jest-expo": "~54.0.0",
apps/web/package.json
+4 -4
View File
@@ -17,8 +17,8 @@
"date-fns": "^4.1.0",
"next": "^16.2.6",
"node-ical": "^0.26.1",
"react": "19.2.4",
"react-dom": "19.2.4"
"react": "19.1.0",
"react-dom": "19.1.0"
},
"devDependencies": {
"@tailwindcss/postcss": "^4",
@@ -26,8 +26,8 @@
"@testing-library/dom": "^10.4.1",
"@testing-library/react": "^16.3.2",
"@types/node": "^20",
"@types/react": "^19",
"@types/react-dom": "^19",
"@types/react": "~19.1.10",
"@types/react-dom": "~19.1.10",
"@vitejs/plugin-react": "^6.0.1",
"eslint": "^9",
"eslint-config-next": "16.2.6",
apps/web/public/icon.svg
+45
View File
@@ -0,0 +1,45 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" role="img" aria-label="TimeToLeave">
<defs>
<linearGradient id="g" x1="280" y1="210" x2="900" y2="720" gradientUnits="userSpaceOnUse">
<stop offset="0%" stop-color="#8B5CF6"/>
<stop offset="42%" stop-color="#B23CFF"/>
<stop offset="72%" stop-color="#D946EF"/>
<stop offset="100%" stop-color="#FF2D8D"/>
</linearGradient>
<filter id="glow" x="-35%" y="-35%" width="170%" height="170%">
<feGaussianBlur stdDeviation="8" result="blur"/>
<feColorMatrix in="blur" type="matrix"
values="0.72 0 0 0 0.26 0 0.18 0 0 0.92 0 0 0.34 0 1 0 0 0 0.32 0"
result="glow"/>
<feMerge><feMergeNode in="glow"/><feMergeNode in="SourceGraphic"/></feMerge>
</filter>
</defs>
<rect width="512" height="512" rx="110" fill="#0A0816"/>
<g filter="url(#glow)" transform="matrix(0.639 0 0 0.639 -173.4 -69.2)">
<path d="M334 552 C324 498 335 437 370 388 C415 324 486 290 562 293 C660 297 744 372 758 471 C763 508 758 541 753 565 C748 589 756 610 779 622 C808 637 810 594 832 590 C855 586 860 620 851 644 C842 669 824 682 803 678"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M334 552 C322 588 331 622 365 628 C395 633 386 581 415 580 C447 579 441 641 475 641 C510 641 506 585 544 585 C579 585 571 651 604 670 C650 697 733 695 797 657"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M475 641 C472 690 474 724 489 724 C506 724 506 690 509 651"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round"/>
<path d="M797 657 C830 639 862 624 898 615"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round"/>
<path d="M882 572 L1010 620 L904 708 L917 650 Z" fill="#FF2D8D"/>
<ellipse cx="505" cy="725" rx="17" ry="26" fill="#B23CFF"/>
<g stroke="#F4F1EA" stroke-linecap="round" opacity="0.96">
<line x1="556" y1="334" x2="556" y2="360" stroke-width="15"/>
<line x1="694" y1="391" x2="716" y2="378" stroke-width="15"/>
<line x1="733" y1="526" x2="762" y2="526" stroke-width="15"/>
<line x1="405" y1="655" x2="425" y2="633" stroke-width="15"/>
<line x1="362" y1="526" x2="390" y2="526" stroke-width="15"/>
<line x1="405" y1="398" x2="425" y2="420" stroke-width="15"/>
<line x1="658" y1="420" x2="671" y2="398" stroke-width="15"/>
<line x1="556" y1="526" x2="556" y2="405" stroke-width="19"/>
<line x1="556" y1="526" x2="665" y2="590" stroke-width="19"/>
</g>
<circle cx="556" cy="526" r="25" fill="#F4F1EA"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

apps/web/public/timetoleave_logo.svg
+57
View File
@@ -0,0 +1,57 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" role="img" aria-label="TimeToLeave">
<defs>
<linearGradient id="g" x1="280" y1="210" x2="900" y2="720" gradientUnits="userSpaceOnUse">
<stop offset="0%" stop-color="#8B5CF6"/>
<stop offset="42%" stop-color="#B23CFF"/>
<stop offset="72%" stop-color="#D946EF"/>
<stop offset="100%" stop-color="#FF2D8D"/>
</linearGradient>
<linearGradient id="tg" x1="228" y1="368" x2="295" y2="428" gradientUnits="userSpaceOnUse">
<stop offset="0%" stop-color="#B23CFF"/>
<stop offset="100%" stop-color="#FF2D8D"/>
</linearGradient>
<filter id="glow" x="-35%" y="-35%" width="170%" height="170%">
<feGaussianBlur stdDeviation="8" result="blur"/>
<feColorMatrix in="blur" type="matrix"
values="0.72 0 0 0 0.26 0 0.18 0 0 0.92 0 0 0.34 0 1 0 0 0 0.32 0"
result="glow"/>
<feMerge><feMergeNode in="glow"/><feMergeNode in="SourceGraphic"/></feMerge>
</filter>
</defs>
<rect width="512" height="512" fill="#0A0816"/>
<!-- Mark centred in top portion -->
<g filter="url(#glow)" transform="matrix(0.579 0 0 0.579 -133.1 -109.7)">
<path d="M334 552 C324 498 335 437 370 388 C415 324 486 290 562 293 C660 297 744 372 758 471 C763 508 758 541 753 565 C748 589 756 610 779 622 C808 637 810 594 832 590 C855 586 860 620 851 644 C842 669 824 682 803 678"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M334 552 C322 588 331 622 365 628 C395 633 386 581 415 580 C447 579 441 641 475 641 C510 641 506 585 544 585 C579 585 571 651 604 670 C650 697 733 695 797 657"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M475 641 C472 690 474 724 489 724 C506 724 506 690 509 651"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round"/>
<path d="M797 657 C830 639 862 624 898 615"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round"/>
<path d="M882 572 L1010 620 L904 708 L917 650 Z" fill="#FF2D8D"/>
<ellipse cx="505" cy="725" rx="17" ry="26" fill="#B23CFF"/>
<g stroke="#F4F1EA" stroke-linecap="round" opacity="0.96">
<line x1="556" y1="334" x2="556" y2="360" stroke-width="15"/>
<line x1="694" y1="391" x2="716" y2="378" stroke-width="15"/>
<line x1="733" y1="526" x2="762" y2="526" stroke-width="15"/>
<line x1="405" y1="655" x2="425" y2="633" stroke-width="15"/>
<line x1="362" y1="526" x2="390" y2="526" stroke-width="15"/>
<line x1="405" y1="398" x2="425" y2="420" stroke-width="15"/>
<line x1="658" y1="420" x2="671" y2="398" stroke-width="15"/>
<line x1="556" y1="526" x2="556" y2="405" stroke-width="19"/>
<line x1="556" y1="526" x2="665" y2="590" stroke-width="19"/>
</g>
<circle cx="556" cy="526" r="25" fill="#F4F1EA"/>
</g>
<!-- "TimeToLeave" text centred below mark -->
<g font-family="Inter, 'Segoe UI', system-ui, Arial, sans-serif" font-size="64" font-weight="800">
<text x="90" y="420" fill="#F4F1EA">Time</text>
<text x="228" y="420" fill="url(#tg)">To</text>
<text x="294" y="420" fill="#F4F1EA">Leave</text>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.2 KiB

apps/web/public/timetoleave_logo_text_right.svg
+53
View File
@@ -0,0 +1,53 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 214 58" role="img" aria-label="TimeToLeave">
<defs>
<linearGradient id="g" x1="280" y1="210" x2="900" y2="720" gradientUnits="userSpaceOnUse">
<stop offset="0%" stop-color="#8B5CF6"/>
<stop offset="42%" stop-color="#B23CFF"/>
<stop offset="72%" stop-color="#D946EF"/>
<stop offset="100%" stop-color="#FF2D8D"/>
</linearGradient>
<linearGradient id="tg" x1="116" y1="17" x2="155" y2="43" gradientUnits="userSpaceOnUse">
<stop offset="0%" stop-color="#B23CFF"/>
<stop offset="100%" stop-color="#FF2D8D"/>
</linearGradient>
<filter id="glow" x="-35%" y="-35%" width="170%" height="170%">
<feGaussianBlur stdDeviation="1.6" result="blur"/>
<feColorMatrix in="blur" type="matrix"
values="0.72 0 0 0 0.26 0 0.18 0 0 0.92 0 0 0.34 0 1 0 0 0 0.32 0"
result="glow"/>
<feMerge><feMergeNode in="glow"/><feMergeNode in="SourceGraphic"/></feMerge>
</filter>
</defs>
<g filter="url(#glow)" transform="matrix(0.108 0 0 0.108 -31.6 -27.7)">
<path d="M334 552 C324 498 335 437 370 388 C415 324 486 290 562 293 C660 297 744 372 758 471 C763 508 758 541 753 565 C748 589 756 610 779 622 C808 637 810 594 832 590 C855 586 860 620 851 644 C842 669 824 682 803 678"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M334 552 C322 588 331 622 365 628 C395 633 386 581 415 580 C447 579 441 641 475 641 C510 641 506 585 544 585 C579 585 571 651 604 670 C650 697 733 695 797 657"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M475 641 C472 690 474 724 489 724 C506 724 506 690 509 651"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round"/>
<path d="M797 657 C830 639 862 624 898 615"
fill="none" stroke="url(#g)" stroke-width="42" stroke-linecap="round"/>
<path d="M882 572 L1010 620 L904 708 L917 650 Z" fill="#FF2D8D"/>
<ellipse cx="505" cy="725" rx="17" ry="26" fill="#B23CFF"/>
<g stroke="#F4F1EA" stroke-linecap="round" opacity="0.96">
<line x1="556" y1="334" x2="556" y2="360" stroke-width="15"/>
<line x1="694" y1="391" x2="716" y2="378" stroke-width="15"/>
<line x1="733" y1="526" x2="762" y2="526" stroke-width="15"/>
<line x1="405" y1="655" x2="425" y2="633" stroke-width="15"/>
<line x1="362" y1="526" x2="390" y2="526" stroke-width="15"/>
<line x1="405" y1="398" x2="425" y2="420" stroke-width="15"/>
<line x1="658" y1="420" x2="671" y2="398" stroke-width="15"/>
<line x1="556" y1="526" x2="556" y2="405" stroke-width="19"/>
<line x1="556" y1="526" x2="665" y2="590" stroke-width="19"/>
</g>
<circle cx="556" cy="526" r="25" fill="#F4F1EA"/>
</g>
<g font-family="Inter, 'Segoe UI', system-ui, Arial, sans-serif" font-size="26" font-weight="800">
<text x="83" y="37" fill="#F4F1EA">Time</text>
<text x="139" y="37" fill="url(#tg)">To</text>
<text x="166" y="37" fill="#F4F1EA">Leave</text>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.0 KiB

apps/web/src/app/ui/LogoIcon.tsx
+49 -52
View File
@@ -1,3 +1,5 @@
import { useId } from "react";
export default function LogoIcon({
size = 48,
className = "",
@@ -5,6 +7,10 @@ export default function LogoIcon({
size?: number;
className?: string;
}) {
const id = useId();
const gradId = `${id}-g`;
const filterId = `${id}-glow`;
return (
<svg
xmlns="http://www.w3.org/2000/svg"
@@ -13,72 +19,63 @@ export default function LogoIcon({
height={size}
className={className}
aria-label="TimeToLeave logo"
role="img"
>
<defs>
<linearGradient
id="ttt-iconMelt"
x1="100"
y1="80"
x2="420"
y2="430"
gradientUnits="userSpaceOnUse"
>
<linearGradient id={gradId} x1="280" y1="210" x2="900" y2="720" gradientUnits="userSpaceOnUse">
<stop offset="0%" stopColor="#8B5CF6" />
<stop offset="40%" stopColor="#B23CFF" />
<stop offset="42%" stopColor="#B23CFF" />
<stop offset="72%" stopColor="#D946EF" />
<stop offset="100%" stopColor="#FF2D8D" />
</linearGradient>
<filter id={filterId} x="-35%" y="-35%" width="170%" height="170%">
<feGaussianBlur stdDeviation="8" result="blur" />
<feColorMatrix
in="blur"
type="matrix"
values="0.72 0 0 0 0.26 0 0.18 0 0 0.92 0 0 0.34 0 1 0 0 0 0.32 0"
result="glow"
/>
<feMerge>
<feMergeNode in="glow" />
<feMergeNode in="SourceGraphic" />
</feMerge>
</filter>
</defs>
{/* Melting clock outline */}
<g>
<g filter={`url(#${filterId})`} transform="matrix(0.639 0 0 0.639 -173.4 -69.2)">
<path
d="M160,310 C150,280 160,240 180,210 C210,160 260,140 310,145 C370,150 420,210 430,280 C435,310 430,340 425,360 C420,380 430,400 450,410 C470,420 475,380 495,375 C510,370 520,410 505,440 C495,460 480,470 460,465"
fill="none"
stroke="url(#ttt-iconMelt)"
strokeWidth="28"
strokeLinecap="round"
strokeLinejoin="round"
/>
{/* Melting drip */}
<path
d="M290,465 C288,490 290,510 300,510 C312,510 310,490 315,465"
fill="none"
stroke="url(#ttt-iconMelt)"
strokeWidth="28"
strokeLinecap="round"
/>
{/* Flowing arrow */}
<path
d="M460,465 C480,450 500,435 520,425"
fill="none"
stroke="url(#ttt-iconMelt)"
strokeWidth="28"
strokeLinecap="round"
d="M334 552 C324 498 335 437 370 388 C415 324 486 290 562 293 C660 297 744 372 758 471 C763 508 758 541 753 565 C748 589 756 610 779 622 C808 637 810 594 832 590 C855 586 860 620 851 644 C842 669 824 682 803 678"
fill="none" stroke={`url(#${gradId})`} strokeWidth="42" strokeLinecap="round" strokeLinejoin="round"
/>
<path
d="M500,400 L540,420 L490,455 L500,430 Z"
fill="#FF2D8D"
d="M334 552 C322 588 331 622 365 628 C395 633 386 581 415 580 C447 579 441 641 475 641 C510 641 506 585 544 585 C579 585 571 651 604 670 C650 697 733 695 797 657"
fill="none" stroke={`url(#${gradId})`} strokeWidth="42" strokeLinecap="round" strokeLinejoin="round"
/>
</g>
<path
d="M475 641 C472 690 474 724 489 724 C506 724 506 690 509 651"
fill="none" stroke={`url(#${gradId})`} strokeWidth="42" strokeLinecap="round"
/>
<path
d="M797 657 C830 639 862 624 898 615"
fill="none" stroke={`url(#${gradId})`} strokeWidth="42" strokeLinecap="round"
/>
<path d="M882 572 L1010 620 L904 708 L917 650 Z" fill="#FF2D8D" />
<ellipse cx="505" cy="725" rx="17" ry="26" fill="#B23CFF" />
{/* Clock ticks */}
<g stroke="#F4F1EA" strokeWidth="10" strokeLinecap="round" opacity="0.96">
<line x1="290" y1="180" x2="290" y2="200" />
<line x1="370" y1="220" x2="385" y2="210" />
<line x1="400" y1="310" x2="420" y2="310" />
<line x1="290" y1="400" x2="290" y2="420" />
<line x1="200" y1="390" x2="215" y2="375" />
<line x1="170" y1="310" x2="190" y2="310" />
<line x1="200" y1="230" x2="215" y2="245" />
<g stroke="currentColor" strokeLinecap="round" opacity="0.96">
<line x1="556" y1="334" x2="556" y2="360" strokeWidth="15" />
<line x1="694" y1="391" x2="716" y2="378" strokeWidth="15" />
<line x1="733" y1="526" x2="762" y2="526" strokeWidth="15" />
<line x1="405" y1="655" x2="425" y2="633" strokeWidth="15" />
<line x1="362" y1="526" x2="390" y2="526" strokeWidth="15" />
<line x1="405" y1="398" x2="425" y2="420" strokeWidth="15" />
<line x1="658" y1="420" x2="671" y2="398" strokeWidth="15" />
<line x1="556" y1="526" x2="556" y2="405" strokeWidth="19" />
<line x1="556" y1="526" x2="665" y2="590" strokeWidth="19" />
</g>
<circle cx="556" cy="526" r="25" fill="currentColor" />
</g>
{/* Clock hands — 10:10 */}
<g stroke="#F4F1EA" strokeWidth="14" strokeLinecap="round">
<line x1="290" y1="310" x2="290" y2="230" />
<line x1="290" y1="310" x2="360" y2="355" />
</g>
<circle cx="290" cy="310" r="16" fill="#F4F1EA" />
</svg>
);
}