Massive Material 3 re-styling

This commit is contained in:
AG
2025-12-12 01:06:09 +02:00
parent 55d414da19
commit bc1b747ef4
13 changed files with 374 additions and 142 deletions

View File

@@ -232,7 +232,7 @@ const History: React.FC<HistoryProps> = ({ lang }) => {
size="icon"
className="text-on-surface-variant hover:text-primary"
>
<Pencil size={20} />
<Pencil size={24} />
</Button>
<Button
onClick={(e) => {
@@ -243,7 +243,7 @@ const History: React.FC<HistoryProps> = ({ lang }) => {
size="icon"
className="text-on-surface-variant hover:text-error"
>
<Trash2 size={20} />
<Trash2 size={24} />
</Button>
</div>
</div>
@@ -300,9 +300,9 @@ const History: React.FC<HistoryProps> = ({ lang }) => {
}}
variant="ghost"
size="icon"
className="h-8 w-8"
className="text-on-surface-variant hover:text-primary"
>
<Pencil size={16} />
<Pencil size={24} />
</Button>
<Button
onClick={() => {
@@ -314,9 +314,9 @@ const History: React.FC<HistoryProps> = ({ lang }) => {
}}
variant="ghost"
size="icon"
className="h-8 w-8 text-error hover:text-error"
className="text-error hover:text-error"
>
<Trash2 size={16} />
<Trash2 size={24} />
</Button>
</div>
</Card>
@@ -372,38 +372,37 @@ const History: React.FC<HistoryProps> = ({ lang }) => {
onClose={() => setEditingSession(null)}
title={t('edit', lang)}
width="lg"
footer={
<div className="flex justify-end">
<Button onClick={handleSaveEdit}>
<Save size={16} className="mr-2" />
{t('save', lang)}
</Button>
</div>
}
>
<div className="space-y-6">
{/* Meta Info */}
<div className="grid grid-cols-2 gap-4">
<div className="bg-surface-container-high rounded-t-lg px-3 py-2 border-b border-outline-variant">
<label className="text-[10px] text-on-surface-variant font-bold block">{t('start_time', lang)}</label>
<input
type="datetime-local"
value={formatDateForInput(editingSession.startTime)}
onChange={(e) => setEditingSession({ ...editingSession, startTime: parseDateFromInput(e.target.value) })}
className="w-full bg-transparent text-on-surface focus:outline-none text-sm mt-1"
/>
</div>
<div className="bg-surface-container-high rounded-t-lg px-3 py-2 border-b border-outline-variant">
<label className="text-[10px] text-on-surface-variant font-bold block">{t('end_time', lang)}</label>
<input
type="datetime-local"
value={editingSession.endTime ? formatDateForInput(editingSession.endTime) : ''}
onChange={(e) => setEditingSession({ ...editingSession, endTime: parseDateFromInput(e.target.value) })}
className="w-full bg-transparent text-on-surface focus:outline-none text-sm mt-1"
/>
</div>
</div>
<div className="bg-surface-container-high rounded-t-lg px-3 py-2 border-b border-outline-variant">
<label className="text-[10px] text-on-surface-variant font-bold block">{t('weight_kg', lang)}</label>
<input
type="number"
value={editingSession.userBodyWeight || ''}
onChange={(e) => setEditingSession({ ...editingSession, userBodyWeight: parseFloat(e.target.value) })}
className="w-full bg-transparent text-on-surface focus:outline-none text-lg mt-1"
<FilledInput
label={t('start_time', lang)}
type="datetime-local"
value={formatDateForInput(editingSession.startTime)}
onChange={(e: any) => setEditingSession({ ...editingSession, startTime: parseDateFromInput(e.target.value) })}
/>
<FilledInput
label={t('end_time', lang)}
type="datetime-local"
value={editingSession.endTime ? formatDateForInput(editingSession.endTime) : ''}
onChange={(e: any) => setEditingSession({ ...editingSession, endTime: parseDateFromInput(e.target.value) })}
/>
</div>
<FilledInput
label={t('weight_kg', lang)}
type="number"
value={editingSession.userBodyWeight || ''}
onChange={(e: any) => setEditingSession({ ...editingSession, userBodyWeight: parseFloat(e.target.value) })}
/>
<div className="space-y-3">
<h3 className="text-sm font-medium text-primary ml-1">{t('sets_count', lang)} ({editingSession.sets.length})</h3>
@@ -443,12 +442,8 @@ const History: React.FC<HistoryProps> = ({ lang }) => {
))}
</div>
<div className="flex justify-end pt-4 border-t border-outline-variant">
<Button onClick={handleSaveEdit}>
<Save size={16} className="mr-2" />
{t('save', lang)}
</Button>
</div>
</div>
</SideSheet>
)