Update compo

package-lock.json

@@ -47,6 +47,7 @@
 				"remotion": "4.0.19",
 				"remotion-animated": "^2.0.0",
 				"remotion-transition-series": "^0.0.10",
+				"sharp": "^0.33.5",
 				"socket.io": "^4.7.2",
 				"styled-components": "^6.0.5",
 				"syllable-count-english": "^1.0.6",
@@ -2769,6 +2770,21 @@
 				"postcss-selector-parser": "^6.0.10"
 			}
 		},
+		"node_modules/@emnapi/runtime": {
+			"version": "1.3.1",
+			"resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.3.1.tgz",
+			"integrity": "sha512-kEBmG8KyqtxJZv+ygbEim+KCGtIq1fC22Ms3S4ziXmYKm8uyoLX0MHONVKwp+9opg390VaKRNt4a7A9NwmpNhw==",
+			"optional": true,
+			"dependencies": {
+				"tslib": "^2.4.0"
+			}
+		},
+		"node_modules/@emnapi/runtime/node_modules/tslib": {
+			"version": "2.8.1",
+			"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+			"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+			"optional": true
+		},
 		"node_modules/@emotion/is-prop-valid": {
 			"version": "1.2.1",
 			"resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.1.tgz",
@@ -4283,6 +4299,348 @@
 			"integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
 			"peer": true
 		},
