From 49426f19cd8eaed7cf6c47999b66fee7ee637a56 Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Fri, 27 Feb 2026 16:33:57 +0100
Subject: feat: implement keyframe animation system

Add keyframe support for transform, opacity, and volume properties.
Includes animation engine (interpolation, mutations, resolvers), timeline
markers with selection/snapping, properties panel toggles, keyframe-aware
renderer, and full undo/redo command support.

Also refactor element command constructors to object params, extract
timeline pixel math to pixel-utils.ts, and update cursor rules.
---
 apps/web/src/components/editor/panels/properties/section.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

(limited to 'apps/web/src/components/editor/panels/properties/section.tsx')

diff --git a/apps/web/src/components/editor/panels/properties/section.tsx b/apps/web/src/components/editor/panels/properties/section.tsx
index 72d78d80..3edd17b5 100644
--- a/apps/web/src/components/editor/panels/properties/section.tsx
+++ b/apps/web/src/components/editor/panels/properties/section.tsx
@@ -139,21 +139,28 @@ export function SectionFields({
 	children: React.ReactNode;
 	className?: string;
 }) {
-	return <div className={cn("flex flex-col gap-3.5", className)}>{children}</div>;
+	return (
+		<div className={cn("flex flex-col gap-3.5", className)}>{children}</div>
+	);
 }
 
 export function SectionField({
 	label,
+	beforeLabel,
 	children,
 	className,
 }: {
 	label: string;
+	beforeLabel?: React.ReactNode;
 	children: React.ReactNode;
 	className?: string;
 }) {
 	return (
 		<div className={cn("flex flex-col gap-2", className)}>
-			<Label>{label}</Label>
+			<div className="flex items-center gap-1.5">
+				{beforeLabel}
+				<Label>{label}</Label>
+			</div>
 			{children}
 		</div>
 	);
-- 
cgit v1.3.1