faglo/main_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add aspectRatio prop to StylePreview for dynamic sizing

Browse Source
This commit is contained in:
Daniil
2026-04-06 01:29:12 +03:00
parent face8bb811
commit d648678c68
2 changed files with 4 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/features/project/CaptionSettingsStep/StylePreview.module.scss
+1
View File
@@ -4,6 +4,7 @@
background: #0c0a1a; background: #0c0a1a;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
width: 100%;
} }
.small { .small {
src/features/project/CaptionSettingsStep/StylePreview.tsx
+3 -1
View File
@@ -15,6 +15,7 @@ interface IStylePreviewProps {
config?: CaptionStyleConfig | null config?: CaptionStyleConfig | null
size?: "small" | "large" size?: "small" | "large"
className?: string className?: string
aspectRatio?: number
} }
const SMALL_SCALE = 0.65 const SMALL_SCALE = 0.65
@@ -91,6 +92,7 @@ export const StylePreview: FunctionComponent<IStylePreviewProps> = ({
config, config,
size = "small", size = "small",
className, className,
aspectRatio = 9 / 16,
}): JSX.Element => { }): JSX.Element => {
const safeConfig = config ?? {} const safeConfig = config ?? {}
const highlightColor = safeConfig.text?.highlight_color ?? "#FFFF00" const highlightColor = safeConfig.text?.highlight_color ?? "#FFFF00"
@@ -99,7 +101,7 @@ export const StylePreview: FunctionComponent<IStylePreviewProps> = ({
return ( return (
<div <div
className={cs(styles.root, styles[size], className)} className={cs(styles.root, styles[size], className)}
style={buildPositionStyles(safeConfig, scale)} style={{ ...buildPositionStyles(safeConfig, scale), aspectRatio }}
data-testid="StylePreview" data-testid="StylePreview"
> >
<div <div