+		"node_modules/@img/sharp-darwin-arm64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.33.5.tgz",
+			"integrity": "sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==",
+			"cpu": [
+				"arm64"
+			],
+			"optional": true,
+			"os": [
+				"darwin"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-darwin-arm64": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-darwin-x64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.33.5.tgz",
+			"integrity": "sha512-fyHac4jIc1ANYGRDxtiqelIbdWkIuQaI84Mv45KvGRRxSAa7o7d1ZKAOBaYbnepLC1WqxfpimdeWfvqqSGwR2Q==",
+			"cpu": [
+				"x64"
+			],
+			"optional": true,
+			"os": [
+				"darwin"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-darwin-x64": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-libvips-darwin-arm64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.0.4.tgz",
+			"integrity": "sha512-XblONe153h0O2zuFfTAbQYAX2JhYmDHeWikp1LM9Hul9gVPjFY427k6dFEcOL72O01QxQsWi761svJ/ev9xEDg==",
+			"cpu": [
+				"arm64"
+			],
+			"optional": true,
+			"os": [
+				"darwin"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-darwin-x64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.0.4.tgz",
+			"integrity": "sha512-xnGR8YuZYfJGmWPvmlunFaWJsb9T/AO2ykoP3Fz/0X5XV2aoYBPkX6xqCQvUTKKiLddarLaxpzNe+b1hjeWHAQ==",
+			"cpu": [
+				"x64"
+			],
+			"optional": true,
+			"os": [
+				"darwin"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-linux-arm": {
+			"version": "1.0.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.0.5.tgz",
+			"integrity": "sha512-gvcC4ACAOPRNATg/ov8/MnbxFDJqf/pDePbBnuBDcjsI8PssmjoKMAz4LtLaVi+OnSb5FK/yIOamqDwGmXW32g==",
+			"cpu": [
+				"arm"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-linux-arm64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.0.4.tgz",
+			"integrity": "sha512-9B+taZ8DlyyqzZQnoeIvDVR/2F4EbMepXMc/NdVbkzsJbzkUjhXv/70GQJ7tdLA4YJgNP25zukcxpX2/SueNrA==",
+			"cpu": [
+				"arm64"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-linux-s390x": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.0.4.tgz",
+			"integrity": "sha512-u7Wz6ntiSSgGSGcjZ55im6uvTrOxSIS8/dgoVMoiGE9I6JAfU50yH5BoDlYA1tcuGS7g/QNtetJnxA6QEsCVTA==",
+			"cpu": [
+				"s390x"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-linux-x64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.0.4.tgz",
+			"integrity": "sha512-MmWmQ3iPFZr0Iev+BAgVMb3ZyC4KeFc3jFxnNbEPas60e1cIfevbtuyf9nDGIzOaW9PdnDciJm+wFFaTlj5xYw==",
+			"cpu": [
+				"x64"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-linuxmusl-arm64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.0.4.tgz",
+			"integrity": "sha512-9Ti+BbTYDcsbp4wfYib8Ctm1ilkugkA/uscUn6UXK1ldpC1JjiXbLfFZtRlBhjPZ5o1NCLiDbg8fhUPKStHoTA==",
+			"cpu": [
+				"arm64"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-libvips-linuxmusl-x64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.0.4.tgz",
+			"integrity": "sha512-viYN1KX9m+/hGkJtvYYp+CCLgnJXwiQB39damAO7WMdKWlIhmYTfHjwSbQeUK/20vY154mwezd9HflVFM1wVSw==",
+			"cpu": [
+				"x64"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-linux-arm": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linux-arm/-/sharp-linux-arm-0.33.5.tgz",
+			"integrity": "sha512-JTS1eldqZbJxjvKaAkxhZmBqPRGmxgu+qFKSInv8moZ2AmT5Yib3EQ1c6gp493HvrvV8QgdOXdyaIBrhvFhBMQ==",
+			"cpu": [
+				"arm"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-linux-arm": "1.0.5"
+			}
+		},
+		"node_modules/@img/sharp-linux-arm64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.33.5.tgz",
+			"integrity": "sha512-JMVv+AMRyGOHtO1RFBiJy/MBsgz0x4AWrT6QoEVVTyh1E39TrCUpTRI7mx9VksGX4awWASxqCYLCV4wBZHAYxA==",
+			"cpu": [
+				"arm64"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-linux-arm64": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-linux-s390x": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.33.5.tgz",
+			"integrity": "sha512-y/5PCd+mP4CA/sPDKl2961b+C9d+vPAveS33s6Z3zfASk2j5upL6fXVPZi7ztePZ5CuH+1kW8JtvxgbuXHRa4Q==",
+			"cpu": [
+				"s390x"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-linux-s390x": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-linux-x64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linux-x64/-/sharp-linux-x64-0.33.5.tgz",
+			"integrity": "sha512-opC+Ok5pRNAzuvq1AG0ar+1owsu842/Ab+4qvU879ippJBHvyY5n2mxF1izXqkPYlGuP/M556uh53jRLJmzTWA==",
+			"cpu": [
+				"x64"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-linux-x64": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-linuxmusl-arm64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.33.5.tgz",
+			"integrity": "sha512-XrHMZwGQGvJg2V/oRSUfSAfjfPxO+4DkiRh6p2AFjLQztWUuY/o8Mq0eMQVIY7HJ1CDQUJlxGGZRw1a5bqmd1g==",
+			"cpu": [
+				"arm64"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-linuxmusl-arm64": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-linuxmusl-x64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.33.5.tgz",
+			"integrity": "sha512-WT+d/cgqKkkKySYmqoZ8y3pxx7lx9vVejxW/W4DOFMYVSkErR+w7mf2u8m/y4+xHe7yY9DAXQMWQhpnMuFfScw==",
+			"cpu": [
+				"x64"
+			],
+			"optional": true,
+			"os": [
+				"linux"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-libvips-linuxmusl-x64": "1.0.4"
+			}
+		},
+		"node_modules/@img/sharp-wasm32": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-wasm32/-/sharp-wasm32-0.33.5.tgz",
+			"integrity": "sha512-ykUW4LVGaMcU9lu9thv85CbRMAwfeadCJHRsg2GmeRa/cJxsVY9Rbd57JcMxBkKHag5U/x7TSBpScF4U8ElVzg==",
+			"cpu": [
+				"wasm32"
+			],
+			"optional": true,
+			"dependencies": {
+				"@emnapi/runtime": "^1.2.0"
+			},
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-win32-ia32": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.33.5.tgz",
+			"integrity": "sha512-T36PblLaTwuVJ/zw/LaH0PdZkRz5rd3SmMHX8GSmR7vtNSP5Z6bQkExdSK7xGWyxLw4sUknBuugTelgw2faBbQ==",
+			"cpu": [
+				"ia32"
+			],
+			"optional": true,
+			"os": [
+				"win32"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
+		"node_modules/@img/sharp-win32-x64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.33.5.tgz",
+			"integrity": "sha512-MpY/o8/8kj+EcnxwvrP4aTJSWw/aZ7JIGR4aBeZkZw5B7/Jn+tY9/VNwtcoGmdT7GfggGIU4kygOMSbYnOrAbg==",
+			"cpu": [
+				"x64"
+			],
+			"optional": true,
+			"os": [
+				"win32"
+			],
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			}
+		},
 		"node_modules/@jridgewell/gen-mapping": {
 			"version": "0.3.3",
 			"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
@@ -6937,6 +7295,18 @@
 				"node": ">=0.8"
 			}
 		},
+		"node_modules/color": {
+			"version": "4.2.3",
+			"resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
+			"integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
+			"dependencies": {
+				"color-convert": "^2.0.1",
+				"color-string": "^1.9.0"
+			},
+			"engines": {
+				"node": ">=12.5.0"
+			}
+		},
 		"node_modules/color-convert": {
 			"version": "2.0.1",
 			"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -6953,6 +7323,15 @@
 			"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
 			"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
 		},
+		"node_modules/color-string": {
+			"version": "1.9.1",
+			"resolved": "https://registry.npmjs.org/color-string/-/color-string-1.9.1.tgz",
+			"integrity": "sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==",
+			"dependencies": {
+				"color-name": "^1.0.0",
+				"simple-swizzle": "^0.2.2"
+			}
+		},
 		"node_modules/color-support": {
 			"version": "1.1.3",
 			"resolved": "https://registry.npmjs.org/color-support/-/color-support-1.1.3.tgz",
@@ -7695,9 +8074,9 @@
 			}
 		},
 		"node_modules/detect-libc": {
-			"version": "2.0.2",
-			"resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.2.tgz",
-			"integrity": "sha512-UX6sGumvvqSaXgdKGUsgZWqcUyIXZ/vZTrlRT/iobiKhGL0zL4d3osHj3uqllWJK+i+sixDS/3COVEOFbupFyw==",
+			"version": "2.0.3",
+			"resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.3.tgz",
+			"integrity": "sha512-bwy0MGW55bG41VqxxypOsdSdGqLwXPI/focwgTYCFMbdUiBAxLg9CFzG08sz2aqzknwiX7Hkl0bQENjg8iLByw==",
 			"engines": {
 				"node": ">=8"
 			}
@@ -18410,6 +18789,55 @@
 			"resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz",
 			"integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ=="
 		},
+		"node_modules/sharp": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/sharp/-/sharp-0.33.5.tgz",
+			"integrity": "sha512-haPVm1EkS9pgvHrQ/F3Xy+hgcuMV0Wm9vfIBSiwZ05k+xgb0PkBQpGsAA/oWdDobNaZTH5ppvHtzCFbnSEwHVw==",
+			"hasInstallScript": true,
+			"dependencies": {
+				"color": "^4.2.3",
+				"detect-libc": "^2.0.3",
+				"semver": "^7.6.3"
+			},
+			"engines": {
+				"node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+			},
+			"funding": {
+				"url": "https://opencollective.com/libvips"
+			},
+			"optionalDependencies": {
+				"@img/sharp-darwin-arm64": "0.33.5",
+				"@img/sharp-darwin-x64": "0.33.5",
+				"@img/sharp-libvips-darwin-arm64": "1.0.4",
+				"@img/sharp-libvips-darwin-x64": "1.0.4",
+				"@img/sharp-libvips-linux-arm": "1.0.5",
+				"@img/sharp-libvips-linux-arm64": "1.0.4",
+				"@img/sharp-libvips-linux-s390x": "1.0.4",
+				"@img/sharp-libvips-linux-x64": "1.0.4",
+				"@img/sharp-libvips-linuxmusl-arm64": "1.0.4",
+				"@img/sharp-libvips-linuxmusl-x64": "1.0.4",
+				"@img/sharp-linux-arm": "0.33.5",
+				"@img/sharp-linux-arm64": "0.33.5",
+				"@img/sharp-linux-s390x": "0.33.5",
+				"@img/sharp-linux-x64": "0.33.5",
+				"@img/sharp-linuxmusl-arm64": "0.33.5",
+				"@img/sharp-linuxmusl-x64": "0.33.5",
+				"@img/sharp-wasm32": "0.33.5",
+				"@img/sharp-win32-ia32": "0.33.5",
+				"@img/sharp-win32-x64": "0.33.5"
+			}
+		},
+		"node_modules/sharp/node_modules/semver": {
+			"version": "7.6.3",
+			"resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+			"integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+			"bin": {
+				"semver": "bin/semver.js"
+			},
+			"engines": {
+				"node": ">=10"
+			}
+		},
 		"node_modules/shebang-command": {
 			"version": "2.0.0",
 			"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@@ -18447,6 +18875,19 @@
 			"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz",
 			"integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ=="
 		},
+		"node_modules/simple-swizzle": {
+			"version": "0.2.2",
+			"resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
+			"integrity": "sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==",
+			"dependencies": {
+				"is-arrayish": "^0.3.1"
+			}
+		},
+		"node_modules/simple-swizzle/node_modules/is-arrayish": {
+			"version": "0.3.2",
+			"resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
+			"integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ=="
+		},
 		"node_modules/simplex-noise": {
 			"version": "4.0.1",
 			"resolved": "https://registry.npmjs.org/simplex-noise/-/simplex-noise-4.0.1.tgz",
@@ -21940,6 +22381,23 @@
 			"integrity": "sha512-+OJ9konv95ClSTOJCmMZqpd5+YGsB2S+x6w3E1oaM8UuR5j8nTNHYSz8c9BEPGDOCMQYIEEGlVPj/VY64iTbGw==",
 			"requires": {}
 		},
+		"@emnapi/runtime": {
+			"version": "1.3.1",
+			"resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.3.1.tgz",
+			"integrity": "sha512-kEBmG8KyqtxJZv+ygbEim+KCGtIq1fC22Ms3S4ziXmYKm8uyoLX0MHONVKwp+9opg390VaKRNt4a7A9NwmpNhw==",
+			"optional": true,
+			"requires": {
+				"tslib": "^2.4.0"
+			},
+			"dependencies": {
+				"tslib": {
+					"version": "2.8.1",
+					"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+					"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+					"optional": true
+				}
+			}
+		},
 		"@emotion/is-prop-valid": {
 			"version": "1.2.1",
 			"resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.1.tgz",
@@ -22988,6 +23446,147 @@
 			"integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
 			"peer": true
 		},
+		"@img/sharp-darwin-arm64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.33.5.tgz",
+			"integrity": "sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==",
+			"optional": true,
+			"requires": {
+				"@img/sharp-libvips-darwin-arm64": "1.0.4"
+			}
+		},
+		"@img/sharp-darwin-x64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.33.5.tgz",
+			"integrity": "sha512-fyHac4jIc1ANYGRDxtiqelIbdWkIuQaI84Mv45KvGRRxSAa7o7d1ZKAOBaYbnepLC1WqxfpimdeWfvqqSGwR2Q==",
+			"optional": true,
+			"requires": {
+				"@img/sharp-libvips-darwin-x64": "1.0.4"
+			}
+		},
+		"@img/sharp-libvips-darwin-arm64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.0.4.tgz",
+			"integrity": "sha512-XblONe153h0O2zuFfTAbQYAX2JhYmDHeWikp1LM9Hul9gVPjFY427k6dFEcOL72O01QxQsWi761svJ/ev9xEDg==",
+			"optional": true
+		},
+		"@img/sharp-libvips-darwin-x64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.0.4.tgz",
+			"integrity": "sha512-xnGR8YuZYfJGmWPvmlunFaWJsb9T/AO2ykoP3Fz/0X5XV2aoYBPkX6xqCQvUTKKiLddarLaxpzNe+b1hjeWHAQ==",
+			"optional": true
+		},
+		"@img/sharp-libvips-linux-arm": {
+			"version": "1.0.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.0.5.tgz",
+			"integrity": "sha512-gvcC4ACAOPRNATg/ov8/MnbxFDJqf/pDePbBnuBDcjsI8PssmjoKMAz4LtLaVi+OnSb5FK/yIOamqDwGmXW32g==",
+			"optional": true
+		},
+		"@img/sharp-libvips-linux-arm64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.0.4.tgz",
+			"integrity": "sha512-9B+taZ8DlyyqzZQnoeIvDVR/2F4EbMepXMc/NdVbkzsJbzkUjhXv/70GQJ7tdLA4YJgNP25zukcxpX2/SueNrA==",
+			"optional": true
+		},
+		"@img/sharp-libvips-linux-s390x": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.0.4.tgz",
+			"integrity": "sha512-u7Wz6ntiSSgGSGcjZ55im6uvTrOxSIS8/dgoVMoiGE9I6JAfU50yH5BoDlYA1tcuGS7g/QNtetJnxA6QEsCVTA==",
+			"optional": true
+		},
+		"@img/sharp-libvips-linux-x64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.0.4.tgz",
+			"integrity": "sha512-MmWmQ3iPFZr0Iev+BAgVMb3ZyC4KeFc3jFxnNbEPas60e1cIfevbtuyf9nDGIzOaW9PdnDciJm+wFFaTlj5xYw==",
+			"optional": true
+		},
+		"@img/sharp-libvips-linuxmusl-arm64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.0.4.tgz",
+			"integrity": "sha512-9Ti+BbTYDcsbp4wfYib8Ctm1ilkugkA/uscUn6UXK1ldpC1JjiXbLfFZtRlBhjPZ5o1NCLiDbg8fhUPKStHoTA==",
+			"optional": true
+		},
+		"@img/sharp-libvips-linuxmusl-x64": {
+			"version": "1.0.4",
+			"resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.0.4.tgz",
+			"integrity": "sha512-viYN1KX9m+/hGkJtvYYp+CCLgnJXwiQB39damAO7WMdKWlIhmYTfHjwSbQeUK/20vY154mwezd9HflVFM1wVSw==",
+			"optional": true
+		},
+		"@img/sharp-linux-arm": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linux-arm/-/sharp-linux-arm-0.33.5.tgz",
+			"integrity": "sha512-JTS1eldqZbJxjvKaAkxhZmBqPRGmxgu+qFKSInv8moZ2AmT5Yib3EQ1c6gp493HvrvV8QgdOXdyaIBrhvFhBMQ==",
+			"optional": true,
+			"requires": {
+				"@img/sharp-libvips-linux-arm": "1.0.5"
+			}
+		},
+		"@img/sharp-linux-arm64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.33.5.tgz",
+			"integrity": "sha512-JMVv+AMRyGOHtO1RFBiJy/MBsgz0x4AWrT6QoEVVTyh1E39TrCUpTRI7mx9VksGX4awWASxqCYLCV4wBZHAYxA==",
+			"optional": true,
+			"requires": {
+				"@img/sharp-libvips-linux-arm64": "1.0.4"
+			}
+		},
+		"@img/sharp-linux-s390x": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.33.5.tgz",
+			"integrity": "sha512-y/5PCd+mP4CA/sPDKl2961b+C9d+vPAveS33s6Z3zfASk2j5upL6fXVPZi7ztePZ5CuH+1kW8JtvxgbuXHRa4Q==",
+			"optional": true,
+			"requires": {
+				"@img/sharp-libvips-linux-s390x": "1.0.4"
+			}
+		},
+		"@img/sharp-linux-x64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linux-x64/-/sharp-linux-x64-0.33.5.tgz",
+			"integrity": "sha512-opC+Ok5pRNAzuvq1AG0ar+1owsu842/Ab+4qvU879ippJBHvyY5n2mxF1izXqkPYlGuP/M556uh53jRLJmzTWA==",
+			"optional": true,
+			"requires": {
+				"@img/sharp-libvips-linux-x64": "1.0.4"
+			}
+		},
+		"@img/sharp-linuxmusl-arm64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.33.5.tgz",
+			"integrity": "sha512-XrHMZwGQGvJg2V/oRSUfSAfjfPxO+4DkiRh6p2AFjLQztWUuY/o8Mq0eMQVIY7HJ1CDQUJlxGGZRw1a5bqmd1g==",
+			"optional": true,
+			"requires": {
+				"@img/sharp-libvips-linuxmusl-arm64": "1.0.4"
+			}
+		},
+		"@img/sharp-linuxmusl-x64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.33.5.tgz",
+			"integrity": "sha512-WT+d/cgqKkkKySYmqoZ8y3pxx7lx9vVejxW/W4DOFMYVSkErR+w7mf2u8m/y4+xHe7yY9DAXQMWQhpnMuFfScw==",
+			"optional": true,
+			"requires": {
+				"@img/sharp-libvips-linuxmusl-x64": "1.0.4"
+			}
+		},
+		"@img/sharp-wasm32": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-wasm32/-/sharp-wasm32-0.33.5.tgz",
+			"integrity": "sha512-ykUW4LVGaMcU9lu9thv85CbRMAwfeadCJHRsg2GmeRa/cJxsVY9Rbd57JcMxBkKHag5U/x7TSBpScF4U8ElVzg==",
+			"optional": true,
+			"requires": {
+				"@emnapi/runtime": "^1.2.0"
+			}
+		},
+		"@img/sharp-win32-ia32": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.33.5.tgz",
+			"integrity": "sha512-T36PblLaTwuVJ/zw/LaH0PdZkRz5rd3SmMHX8GSmR7vtNSP5Z6bQkExdSK7xGWyxLw4sUknBuugTelgw2faBbQ==",
+			"optional": true
+		},
+		"@img/sharp-win32-x64": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.33.5.tgz",
+			"integrity": "sha512-MpY/o8/8kj+EcnxwvrP4aTJSWw/aZ7JIGR4aBeZkZw5B7/Jn+tY9/VNwtcoGmdT7GfggGIU4kygOMSbYnOrAbg==",
+			"optional": true
+		},
 		"@jridgewell/gen-mapping": {
 			"version": "0.3.3",
 			"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
@@ -25057,6 +25656,15 @@
 			"resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
 			"integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w=="
 		},
