summaryrefslogtreecommitdiff
path: root/apps/web/src/components/editor/properties-panel/index.tsx
diff options
context:
space:
mode:
authorMaze <167211895+mazeincoding@users.noreply.github.com>2025-07-26 11:24:41 +0200
committerGitHub <noreply@github.com>2025-07-26 11:24:41 +0200
commit4f60c0d3541c22a77488ba45d8dcb4129c9df7ae (patch)
treed2110f8740f54dad65374b6c07d2c8529834e9ac /apps/web/src/components/editor/properties-panel/index.tsx
parentc34f3994d9b26822e4284ab0be0e24eba70407ca (diff)
parente3504de1f1cb67611ff7fa8650fafbe9705d3a9f (diff)
downloadopencut-4f60c0d3541c22a77488ba45d8dcb4129c9df7ae.tar.gz
Merge pull request #457 from itsobi/fix/properties-panel-gets-cut-off-on-smaller-browser-widths
Update PropertyItem component and frame rate dropdown to flex-col so label and value are not on the same line
Diffstat (limited to 'apps/web/src/components/editor/properties-panel/index.tsx')
-rw-r--r--apps/web/src/components/editor/properties-panel/index.tsx6
1 files changed, 3 insertions, 3 deletions
diff --git a/apps/web/src/components/editor/properties-panel/index.tsx b/apps/web/src/components/editor/properties-panel/index.tsx
index 4fc5d89d..ec1942f7 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()}
@@ -101,9 +101,9 @@ export function PropertiesPanel() {
function PropertyItem({ label, value }: { label: string; value: string }) {
return (
- <div className="flex justify-between">
+ <div className="flex flex-col gap-1">
<Label className="text-xs text-muted-foreground">{label}</Label>
- <span className="text-xs text-right truncate w-40" title={value}>
+ <span className="text-xs break-words" title={value}>
{value}
</span>
</div>