@remotion/promo-pages 4.0.334 → 4.0.339

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/.turbo/turbo-make.log +2 -2
  2. package/dist/Homepage.js +469 -363
  3. package/dist/tailwind.css +6 -0
  4. package/package.json +10 -10
  5. package/src/components/Homepage.tsx +6 -0
  6. package/src/components/homepage/EditorStarterSection.tsx +73 -0
package/dist/tailwind.css CHANGED
@@ -574,6 +574,12 @@
574
574
  .object-contain {
575
575
  object-fit: contain;
576
576
  }
577
+ .object-cover {
578
+ object-fit: cover;
579
+ }
580
+ .object-top {
581
+ object-position: top;
582
+ }
577
583
  .p-0 {
578
584
  padding: calc(var(--spacing) * 0);
579
585
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@remotion/promo-pages",
3
- "version": "4.0.334",
3
+ "version": "4.0.339",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -10,14 +10,14 @@
10
10
  "polished": "4.3.1",
11
11
  "zod": "3.22.3",
12
12
  "bun-plugin-tailwind": "0.0.15",
13
- "@remotion/lambda": "4.0.334",
14
- "create-video": "4.0.334",
15
- "@remotion/player": "4.0.334",
16
- "remotion": "4.0.334",
17
- "@remotion/shapes": "4.0.334",
18
- "@remotion/paths": "4.0.334",
19
- "@remotion/lottie": "4.0.334",
20
- "@remotion/animated-emoji": "4.0.334"
13
+ "@remotion/animated-emoji": "4.0.339",
14
+ "@remotion/lambda": "4.0.339",
15
+ "@remotion/player": "4.0.339",
16
+ "@remotion/shapes": "4.0.339",
17
+ "create-video": "4.0.339",
18
+ "remotion": "4.0.339",
19
+ "@remotion/lottie": "4.0.339",
20
+ "@remotion/paths": "4.0.339"
21
21
  },
22
22
  "devDependencies": {
23
23
  "@eslint/eslintrc": "3.1.0",
@@ -34,7 +34,7 @@
34
34
  "tailwind-merge": "2.5.2",
35
35
  "bun-plugin-tailwind": "0.0.13",
36
36
  "clsx": "2.1.1",
37
- "@remotion/eslint-config-internal": "4.0.334"
37
+ "@remotion/eslint-config-internal": "4.0.339"
38
38
  },
39
39
  "repository": {
40
40
  "url": "https://github.com/remotion-dev/remotion/tree/main/packages/promo-pages"
package/src/components/Homepage.tsx CHANGED
@@ -4,6 +4,7 @@ import React from 'react';
4
4
  import {BackgroundAnimation} from './homepage/BackgroundAnimation';
5
5
  import CommunityStats from './homepage/CommunityStats';
6
6
  import {Demo} from './homepage/Demo';
7
+ import EditorStarterSection from './homepage/EditorStarterSection';
7
8
  import EvaluateRemotionSection from './homepage/EvaluateRemotion';
8
9
  import {IfYouKnowReact} from './homepage/IfYouKnowReact';
9
10
  import type {ColorMode} from './homepage/layout/use-color-mode';
@@ -61,6 +62,11 @@ export const NewLanding: React.FC<{
61
62
  <br />
62
63
  <br />
63
64
  <br />
65
+ <EditorStarterSection />
66
+ <br />
67
+ <br />
68
+ <br />
69
+
64
70
  <SectionTitle>Even more power to developers</SectionTitle>
65
71
  <div className={'fontbrand text-center mb-10 -mt-4'}>
66
72
  Innovative video products that you might enjoy.
package/src/components/homepage/EditorStarterSection.tsx ADDED
@@ -0,0 +1,73 @@
1
+ import React from 'react';
2
+
3
+ import {SectionTitle} from './VideoAppsTitle';
4
+ import {BlueButton, ClearButton} from './layout/Button';
5
+
6
+ const EditorStarterSection: React.FC = () => {
7
+ return (
8
+ <div>
9
+ <SectionTitle>Build your own video editor</SectionTitle>
10
+ <br />
11
+ <div className={'card flex p-0 overflow-hidden'}>
12
+ <div className={'flex-1 flex flex-col lg:flex-row justify-center'}>
13
+ <div
14
+ className={
15
+ 'w-full max-w-[500px] aspect-square relative overflow-hidden bg-[#eee]'
16
+ }
17
+ >
18
+ <img
19
+ src={'/img/editor-starter-demo.jpg'}
20
+ alt="Remotion Editor Starter"
21
+ className={
22
+ 'absolute left-0 top-0 w-full h-full object-cover object-top rounded-sm rounded-tr-none rounded-br-none'
23
+ }
24
+ />
25
+ </div>
26
+ <div className={'p-6 flex-1 flex flex-col h-full'}>
27
+ <div className="text-4xl font-bold fontbrand mt-0">
28
+ Editor Starter
29
+ </div>
30
+ <div className="text-muted mt-4 text-base fontbrand">
31
+ Add to existing project or start from scratch. A comprehensive
32
+ template that includes everything you need to create custom video
33
+ editing applications with React and TypeScript.
34
+ </div>
35
+ <div className="h-5" />
36
+ <div className="flex gap-2 items-center">
37
+ <a
38
+ href="https://www.remotion.pro/editor-starter?ref=remotion.dev"
39
+ target="_blank"
40
+ className="no-underline"
41
+ >
42
+ <BlueButton size="sm" loading={false}>
43
+ Start building
44
+ </BlueButton>
45
+ </a>
46
+ <a
47
+ href="https://editor-starter.remotion.dev?ref=remotion.dev"
48
+ target="_blank"
49
+ className="no-underline"
50
+ >
51
+ <ClearButton size="sm" loading={false}>
52
+ Demo
53
+ </ClearButton>
54
+ </a>{' '}
55
+ <a
56
+ href="https://remotion.dev/editor-starter"
57
+ target="_blank"
58
+ className="no-underline"
59
+ >
60
+ <ClearButton size="sm" loading={false}>
61
+ Docs
62
+ </ClearButton>
63
+ </a>
64
+ </div>
65
+ <br />
66
+ </div>
67
+ </div>
68
+ </div>
69
+ </div>
70
+ );
71
+ };
72
+
73
+ export default EditorStarterSection;