+		"color": {
+			"version": "4.2.3",
+			"resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
+			"integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
+			"requires": {
+				"color-convert": "^2.0.1",
+				"color-string": "^1.9.0"
+			}
+		},
 		"color-convert": {
 			"version": "2.0.1",
 			"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -25070,6 +25678,15 @@
 			"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
 			"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
 		},
+		"color-string": {
+			"version": "1.9.1",
+			"resolved": "https://registry.npmjs.org/color-string/-/color-string-1.9.1.tgz",
+			"integrity": "sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==",
+			"requires": {
+				"color-name": "^1.0.0",
+				"simple-swizzle": "^0.2.2"
+			}
+		},
 		"color-support": {
 			"version": "1.1.3",
 			"resolved": "https://registry.npmjs.org/color-support/-/color-support-1.1.3.tgz",
@@ -25610,9 +26227,9 @@
 			"integrity": "sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg=="
 		},
 		"detect-libc": {
-			"version": "2.0.2",
-			"resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.2.tgz",
-			"integrity": "sha512-UX6sGumvvqSaXgdKGUsgZWqcUyIXZ/vZTrlRT/iobiKhGL0zL4d3osHj3uqllWJK+i+sixDS/3COVEOFbupFyw=="
+			"version": "2.0.3",
+			"resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.3.tgz",
+			"integrity": "sha512-bwy0MGW55bG41VqxxypOsdSdGqLwXPI/focwgTYCFMbdUiBAxLg9CFzG08sz2aqzknwiX7Hkl0bQENjg8iLByw=="
 		},
 		"dfa": {
 			"version": "1.2.0",
@@ -33271,6 +33888,42 @@
 			"resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz",
 			"integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ=="
 		},
