Initial commit

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/components/exercises/ExerciseCard.tsx

@@ -0,0 +1,54 @@
+import type { Exercise } from '../../types';
+import { MUSCLE_GROUP_LABELS, MUSCLE_GROUP_COLORS } from '../../types';
+
+interface ExerciseCardProps {
+  exercise: Exercise;
+  onEdit: (exercise: Exercise) => void;
+  onDelete: (exercise: Exercise) => void;
+}
+
+export function ExerciseCard({ exercise, onEdit, onDelete }: ExerciseCardProps) {
+  const label = MUSCLE_GROUP_LABELS[exercise.muscle_group] || exercise.muscle_group;
+  const color = MUSCLE_GROUP_COLORS[exercise.muscle_group] || 'bg-gray-600';
+
+  return (
+    <div className="bg-gray-900 border border-gray-800 rounded-xl p-4">
+      <div className="flex items-start justify-between gap-2">
+        <div className="flex-1 min-w-0">
+          <h3 className="font-semibold text-gray-100 truncate">{exercise.name}</h3>
+          {exercise.description && (
+            <p className="text-sm text-gray-400 mt-1">{exercise.description}</p>
+          )}
+          <div className="flex items-center gap-2 mt-2">
+            <span className={`${color} text-white text-xs px-2 py-1 rounded-full`}>
+              {label}
+            </span>
+            <span className="text-xs text-gray-500">
+              Schritt: {exercise.weight_step_kg} kg
+            </span>
+          </div>
+        </div>
+        <div className="flex gap-1">
+          <button
+            onClick={() => onEdit(exercise)}
+            className="min-h-[44px] min-w-[44px] flex items-center justify-center text-gray-400 hover:text-blue-400 rounded-lg hover:bg-gray-800"
+            title="Bearbeiten"
+          >
+            <svg className="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
+              <path strokeLinecap="round" strokeLinejoin="round" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z" />
+            </svg>
+          </button>
+          <button
+            onClick={() => onDelete(exercise)}
+            className="min-h-[44px] min-w-[44px] flex items-center justify-center text-gray-400 hover:text-red-400 rounded-lg hover:bg-gray-800"
+            title="Löschen"
+          >
+            <svg className="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
+              <path strokeLinecap="round" strokeLinejoin="round" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
+            </svg>
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}