@remotion/promo-pages 4.0.334 → 4.0.340

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 +729 -561
  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 +76 -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.340",
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.340",
14
+ "@remotion/lottie": "4.0.340",
15
+ "@remotion/lambda": "4.0.340",
16
+ "@remotion/player": "4.0.340",
17
+ "@remotion/shapes": "4.0.340",
18
+ "create-video": "4.0.340",
19
+ "remotion": "4.0.340",
20
+ "@remotion/paths": "4.0.340"
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.340"
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,76 @@
1
+ import React from 'react';
2
+
3
+ import {BlueButton, ClearButton} from './layout/Button';
4
+ import {MuxVideo} from './MuxVideo';
5
+ import {SectionTitle} from './VideoAppsTitle';
6
+
7
+ const EditorStarterSection: React.FC = () => {
8
+ return (
9
+ <div>
10
+ <SectionTitle>Build your own video editor</SectionTitle>
11
+ <br />
12
+ <div className={'card flex p-0 overflow-hidden'}>
13
+ <div className={'flex-1 flex flex-col lg:flex-row justify-center'}>
14
+ <div
15
+ className={
16
+ 'w-full max-w-[500px] aspect-square relative overflow-hidden bg-[#eee]'
17
+ }
18
+ >
19
+ <MuxVideo
20
+ muxId={'YIvIidbcAc7009B00Wr7gIbGyq67YGNlytGvMXwdsLRtc'}
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
+ loop
25
+ autoPlay
26
+ playsInline
27
+ muted
28
+ />
29
+ </div>
30
+ <div className={'p-6 flex-1 flex flex-col h-full'}>
31
+ <div className="text-4xl font-bold fontbrand mt-0">
32
+ Editor Starter
33
+ </div>
34
+ <div className="text-muted mt-4 text-base fontbrand">
35
+ A comprehensive template that includes everything you need to
36
+ create custom video editing applications with React and
37
+ TypeScript.
38
+ </div>
39
+ <div className="h-5" />
40
+ <div className="flex gap-2 items-center">
41
+ <a
42
+ href="https://www.remotion.pro/editor-starter?ref=remotion.dev"
43
+ target="_blank"
44
+ className="no-underline"
45
+ >
46
+ <BlueButton size="sm" loading={false}>
47
+ Purchase
48
+ </BlueButton>
49
+ </a>
50
+ <a
51
+ href="https://editor-starter.remotion.dev?ref=remotion.dev"
52
+ target="_blank"
53
+ className="no-underline"
54
+ >
55
+ <ClearButton size="sm" loading={false}>
56
+ Demo
57
+ </ClearButton>
58
+ </a>{' '}
59
+ <a
60
+ href="https://remotion.dev/editor-starter"
61
+ className="no-underline"
62
+ >
63
+ <ClearButton size="sm" loading={false}>
64
+ Docs
65
+ </ClearButton>
66
+ </a>
67
+ </div>
68
+ <br />
69
+ </div>
70
+ </div>
71
+ </div>
72
+ </div>
73
+ );
74
+ };
75
+
76
+ export default EditorStarterSection;