+		"sharp": {
+			"version": "0.33.5",
+			"resolved": "https://registry.npmjs.org/sharp/-/sharp-0.33.5.tgz",
+			"integrity": "sha512-haPVm1EkS9pgvHrQ/F3Xy+hgcuMV0Wm9vfIBSiwZ05k+xgb0PkBQpGsAA/oWdDobNaZTH5ppvHtzCFbnSEwHVw==",
+			"requires": {
+				"@img/sharp-darwin-arm64": "0.33.5",
+				"@img/sharp-darwin-x64": "0.33.5",
+				"@img/sharp-libvips-darwin-arm64": "1.0.4",
+				"@img/sharp-libvips-darwin-x64": "1.0.4",
+				"@img/sharp-libvips-linux-arm": "1.0.5",
+				"@img/sharp-libvips-linux-arm64": "1.0.4",
+				"@img/sharp-libvips-linux-s390x": "1.0.4",
+				"@img/sharp-libvips-linux-x64": "1.0.4",
+				"@img/sharp-libvips-linuxmusl-arm64": "1.0.4",
+				"@img/sharp-libvips-linuxmusl-x64": "1.0.4",
+				"@img/sharp-linux-arm": "0.33.5",
+				"@img/sharp-linux-arm64": "0.33.5",
+				"@img/sharp-linux-s390x": "0.33.5",
+				"@img/sharp-linux-x64": "0.33.5",
+				"@img/sharp-linuxmusl-arm64": "0.33.5",
+				"@img/sharp-linuxmusl-x64": "0.33.5",
+				"@img/sharp-wasm32": "0.33.5",
+				"@img/sharp-win32-ia32": "0.33.5",
+				"@img/sharp-win32-x64": "0.33.5",
+				"color": "^4.2.3",
+				"detect-libc": "^2.0.3",
+				"semver": "^7.6.3"
+			},
+			"dependencies": {
+				"semver": {
+					"version": "7.6.3",
+					"resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+					"integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A=="
+				}
+			}
+		},
 		"shebang-command": {
 			"version": "2.0.0",
 			"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@@ -33299,6 +33952,21 @@
 			"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz",
 			"integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ=="
 		},
