Update pages, components, and add stock images for visual layout enhancements

This commit is contained in:
R-Bharathraj
2026-06-30 13:36:16 +05:30
parent 9b93fa0d07
commit 7175adb0db
36 changed files with 340 additions and 604 deletions

View File

@@ -48,7 +48,7 @@ export default function EarnRewardsSection() {
background: '#f0fdf4', border: '1.5px solid #16a34a', borderRadius: 100, padding: '7px 16px',
}}>
<span style={{ width: 7, height: 7, borderRadius: '50%', background: '#16a34a', flexShrink: 0, animation: 'fpPulse 1.5s infinite' }} />
<span style={{ fontSize: 11, fontWeight: 700, color: '#16a34a', fontFamily: 'Manrope, sans-serif', letterSpacing: '0.1em', textTransform: 'uppercase' }}>Live points balance</span>
<span style={{ fontSize: 11, fontWeight: 700, color: '#16a34a', fontFamily: 'Sora, sans-serif', letterSpacing: '0.1em', textTransform: 'uppercase' }}>Live points balance</span>
</div>
{/* Giant gold number */}
@@ -67,7 +67,7 @@ export default function EarnRewardsSection() {
background: '#fff7e0', border: '1px solid #f4be28',
}}>
<span style={{ fontSize: 18, fontWeight: 900, color: '#bc7122', fontFamily: 'Sora, sans-serif' }}>{pts.toLocaleString()}</span>
<span style={{ fontSize: 13, color: '#4f463a', fontFamily: 'Manrope, sans-serif' }}>redeemable value</span>
<span style={{ fontSize: 13, color: '#4f463a', fontFamily: 'Sora, sans-serif' }}>redeemable value</span>
</div>
<div style={{ marginBottom: 16 }}><span className="fp-kicker fp-rise">Earn · 03</span></div>
@@ -82,7 +82,7 @@ export default function EarnRewardsSection() {
</h2>
<p className="fp-rise" style={{
fontSize: 15, lineHeight: 1.8, color: '#4f463a', fontFamily: 'Manrope, sans-serif', maxWidth: 380, margin: 0,
fontSize: 15, lineHeight: 1.8, color: '#4f463a', fontFamily: 'Sora, sans-serif', maxWidth: 380, margin: 0,
}}>
Earn Loyaly Coins through daily app login, completing 5,000-step walking challenges, playing Maze, Spin Wheel, Scratch Card, and Match Master games, or visiting Selfie Booths at partner malls. Every activity puts more coins in your wallet.
</p>
@@ -95,8 +95,8 @@ export default function EarnRewardsSection() {
display: 'flex', justifyContent: 'space-between', alignItems: 'center',
marginBottom: 14, paddingBottom: 14, borderBottom: '2px solid #f4be28',
}}>
<span style={{ fontSize: 12, fontWeight: 700, letterSpacing: '0.14em', textTransform: 'uppercase', color: '#171512', fontFamily: 'Manrope, sans-serif' }}>Activity feed</span>
<span style={{ fontSize: 11, color: '#16a34a', fontWeight: 700, fontFamily: 'Manrope, sans-serif', display: 'flex', alignItems: 'center', gap: 5,
<span style={{ fontSize: 12, fontWeight: 700, letterSpacing: '0.14em', textTransform: 'uppercase', color: '#171512', fontFamily: 'Sora, sans-serif' }}>Activity feed</span>
<span style={{ fontSize: 11, color: '#16a34a', fontWeight: 700, fontFamily: 'Sora, sans-serif', display: 'flex', alignItems: 'center', gap: 5,
background: '#f0fdf4', border: '1px solid #16a34a', borderRadius: 100, padding: '4px 10px',
}}>
<span style={{ width: 5, height: 5, borderRadius: '50%', background: '#16a34a', display: 'block', animation: 'fpPulse 1.5s infinite' }} />
@@ -123,8 +123,8 @@ export default function EarnRewardsSection() {
color: tx.type === 'earn' ? '#16a34a' : '#ef4444',
}}>{tx.type === 'earn' ? '↑' : '↓'}</div>
<div>
<div style={{ fontSize: 13, fontWeight: 700, color: '#171512', fontFamily: 'Manrope, sans-serif' }}>{tx.store}</div>
<div style={{ fontSize: 11, color: 'rgba(23,21,18,0.45)', fontFamily: 'Manrope, sans-serif', marginTop: 1 }}>{tx.time}</div>
<div style={{ fontSize: 13, fontWeight: 700, color: '#171512', fontFamily: 'Sora, sans-serif' }}>{tx.store}</div>
<div style={{ fontSize: 11, color: 'rgba(23,21,18,0.45)', fontFamily: 'Sora, sans-serif', marginTop: 1 }}>{tx.time}</div>
</div>
</div>
<span style={{
@@ -148,7 +148,7 @@ export default function EarnRewardsSection() {
{ label: 'Redeemable value', val: '₹660', color: '#f4be28', bg: '#fff7e0', border: '#f4be28' },
].map((s, i) => (
<div key={i} style={{ padding: '14px 16px', borderRadius: 14, background: s.bg, border: `1.5px solid ${s.border}` }}>
<div style={{ fontSize: 11, color: 'rgba(23,21,18,0.5)', fontFamily: 'Manrope, sans-serif', marginBottom: 4 }}>{s.label}</div>
<div style={{ fontSize: 11, color: 'rgba(23,21,18,0.5)', fontFamily: 'Sora, sans-serif', marginBottom: 4 }}>{s.label}</div>
<div style={{ fontSize: 18, fontWeight: 900, color: s.color, fontFamily: 'Sora, sans-serif' }}>{s.val}</div>
</div>
))}