k1nq/TREK
1
0
Fork 0
mirror of https://github.com/mauriceboe/TREK.git synced 2026-06-24 07:41:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Migrate static theme inline styles to Tailwind utilities and extract page sub-components

Browse Source 
Replace the static, color-only inline `style={{ ... 'var(--bg-primary)' ... }}` props with the new semantic Tailwind utilities (bg-surface, text-content, border-edge, ...) wherever the result is byte-identical; dynamic/conditional theme styles and hardcoded status colors are left inline. Extract the Atlas country-search autocomplete, the Admin update banner, and two Journey dialogs into their own presentational components to shrink the oversized page files, keeping behaviour and markup identical.
This commit is contained in:
Maurice
2026-05-31 17:15:54 +02:00
parent 43173e2b33
commit 9614a5cf84
52 changed files with 1218 additions and 1149 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/Planner/ReservationsPanel.tsx
+4 -4
View File
@@ -617,13 +617,13 @@ export default function ReservationsPanel({ tripId, reservations, days, assignme
<div style={{ flex: 1, overflowY: 'auto', padding: '24px 28px 80px' }} className="max-md:!px-4 max-md:!pt-4">
{total === 0 && reservations.length === 0 ? (
<div style={{ textAlign: 'center', padding: '60px 20px' }}>
<BookMarked size={36} style={{ color: 'var(--text-faint)', display: 'block', margin: '0 auto 12px' }} />
<p style={{ fontSize: 14, fontWeight: 600, color: 'var(--text-secondary)', margin: '0 0 4px' }}>{t('reservations.empty')}</p>
<p style={{ fontSize: 12, color: 'var(--text-faint)', margin: 0 }}>{t('reservations.emptyHint')}</p>
<BookMarked size={36} className="text-content-faint" style={{ display: 'block', margin: '0 auto 12px' }} />
<p className="text-content-secondary" style={{ fontSize: 14, fontWeight: 600, margin: '0 0 4px' }}>{t('reservations.empty')}</p>
<p className="text-content-faint" style={{ fontSize: 12, margin: 0 }}>{t('reservations.emptyHint')}</p>
</div>
) : total === 0 ? (
<div style={{ textAlign: 'center', padding: '60px 20px' }}>
<p style={{ fontSize: 13, color: 'var(--text-faint)' }}>{t('places.noneFound')}</p>
<p className="text-content-faint" style={{ fontSize: 13 }}>{t('places.noneFound')}</p>
</div>
) : (
<>