+		"simple-swizzle": {
+			"version": "0.2.2",
+			"resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
+			"integrity": "sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==",
+			"requires": {
+				"is-arrayish": "^0.3.1"
+			},
+			"dependencies": {
+				"is-arrayish": {
+					"version": "0.3.2",
+					"resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
+					"integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ=="
+				}
+			}
+		},
 		"simplex-noise": {
 			"version": "4.0.1",
 			"resolved": "https://registry.npmjs.org/simplex-noise/-/simplex-noise-4.0.1.tgz",

package.json

@@ -78,6 +78,7 @@
 		"remotion": "4.0.19",
 		"remotion-animated": "^2.0.0",
 		"remotion-transition-series": "^0.0.10",
+		"sharp": "^0.33.5",
 		"socket.io": "^4.7.2",
 		"styled-components": "^6.0.5",
 		"syllable-count-english": "^1.0.6",
@@ -92,4 +93,4 @@
 	"devDependencies": {
 		"@types/lodash": "^4.14.199"
 	}
-}
+}

scripts/white2transparent.js

@@ -0,0 +1,55 @@
+import sharp from 'sharp';
+
+async function processImage(inputPath, outputPath) {
+	try {
+		// Read the input image as raw pixel data
+		const {data, info} = await sharp(inputPath)
+			.ensureAlpha()
+			.raw()
+			.toBuffer({resolveWithObject: true});
+
+		// Create a new buffer for the output image with RGBA data
+		const outputBuffer = Buffer.alloc(info.width * info.height * 4);
+
+		for (let i = 0; i < info.width * info.height; i++) {
+			const r = data[i * 4];
+			const g = data[i * 4 + 1];
+			const b = data[i * 4 + 2];
+			const a = data[i * 4 + 3]; // Original alpha
+
+			// Check if the pixel is pure white
+			if (r === 255 && g === 255 && b === 255) {
+				// Replace white with transparency
+				outputBuffer[i * 4] = r; // R
+				outputBuffer[i * 4 + 1] = g; // G
+				outputBuffer[i * 4 + 2] = b; // B
+				outputBuffer[i * 4 + 3] = 0; // A (fully transparent)
+			} else {
+				// Preserve the original color and alpha
+				outputBuffer[i * 4] = r;
+				outputBuffer[i * 4 + 1] = g;
+				outputBuffer[i * 4 + 2] = b;
+				outputBuffer[i * 4 + 3] = a;
+			}
+		}
+
+		// Write the processed image to a PNG file
+		await sharp(outputBuffer, {
+			raw: {
+				width: info.width,
+				height: info.height,
+				channels: 4,
+			},
+		}).toFile(outputPath);
+
+		console.log(`Image processed successfully and saved to ${outputPath}`);
+	} catch (error) {
+		console.error('Error processing image:', error);
+	}
+}
+
+// Example usage
+const inputImagePath = 'public/icons-white.jpeg'; // Input image path
+const outputImagePath = 'public/icons-white.png'; // Output image path
+
+processImage(inputImagePath, outputImagePath);

