denshooter/oma-memorial
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make candles bigger and fix inconsistent text sizing

Browse Source 
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
denshooter
2026-02-19 21:49:24 +01:00
parent 984a616dd1
commit c184f5c679
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/CandleSection.tsx
+6 -6
View File
@@ -103,9 +103,9 @@ function SingleCandle({ candle, index }: { candle: CandleData; index: number })
const ageInHours = (now - createdTime) / (1000 * 60 * 60) const ageInHours = (now - createdTime) / (1000 * 60 * 60)
const burnProgress = Math.min(ageInHours / 24, 0.4) // Burns down max 40% over 24 hours const burnProgress = Math.min(ageInHours / 24, 0.4) // Burns down max 40% over 24 hours
const candleHeight = 60 * heightVariant * (1 - burnProgress) const candleHeight = 80 * heightVariant * (1 - burnProgress)
const candleWidth = 28 * sizeVariant const candleWidth = 36 * sizeVariant
const flameSize = 0.8 * sizeVariant const flameSize = 1.0 * sizeVariant
const delay = (index % 7) * 0.15 const delay = (index % 7) * 0.15
return ( return (
@@ -219,7 +219,7 @@ function SingleCandle({ candle, index }: { candle: CandleData; index: number })
<p <p
className="text-amber-200/50 font-cormorant italic mt-2 text-center leading-tight" className="text-amber-200/50 font-cormorant italic mt-2 text-center leading-tight"
style={{ style={{
fontSize: `${10 * sizeVariant}px`, fontSize: '11px',
textShadow: '0 0 8px rgba(196,160,74,0.15)', textShadow: '0 0 8px rgba(196,160,74,0.15)',
maxWidth: `${80 * sizeVariant}px`, maxWidth: `${80 * sizeVariant}px`,
wordBreak: 'break-word', wordBreak: 'break-word',
@@ -230,8 +230,8 @@ function SingleCandle({ candle, index }: { candle: CandleData; index: number })
<p <p
className="text-amber-200/35 font-lora text-center leading-tight" className="text-amber-200/35 font-lora text-center leading-tight"
style={{ style={{
fontSize: `${7 * sizeVariant}px`, fontSize: '8px',
marginTop: `${2 * sizeVariant}px`, marginTop: '2px',
}} }}
> >
{relativeTime(candle.created_at)} {relativeTime(candle.created_at)}