diff options
Diffstat (limited to 'apps/web/src/components/editor')
4 files changed, 18 insertions, 3 deletions
diff --git a/apps/web/src/components/editor/media-panel/index.tsx b/apps/web/src/components/editor/media-panel/index.tsx index 2c743618..1dfa08c0 100644 --- a/apps/web/src/components/editor/media-panel/index.tsx +++ b/apps/web/src/components/editor/media-panel/index.tsx @@ -46,7 +46,7 @@ export function MediaPanel() { }; return ( - <div className="h-full flex flex-col bg-panel rounded-sm overflow-hidden"> + <div className="h-full flex flex-col bg-panel rounded-sm overflow-scroll"> <TabBar /> <div className="flex-1">{viewMap[activeTab]}</div> </div> diff --git a/apps/web/src/components/editor/properties-panel/index.tsx b/apps/web/src/components/editor/properties-panel/index.tsx index 3613f271..3f38bd78 100644 --- a/apps/web/src/components/editor/properties-panel/index.tsx +++ b/apps/web/src/components/editor/properties-panel/index.tsx @@ -41,7 +41,7 @@ export function PropertiesPanel() { label="Resolution:" value={`${canvasSize.width} × ${canvasSize.height}`} /> - <div className="flex justify-between items-center"> + <div className="flex flex-col gap-1"> <Label className="text-xs text-muted-foreground">Frame rate:</Label> <Select value={(activeProject?.fps || 30).toString()} @@ -79,7 +79,7 @@ export function PropertiesPanel() { } if (element?.type === "media") { const mediaItem = mediaItems.find( - (item) => item.id === element.mediaId, + (item) => item.id === element.mediaId ); if (mediaItem?.type === "audio") { diff --git a/apps/web/src/components/editor/properties-panel/text-properties.tsx b/apps/web/src/components/editor/properties-panel/text-properties.tsx index c55c3dae..e147ea65 100644 --- a/apps/web/src/components/editor/properties-panel/text-properties.tsx +++ b/apps/web/src/components/editor/properties-panel/text-properties.tsx @@ -71,6 +71,20 @@ export function TextProperties({ </div> </PropertyItemValue> </PropertyItem> + <PropertyItem direction="row"> + <PropertyItemLabel>Color</PropertyItemLabel> + <PropertyItemValue> + <Input + type="color" + value={element.color || "#ffffff"} + onChange={(e) => { + const color = e.target.value; + updateTextElement(trackId, element.id, { color }); + }} + className="w-full cursor-pointer rounded-full" + /> + </PropertyItemValue> + </PropertyItem> </div> ); } diff --git a/apps/web/src/components/editor/timeline/timeline-playhead.tsx b/apps/web/src/components/editor/timeline/timeline-playhead.tsx index 509ce9d7..d0aea7fa 100644 --- a/apps/web/src/components/editor/timeline/timeline-playhead.tsx +++ b/apps/web/src/components/editor/timeline/timeline-playhead.tsx @@ -72,6 +72,7 @@ export function TimelinePlayhead({ top: 0, height: `${totalHeight}px`, width: "2px", // Slightly wider for better click target + zIndex: 100, }} onMouseDown={handlePlayheadMouseDown} > |