muken/la-huasca-ts
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: reduce weather widget height and move lower

Browse Source
This commit is contained in:
muken
2026-06-28 23:43:11 -05:00
parent 59698686d5
commit 25428e1246
1 changed files with 12 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/user/page.tsx
+12 -12
View File
@@ -135,28 +135,28 @@ export default function UserPage() {
{/* Weather Widget - Always visible below navbar */}
{data.weather && (
<div style={{ background: 'linear-gradient(135deg, #010D1E 0%, #1a2a3a 100%)', borderRadius: '16px', padding: '1.25rem 1.5rem', marginBottom: '2rem', display: 'flex', alignItems: 'center', gap: '2rem', flexWrap: 'wrap', boxShadow: '0 4px 16px rgba(1,13,30,0.2)' }}>
<div style={{ display: 'flex', alignItems: 'center', gap: '1rem' }}>
<div style={{ fontSize: '48px' }}>
<div style={{ background: 'linear-gradient(135deg, #010D1E 0%, #1a2a3a 100%)', borderRadius: '12px', padding: '0.75rem 1.25rem', marginTop: '2rem', marginBottom: '2rem', display: 'flex', alignItems: 'center', gap: '1.5rem', flexWrap: 'wrap', boxShadow: '0 2px 8px rgba(1,13,30,0.15)' }}>
<div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem' }}>
<div style={{ fontSize: '32px' }}>
{data.weather.current.weathercode <= 1 ? '☀️' : data.weather.current.weathercode === 2 ? '⛅' : data.weather.current.weathercode === 3 ? '☁️' : data.weather.current.weathercode >= 51 && data.weather.current.weathercode <= 55 ? '🌧️' : data.weather.current.weathercode >= 61 ? '🌧️' : '☀️'}
</div>
<div>
<div style={{ fontSize: '28px', fontWeight: 600, color: '#fff' }}>{data.weather.current.celsius}°C</div>
<div style={{ fontSize: '13px', color: 'rgba(255,255,255,0.7)' }}>{data.weather.current.summary}</div>
<div style={{ fontSize: '22px', fontWeight: 600, color: '#fff' }}>{data.weather.current.celsius}°C</div>
<div style={{ fontSize: '11px', color: 'rgba(255,255,255,0.7)' }}>{data.weather.current.summary}</div>
</div>
</div>
<div style={{ display: 'flex', gap: '2rem', flex: 1, justifyContent: 'flex-end', flexWrap: 'wrap' }}>
<div style={{ display: 'flex', gap: '1.5rem', flex: 1, justifyContent: 'flex-end', flexWrap: 'wrap' }}>
<div style={{ textAlign: 'center' }}>
<div style={{ fontSize: '11px', color: 'rgba(255,255,255,0.6)', textTransform: 'uppercase', letterSpacing: '0.05em' }}>High</div>
<div style={{ fontSize: '20px', fontWeight: 500, color: '#E8A849' }}>{data.weather.today.maxC}°</div>
<div style={{ fontSize: '10px', color: 'rgba(255,255,255,0.6)', textTransform: 'uppercase', letterSpacing: '0.05em' }}>High</div>
<div style={{ fontSize: '16px', fontWeight: 500, color: '#E8A849' }}>{data.weather.today.maxC}°</div>
</div>
<div style={{ textAlign: 'center' }}>
<div style={{ fontSize: '11px', color: 'rgba(255,255,255,0.6)', textTransform: 'uppercase', letterSpacing: '0.05em' }}>Low</div>
<div style={{ fontSize: '20px', fontWeight: 500, color: '#88b4e8' }}>{data.weather.today.minC}°</div>
<div style={{ fontSize: '10px', color: 'rgba(255,255,255,0.6)', textTransform: 'uppercase', letterSpacing: '0.05em' }}>Low</div>
<div style={{ fontSize: '16px', fontWeight: 500, color: '#88b4e8' }}>{data.weather.today.minC}°</div>
</div>
<div style={{ textAlign: 'center' }}>
<div style={{ fontSize: '11px', color: 'rgba(255,255,255,0.6)', textTransform: 'uppercase', letterSpacing: '0.05em' }}>Wind</div>
<div style={{ fontSize: '16px', color: '#fff' }}>{data.weather.current.windspeed} km/h</div>
<div style={{ fontSize: '10px', color: 'rgba(255,255,255,0.6)', textTransform: 'uppercase', letterSpacing: '0.05em' }}>Wind</div>
<div style={{ fontSize: '14px', color: '#fff' }}>{data.weather.current.windspeed} km/h</div>
</div>
</div>
</div>