-
Notifications
You must be signed in to change notification settings - Fork 22
/
Root.tsx
46 lines (43 loc) · 1.29 KB
/
Root.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
import { Composition } from "remotion";
import { HelloWorld, myCompSchema } from "./HelloWorld";
import { Logo, myCompSchema2 } from "./HelloWorld/Logo";
// Each <Composition> is an entry in the sidebar!
export const RemotionRoot: React.FC = () => {
return (
<>
<Composition
// You can take the "id" to render a video:
// npx remotion render src/index.ts <id> out/video.mp4
id="HelloWorld"
component={HelloWorld}
durationInFrames={150}
fps={30}
width={1920}
height={1080}
// You can override these props for each render:
// https://www.remotion.dev/docs/parametrized-rendering
schema={myCompSchema}
defaultProps={{
titleText: "Welcome to Remotion",
titleColor: "#000000",
logoColor1: "#91EAE4",
logoColor2: "#86A8E7",
}}
/>
{/* Mount any React component to make it show up in the sidebar and work on it individually! */}
<Composition
id="OnlyLogo"
component={Logo}
durationInFrames={150}
fps={30}
width={1920}
height={1080}
schema={myCompSchema2}
defaultProps={{
logoColor1: "#91dAE2" as const,
logoColor2: "#86A8E7" as const,
}}
/>
</>
);
};