External/OpenCut
1
0
Fork 0
mirror of https://github.com/OpenCut-app/OpenCut.git synced 2026-07-13 21:52:53 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: update text properties to use dynamic font size limits and scaling

Browse Source
This commit is contained in:
Maze Winther
2026-02-08 16:50:31 +01:00
parent 9b5fd6eb07
commit c6666fd385
4 changed files with 37 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/components/editor/panels/properties/text-properties.tsx
+7 -6
View File
@@ -30,6 +30,7 @@ import {
} from "@/components/ui/tooltip";
import { useEditor } from "@/hooks/use-editor";
import { DEFAULT_COLOR } from "@/constants/project-constants";
import { MIN_FONT_SIZE, MAX_FONT_SIZE } from "@/constants/text-constants";
export function TextProperties({
element,
@@ -57,7 +58,7 @@ export function TextProperties({
const parsed = parseInt(value, 10);
const fontSize = Number.isNaN(parsed)
? element.fontSize
: clamp({ value: parsed, min: 8, max: 300 });
: clamp({ value: parsed, min: MIN_FONT_SIZE, max: MAX_FONT_SIZE });
editor.timeline.updateTextElement({
trackId,
elementId: element.id,
@@ -70,7 +71,7 @@ export function TextProperties({
const parsed = parseInt(fontSizeInput, 10);
const fontSize = Number.isNaN(parsed)
? element.fontSize
: clamp({ value: parsed, min: 8, max: 300 });
: clamp({ value: parsed, min: MIN_FONT_SIZE, max: MAX_FONT_SIZE });
setFontSizeInput(fontSize.toString());
editor.timeline.updateTextElement({
trackId,
@@ -274,8 +275,8 @@ export function TextProperties({
<div className="flex items-center gap-2">
<Slider
value={[element.fontSize]}
min={8}
max={300}
min={MIN_FONT_SIZE}
max={MAX_FONT_SIZE}
step={1}
onValueChange={([value]) => {
editor.timeline.updateTextElement({
@@ -290,8 +291,8 @@ export function TextProperties({
<Input
type="number"
value={fontSizeInput}
min={8}
max={300}
min={MIN_FONT_SIZE}
max={MAX_FONT_SIZE}
onChange={(e) =>
handleFontSizeChange({ value: e.target.value })
}