src/paperdrive/PaperDriveHorizontalCoverComposition.tsx

@@ -58,8 +58,10 @@ export function PaperDriveFrontCover({ transcript, style }: { transcript: Transc
 
     return (
         <div style={{
+            backgroundSize: extras?.backgroundImage ? 'cover' : undefined,
+            backgroundPosition: extras?.backgroundImage ? 'center' : undefined,
+            backgroundRepeat: extras?.backgroundImage ? 'no-repeat' : undefined,
             backgroundColor: extras?.backgroundColor ?? "black",
-            backgroundSize: extras?.backgroundImage ? `100% 100%` : undefined,
             backgroundImage: extras?.backgroundImage ? `url(${staticFile(RenderUtils.getFileName(extras?.backgroundImage!)!)})` : undefined,
             ...style
         }}>
@@ -156,7 +158,11 @@ export function PaperDriveBackCover({ transcript, style }: { transcript: Transcr
 
     return (
         <div style={{
+            backgroundSize: extras?.backgroundImage ? 'cover' : undefined,
+            backgroundPosition: extras?.backgroundImage ? 'center' : undefined,
+            backgroundRepeat: extras?.backgroundImage ? 'no-repeat' : undefined,
             backgroundColor: extras?.backgroundColor ?? "black",
+            backgroundImage: extras?.backgroundImage ? `url(${staticFile(RenderUtils.getFileName(extras?.backgroundImage!)!)})` : undefined,
             ...style
         }}>
             <div style={{

src/paperdrive/PaperDrivePage.tsx

@@ -52,32 +52,42 @@ export function PaperDrivePage({ transcript }: { transcript: Transcript }) {
             objectFit: 'cover'
           }} />
       }
-      <AbsoluteFill style={{
-        zIndex: 10,
-        position: 'relative',
-        padding: '20px',
-        backgroundImage: `linear-gradient(to bottom, transparent 94%, ${extras?.lineColor ?? 'lightgray'} 94%)`,
-        backgroundSize: '100% 30px'
-      }}>
-      </AbsoluteFill>
-
-      <QRCode
-        style={extras?.qr?.position ?? {
-          zIndex: 1000,
-          position: 'absolute',
-          top: 0,
-          right: 0
-        }}
-        fgColor={extras?.qr?.color ?? 'black'}
-        size={qrSize ?? defaultQrSize}
-        value={extras?.qr?.url}
-        qrStyle={extras?.qr?.qrStyle ?? 'squares'}
-        logoImage={logo}
-        logoWidth={qrSize ?? defaultQrSize}
-        logoHeight={qrSize ?? defaultQrSize}
-        logoOpacity={extras?.qr?.logoOpacity ?? 0.1}
-        removeQrCodeBehindLogo={false}
-      />
+      {
+        extras?.lineColor && (
+
+          <AbsoluteFill style={{
+            zIndex: 10,
+            position: 'relative',
+            padding: '20px',
+            backgroundImage: `linear-gradient(to bottom, transparent 94%, ${extras?.lineColor} 94%)`,
+            backgroundSize: '100% 30px'
+          }}>
+          </AbsoluteFill>
+        )
+      }
+
+      {
+        extras?.qr && (
+
+          <QRCode
+            style={extras?.qr?.position ?? {
+              zIndex: 1000,
+              position: 'absolute',
+              top: 0,
+              right: 0
+            }}
+            fgColor={extras?.qr?.color ?? 'black'}
+            size={qrSize ?? defaultQrSize}
+            value={extras?.qr?.url}
+            qrStyle={extras?.qr?.qrStyle ?? 'squares'}
+            logoImage={logo}
+            logoWidth={qrSize ?? defaultQrSize}
+            logoHeight={qrSize ?? defaultQrSize}
+            logoOpacity={extras?.qr?.logoOpacity ?? 0.1}
+            removeQrCodeBehindLogo={false}
+          />
+        )
+      }
       <div style={{
         position: 'absolute',
         top: '0',
@@ -163,15 +173,20 @@ export function PaperDrivePage({ transcript }: { transcript: Transcript }) {
 
         </div>
       </div>
-      <div style={{
-        position: 'absolute',
-        left: extras?.marginLeft ?? '10%',
-        top: '0',
-        height: '100%',
-        width: '2px',
-        backgroundColor: extras?.leftMarginLineColor ?? 'lightgray',
-      }}>
-      </div>
+      {
+        extras?.leftMarginLineColor && (
+          <div style={{
+            position: 'absolute',
+            left: extras?.marginLeft ?? '10%',
+            top: '0',
+            height: '100%',
+            width: '2px',
+            backgroundColor: extras?.leftMarginLineColor,
+          }}>
+          </div>
+        )
+      }
+
 
       <div style={{
         width: '100%',

start.sh

@@ -1,14 +1,19 @@
-export DISPLAY=:11.0 && is_pm2=1 npm start
+export DISPLAY=:11.0 && is_pm2=1 node server.js
 
 
 # sudo nano /etc/systemd/system/media-render-farm.service
+# sudo systemctl status media-render-farm.service
+# sudo systemctl restart media-render-farm.service
+# sudo systemctl daemon-reload
+# sudo systemctl restart media-render-farm.service
+# journalctl -u media-render-farm.service -f
 
 # [Unit]
 # Description=Semibit Media Render Farm
 # After=network.target
 
 # [Service]
-# ExecStart=/home/ubuntu/apps/node/semibit-media-render-farm/start.sh
+# ExecStart=/home/ubuntu/apps/node/semibit-media-render-farm/sstart.sh
 # WorkingDirectory=/home/ubuntu/apps/node/semibit-media-render-farm
 # Restart=always
 # User=ubuntu