decorations: add Nitro Exclusives section

app/data/decorations.js

@@ -1,6 +1,54 @@
 export const decorationsData = [
 	{
-		n: "Discord",
+		n: "Nitro Exclusives  ",
+		d: "Miscellaneous decorations and quest rewards.",
+		b: {
+			i: [
+				{
+					url: "string_lights.png",
+					align: "top left",
+					height: "160%",
+					transform: "scaleX(-1) translateY(-20%)",
+				},
+				{
+					url: "hearts.png",
+					align: "top right",
+					height: "150%",
+					transform: "translateY(-5%)",
+				},
+			],
+			bg: "linear-gradient(90deg, hsl(269.291 52.697% 52.745%) 0%, hsl(295.645 50% 51.373%) 50%, hsl(325.385 31.707% 51.765%) 100%)",
+		},
+		i: [
+			{
+				n: "Gyoiko Sakura",
+				d: "A rare blossom only seen by a fortunate few. Given to new nitro subscribers between April 24, 2024 and May 1, 2024.",
+				f: "sakura_gyoiko",
+			},
+			{
+				n: "2025 Balloons",
+				d: "Cheers to 2025!!",
+				f: "new_year_2025",
+			},
+			{
+				n: "Holiday Cat Ears",
+				d: "o<≽^ᴖ ωᴖ^≼",
+				f: "santa_cat_ears",
+			},
+			{
+				n: "Snowfall",
+				d: "From chill to chilly.",
+				f: "snowfall",
+			},
+			{
+				n: "Heart-to-Heart",
+				d: "Feel the love all around.",
+				f: "heart_to_heart",
+			},
+		],
+	},
+	{
+		n: "Quests",
 		d: "Miscellaneous decorations and quest rewards.",
 		b: {
 			i: [
@@ -12,7 +60,7 @@ export const decorationsData = [
 					url: "sakura.svg",
 					align: "right",
 					height: "100%",
-					opacity: "0.8",
+					opacity: "0.9",
 				},
 			],
 			bg: "linear-gradient(90deg, rgba(52,65,217,1) 0%, rgba(154,68,247,1) 100%)",
@@ -28,11 +76,6 @@ export const decorationsData = [
 				d: "An affectionate Mokoko wants to give you plenty of hugs! Exclusive to Mokoko Quest 2024 for a limited time.",
 				f: "mokoko",
 			},
-			{
-				n: "Gyoiko Sakura",
-				d: "A rare blossom only seen by a fortunate few. Given to new nitro subscribers between April 24, 2024 and May 1, 2024.",
-				f: "sakura_gyoiko",
-			},
 			{
 				n: "Warp Helmet",
 				d: "Traveling at the speed of light. Available to use until September 9, 2024.",
@@ -118,21 +161,6 @@ export const decorationsData = [
 				d: "Exclusive to The Sonic 3 Quest for a limited time. Available until to use February 21, 2025.",
 				f: "shadow",
 			},
-			{
-				n: "2025 Balloons",
-				d: "Cheers to 2025!!",
-				f: "new_year_2025",
-			},
-			{
-				n: "Holiday Cat Ears",
-				d: "o<≽^ᴖ ωᴖ^≼",
-				f: "santa_cat_ears",
-			},
-			{
-				n: "Snowfall",
-				d: "From chill to chilly.",
-				f: "snowfall",
-			},
 			{
 				n: "Rec Room Lightning",
 				d: "Exclusive to the Rec Room Quest for a limited time. Available until to use March 1, 2025.",
@@ -153,11 +181,6 @@ export const decorationsData = [
 				d: "Exclusive to the Strinova Fuchsia Quest for a limited time. Available to use until March 24, 2024.",
 				f: "fuchsia_agent",
 			},
-			{
-				n: "Heart-to-Heart",
-				d: "Feel the love all around.",
-				f: "heart_to_heart",
-			},
 		],
 	},
 	{

app/page.jsx

@@ -304,14 +304,20 @@ const App = ({ ffmpegRef, isServer }) => {
 																height: e.height || "auto",
 																width: e.width || (e.height ? "auto" : "100%"),
 																left:
-																	e.align === "left" || e.align === "center"
+																	e.align.includes("left") ||
+																	e.align === "center"
 																		? 0
 																		: "",
 																right:
-																	e.align === "right" || e.align === "center"
+																	e.align.includes("right") ||
+																	e.align === "center"
 																		? 0
 																		: "",
+																top: e.align.includes("top") ? 0 : "",
+																bottom: e.align.includes("bottom") ? 0 : "",
 																objectPosition: e.align,
+																opacity: e.opacity || 1,
+																transform: e.transform || "",
 															}}
 														/>
 													))}